@font-face{font-family:'Inter';src:url('../fonts/Inter-Regular.otf') format('opentype');font-weight:300 500;font-style:normal;font-display:swap;}
@font-face{font-family:'Inter';src:url('../fonts/Inter-Medium.otf') format('opentype');font-weight:600;font-style:normal;font-display:swap;}
@font-face{font-family:'Inter';src:url('../fonts/Inter-Bold.otf') format('opentype');font-weight:700 900;font-style:normal;font-display:swap;}
:root{--soc-ink:#111827;--soc-muted:#6b7280;--soc-line:#e5e7eb;--soc-bg:#f4f5f7;--soc-soft:#f3f4f6;--soc-blue:#1a73e8}
*{box-sizing:border-box}body.social-page{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif;font-style:normal;font-synthesis:none;background:var(--soc-bg);color:var(--soc-ink)}button,input{font:inherit}.social-shell{min-height:100vh;display:grid;grid-template-columns:271px 1fr}.social-sidebar{position:sticky;top:0;height:100vh;background:#fff;border-right:1px solid var(--soc-line);padding:22px 14px;display:flex;flex-direction:column;gap:24px}.social-brand{font-weight:900;font-size:18px;line-height:1.12;padding:6px 10px;max-width:180px}.social-nav{display:grid;gap:10px}.social-nav-btn{border:none;background:transparent;border-radius:14px;min-height:44px;padding:0 13px;display:flex;align-items:center;gap:12px;font-size:14px;font-weight:400;color:#374151;cursor:pointer;transition:.16s;text-align:left}.social-nav-btn img{width:18px;height:18px;object-fit:contain}.social-nav-btn:hover{background:#f3f4f6}.social-nav-btn.active{background:#eaf2ff;border-color:#b8d3ff;color:#1558c7}.social-note{margin-top:auto;color:#64748b;font-size:12px;line-height:1.35;padding:10px}.social-main{min-width:0}.social-top{position:sticky;top:0;z-index:3;background:rgba(244,245,247,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--soc-line);padding:16px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px}.social-title{font-size:22px;font-weight:900;line-height:1.1}.social-subtitle{font-size:13px;color:var(--soc-muted);margin-top:5px}.social-search{width:240px;border:none;border-radius:999px;min-height:38px;padding:0 16px;background:#fff;color:#374151;outline:none}.social-search:focus { outline: none; box-shadow: none; }.social-card{
  display: flex;
  flex-direction: column;
background:#fff;border:none;border-radius:14px;padding:9px;box-shadow:none;display:grid;gap:7px;transition:.16s}.social-card-img img{display:block;max-width:100%;max-height:100%;object-fit:contain}.social-card-body{display:grid;gap:7px}.social-card-title{display:none}.social-card-meta{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:5px;color:#4b5563;font-size:10px;line-height:1}.social-card-meta span:nth-child(3){justify-self:end;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:84px}.social-card-actions{
  margin-top: auto;
  display: flex;
  gap: 10px;
position:static;display:flex;justify-content:center;margin-top:8px;}.social-btn{width:34px;height:34px;min-width:34px;border:none;background:#f3f4f6;color:#374151;border-radius:10px;padding:0;font-size:0;font-weight:400;cursor:pointer;transition:.16s;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:0}.social-btn:hover{background:#e5e7eb;border-color:#6b7280;color:#111827;transform:translateY(-1px)}.social-btn img{width:18px;height:18px;display:block;object-fit:contain;pointer-events:none}.social-btn.primary{background:#f3f4f6;border-color:#9ca3af;color:#374151}.social-empty{grid-column:1/-1;margin:42px auto;background:#fff;border:none;border-radius:18px;max-width:520px;padding:28px;text-align:center;color:#6b7280}.social-detail{display:none;position:fixed;inset:0;z-index:20;background:rgba(17,24,39,.46);padding:24px;overflow:auto}.social-detail.open{display:block}.social-detail-panel{width:min(1120px,100%);margin:auto;background:#fff;border-radius:22px;overflow:hidden;display:grid;grid-template-columns:minmax(300px,560px) 1fr;box-shadow:none;display:flex;align-items:center;justify-content:center;min-height:560px;padding:28px}.social-detail-image img{max-width:100%;max-height:520px;filter:drop-shadow(0 18px 35px rgba(15,23,42,.16))}.social-detail-side{padding:20px;display:grid;gap:14px;align-content:start}.social-detail-head{display:flex;justify-content:space-between;gap:12px;align-items:center}.social-close{border:none;background:#f3f4f6;border-radius:999px;width:38px;height:38px;cursor:pointer;font-size:20px}.social-prompt{white-space:pre-wrap;border:none;background:#f8fafc;border-radius:14px;padding:13px;color:#374151;font-size:13px;line-height:1.45;max-height:210px;overflow:auto}.social-comments{display:grid;gap:8px;max-height:210px;overflow:auto}.social-comment{border:none;background:#f9fafb;border-radius:14px;padding:10px}.social-comment strong{display:block;font-size:13px;margin-bottom:4px}.social-comment p{margin:0;color:#4b5563;font-size:13px;line-height:1.4}.social-comment-form{display:flex;gap:8px}.social-comment-form input{flex:1;border:none;border-radius:12px;min-height:36px;padding:0 11px}.social-detail-actions{display:flex;flex-wrap:wrap;gap:8px}.social-detail-actions .social-btn{width:auto;min-width:34px;font-size:12px;padding:0 10px}.social-toast{position:fixed;right:18px;bottom:18px;background:#111827;color:#fff;border-radius:14px;padding:12px 14px;opacity:0;transform:translateY(12px);pointer-events:none;transition:.18s;z-index:30}.social-toast.show{opacity:1;transform:translateY(0)}
@media(max-width:900px){.social-shell{grid-template-columns:1fr}.social-sidebar{position:static;height:auto;border-right:0;border-bottom:1px solid var(--soc-line)}.social-nav{grid-template-columns:1fr 1fr}.social-brand{max-width:none}.social-top{align-items:flex-start;flex-direction:column}.social-search{width:100%;min-width:0}\.social-grid{gap:18px;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));padding:14px}.social-detail-panel{grid-template-columns:1fr}.social-detail-image{min-height:340px}.social-detail{padding:10px}}

/* Logo inspiration cards, preview-style */
.social-nav-link{ text-decoration:none; }
.social-grid{grid-template-columns:repeat(auto-fill,280px);gap:20px;align-items:start}.social-card{
  display: flex;
  flex-direction: column;
border:none;border-radius:18px;padding:12px;background:#fff;box-shadow:none;gap:10px;position:relative}.social-card-author{display:flex;align-items:center;gap:10px;min-width:0}.social-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;background:#e5e7eb;display:block}.social-author-name{font-size:15px;font-weight:700;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:195px}.social-author-followers{font-size:12px;color:#6b7280;margin-top:2px;white-space:nowrap}.social-card-img{border-radius:16px;border:none;font-size:15px;font-weight:800;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.social-card-stats{font-size:12px;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.social-card-body{gap:8px}.social-card-actions{
  margin-top: auto;
  display: flex;
  gap: 10px;
position:static;display:flex;justify-content:center;margin-top:8px;}.social-btn{font-size:12px;width:auto;min-width:34px;height:32px;border-color:#e5e7eb;background:#fff;border-radius:12px;color:#111827;padding:0 9px;gap:5px}.social-btn img{width:16px;height:16px}.social-btn span{font-size:12px;line-height:1}.social-btn.icon-only{width:34px;padding:0}.social-btn.like{min-width:64px}.social-btn.like.active{background:#f3f4f6;border-color:#cbd5e1;font-weight:800}.social-btn.save{padding:0 10px}.social-menu-wrap{position:relative}.social-menu{display:none;position:absolute;right:0;top:38px;bottom:auto;width:190px;background:#fff;border:none;border-radius:14px;box-shadow:none;padding:7px;z-index:10}.social-menu-wrap.open .social-menu{display:grid}.social-menu button{border:none;background:transparent;text-align:left;border-radius:10px;padding:9px 10px;font-size:13px;color:#111827;cursor:pointer}.social-menu button:hover{background:#f3f4f6}.social-menu button.danger{color:#dc2626}.social-detail-actions .social-btn{font-size:12px}.social-card-meta{display:none}@media(max-width:900px){.social-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.social-nav{grid-template-columns:1fr 1fr}.social-card{
  display: flex;
  flex-direction: column;
border-radius:18px}}


/* === v4 fixes: header auth, overlay menus, responsive cards, generator, lazy loading === */
.social-top{z-index:50}.social-search{flex:0 1 360px;width:min(360px,38vw)}
.social-userbox{display:flex;align-items:center;gap:10px;margin-left:auto;white-space:nowrap}
.social-user-avatar{width:34px;height:34px;border-radius:50%;object-fit:cover;background:#e5e7eb;display:block;border:none;font-weight:700;color:#111827;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.social-user-action{border:none;background:transparent;color:#374151;font-size:14px;cursor:pointer;padding:6px 2px;text-decoration:none}.social-user-action:hover{color:#111827;text-decoration:underline}
.social-user-sep{color:#cbd5e1}
.social-grid{padding:20px 22px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;align-items:start;justify-content:stretch;overflow:visible}
.social-card{
  display: flex;
  flex-direction: column;
width:100%;overflow:visible;position:relative}.social-card.menu-open{z-index:2000}.social-menu-wrap{position:relative}.social-menu{z-index:3000;top:40px;bottom:auto}.social-menu-wrap.open .social-menu{display:grid}
.social-load-more{margin:0 22px 24px;padding:14px;text-align:center;border:none;background:#fff;border-radius:14px;color:#374151;cursor:pointer}.social-load-more:hover{background:#f9fafb}
.social-auth-modal{display:none;position:fixed;inset:0;z-index:5000;background:rgba(17,24,39,.48);align-items:center;justify-content:center;padding:20px}.social-auth-modal.open{display:flex}.social-auth-panel{width:min(420px,100%);background:#fff;border-radius:22px;padding:24px;box-shadow:none;position:relative}.social-auth-close{position:absolute;right:14px;top:12px;border:none;background:#f3f4f6;border-radius:999px;width:34px;height:34px;cursor:pointer;font-size:20px}.social-auth-avatar{display:flex;justify-content:center;margin-bottom:10px}.social-auth-avatar img{width:58px;height:58px;border-radius:50%;background:#eef2f7}.social-auth-panel h2{margin:0 0 6px;text-align:center;font-size:24px}.social-auth-panel p{margin:0 0 18px;text-align:center;color:#6b7280;font-size:14px;line-height:1.4}.social-auth-panel form{display:grid;gap:10px}.social-auth-panel input{border:none;border-radius:13px;min-height:42px;padding:0 13px;outline:none}.social-auth-panel input:focus{box-shadow:none;border-color:#93c5fd}.social-auth-submit{border:none;border-radius:13px;min-height:42px;background:#111827;color:#fff;font-weight:800;cursor:pointer}.social-auth-error{min-height:18px;margin-top:10px;color:#dc2626;font-size:13px;text-align:center}
.social-generator{padding:20px 22px}.social-generator-card{background:#fff;border:none;border-radius:22px;padding:24px;max-width:980px;box-shadow:none;font-size:26px}.social-generator-head p{margin:0 0 18px;color:#6b7280}.social-field-label{display:block;font-weight:800;margin:0 0 8px}.social-generator-textarea{width:100%;resize:vertical;border:none;border-radius:16px;padding:14px;outline:none;font:inherit;line-height:1.45}.social-generator-textarea:focus{box-shadow:none;border-color:#93c5fd}.social-generator-actions{display:flex;align-items:center;gap:12px;margin-top:14px;flex-wrap:wrap}.social-generator-btn{border:none;background:#111827;color:#fff;border-radius:14px;padding:12px 18px;font-weight:800;cursor:pointer}.social-generator-status{color:#6b7280;font-size:14px}.social-generator-result{margin-top:18px;display:grid;gap:12px}.social-generator-result img{max-width:360px;width:100%;border-radius:18px;border:none;background:#f8fafc}.social-generator-result a{display:inline-flex;width:max-content;border:none;border-radius:12px;padding:9px 12px;color:#111827;text-decoration:none;background:#fff}
@media(max-width:900px){.social-userbox{margin-left:0}.social-search{width:100%;flex:auto}.social-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));padding:14px}.social-generator{padding:14px}}


/* === v5 fixes === */
.social-grid{
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr)) !important;
  justify-content:stretch !important;
  align-items:start;
  overflow:visible;
}
.social-card{
  display: flex;
  flex-direction: column;
width:100%;}
.social-card-stats{
  display:grid;
  gap:3px;
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  line-height:1.25;
}
.social-detail.open{
  display:flex !important;
  align-items:center;
  justify-content:center;
}
.social-detail{
  padding:84px 24px 24px;
}
.social-detail-panel{
  margin:auto !important;
  max-height:calc(100vh - 108px);
}
.social-detail-side,
.social-detail-image{
  min-height:0;
}
.social-detail-side{
  overflow:auto;
}
.social-detail-image img{
  max-height:calc(100vh - 180px);
}
.social-menu{z-index:9999 !important;}
.social-card.menu-open{z-index:9998 !important;}
@media(max-width:900px){
  .social-detail{padding:20px 10px;align-items:flex-start !important;}
  .social-detail-panel{max-height:none;}
}

/* === v6 fixes === */
.social-detail{
  z-index:4000 !important;
  background:rgba(17,24,39,.62) !important;
}
.social-top{
  z-index:50;
}
.social-card-stats{
  display:flex !important;
  align-items:center;
  gap:7px;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis;
  color:#6b7280;
  font-size:12px;
  line-height:1.25;
}
.social-card-stats i{
  display:inline-block;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#c4c9d1;
  flex:0 0 auto;
}
.social-card-title{
  max-width:100%;
}
.social-btn.like.active{
  color:#dc2626 !important;
  background:#fff1f2 !important;
  border-color:#fecdd3 !important;
}
.social-btn.dislike.active{
  color:#111827 !important;
  background:#f3f4f6 !important;
  border-color:#111827 !important;
}
.social-card-actions{
  margin-top: auto;
  display: flex;
  gap: 10px;
position:static;display:flex;justify-content:center;margin-top:8px;}
.social-card-actions .social-btn{
  height:34px;
  min-width:38px;
  padding:0 10px;
}
.social-card-actions .social-btn.like{
  min-width:58px;
}
.social-card-actions .social-btn.save{
  min-width:92px;
  padding:0 12px;
}
.social-card-actions .social-btn.icon-only{
  width:38px;
  min-width:38px;
  padding:0;
}
.social-menu-wrap{
  margin-left:auto;
}
@media(max-width:520px){
  .social-card-stats{font-size:11px;gap:5px;}
  .social-card-actions .social-btn.save{min-width:82px;}
}

/* === v7: открытая карточка по превью === */
body.social-modal-open{overflow:hidden;}
.social-detail{position:fixed;inset:0;display:none;z-index:6000 !important;background:rgba(255,255,255,.72) !important;backdrop-filter:brightness(.72);padding:18px 28px !important;align-items:center !important;justify-content:center !important;}
.social-detail.open{display:flex !important;}
.social-detail-panel-preview{position:relative;width:min(1120px,calc(100vw - 56px));max-height:calc(100vh - 36px);display:grid;grid-template-columns:minmax(360px,48%) minmax(360px,52%);gap:46px;background:#fff;border-radius:0;box-shadow:none;border:none;padding:0 44px 0 0;overflow:auto;margin:0 auto !important;}
.social-detail-close{position:fixed;right:34px;top:18px;width:40px;height:40px;border:none;border-radius:10px;background:#f8fafc;color:#111827;font-size:26px;line-height:1;z-index:6100;cursor:pointer;}
.social-detail-left{padding:28px 0 28px 6px;display:flex;flex-direction:column;align-items:center;gap:14px;min-width:0;}
.social-detail-panel-preview .social-detail-image{width:100%;min-height:0;background:transparent;border:none;border-radius:24px;display:block;overflow:visible;}
.social-detail-panel-preview .social-detail-image img{width:100%;max-height:calc(100vh - 215px);object-fit:contain;border-radius:28px;background:#f8fafc;border:none;display:block;}
.social-detail-under-meta{width:100%;display:flex;align-items:center;justify-content:flex-start;gap:8px;color:#6b7280;font-size:14px;padding-left:26px;box-sizing:border-box;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.social-detail-under-meta i{width:4px;height:4px;border-radius:50%;background:#c4c9d1;display:inline-block;flex:0 0 auto;}
.social-detail-bottom-actions{width:100%;display:flex;align-items:center;justify-content:flex-start;gap:8px;padding-left:20px;box-sizing:border-box;}
.social-detail-bottom-actions .social-btn{height:34px;border-radius:14px;background:#f4f5f7;border:none;padding:0 12px;min-width:44px;font-weight:700;}
.social-detail-bottom-actions .social-btn.like{min-width:76px;}
.social-detail-bottom-actions .social-btn.save{min-width:112px;}
.social-detail-bottom-actions .social-btn.icon-only{width:38px;min-width:38px;padding:0;}
.social-detail-bottom-actions .social-btn.like.active{color:#dc2626 !important;background:#fff1f2 !important;}
.social-detail-bottom-actions .social-btn.dislike.active{color:#111827 !important;background:#e5e7eb !important;border:none;}
.social-detail-side-preview{padding:12px 0 32px;overflow:visible;display:block;min-width:0;}
.social-detail-title{font-size:34px;line-height:1.12;margin:0 0 12px;color:#191919;font-weight:500;letter-spacing:-.02em;}
.social-detail-author-row{display:flex;align-items:center;gap:12px;margin:0 0 28px;}
.social-detail-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;background:#eef2f7;display:block;}
.social-detail-author{font-size:16px;color:#111827;font-weight:800;line-height:1.15;}
.social-detail-followers{font-size:12px;color:#6b7280;margin-top:2px;}
.social-detail-section{margin:0 0 28px;}
.social-detail-section h3{font-size:16px;margin:0 0 10px;color:#111827;font-weight:800;}
.social-prompt-preview{border:none;border-radius:14px;padding:16px 14px;background:#fff;color:#4b5563;font-size:14px;line-height:1.45;min-height:48px;box-sizing:border-box;}
.social-comments-head{display:flex;align-items:center;justify-content:space-between;margin:0 0 16px;gap:12px;}
.social-comments-head h3{font-size:22px;margin:0;font-weight:800;color:#191919;}
.social-sort-btn{border:none;background:transparent;display:flex;align-items:center;gap:10px;font-weight:700;color:#303030;cursor:pointer;padding:8px;border-radius:10px;}
.social-sort-btn span{width:18px;height:14px;display:inline-block;background:linear-gradient(#111,#111) left 1px/18px 2px no-repeat,linear-gradient(#111,#111) left 6px/12px 2px no-repeat,linear-gradient(#111,#111) left 11px/7px 2px no-repeat;}
.social-comment-composer{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.social-comment-avatar{width:34px;height:34px;border-radius:50%;object-fit:cover;background:#eef2f7;flex:0 0 auto;}
.social-comment-composer input{flex:1;border:none;border-bottom:1px solid #d1d5db;min-height:38px;outline:none;font-size:14px;padding:0 4px;background:transparent;}
.social-comment-send-row{display:flex;justify-content:flex-end;gap:12px;margin:2px 0 26px;}
.social-comment-cancel{border:none;background:transparent;color:#111827;font-weight:700;padding:10px 8px;cursor:pointer;}
.social-comment-submit{border:none;border-radius:999px;background:#0b66d8;color:#fff;font-weight:800;padding:11px 18px;cursor:pointer;}
.social-comments-preview{display:grid;gap:22px;max-height:none;overflow:visible;}
.social-comment-preview{display:flex;align-items:flex-start;gap:12px;border:none;background:transparent;padding:0;margin:0;}
.social-comment-content{flex:1;min-width:0;}
.social-comment-line{display:flex;align-items:baseline;gap:5px;flex-wrap:wrap;font-size:14px;color:#111827;}
.social-comment-line strong{font-weight:800;}
.social-comment-line span{font-size:13px;color:#6b7280;}
.social-comment-preview p{margin:4px 0 8px;color:#111827;font-size:14px;line-height:1.4;}
.social-comment-actions{display:flex;align-items:center;gap:14px;color:#374151;font-size:13px;}
.social-comment-actions button{border:none;background:transparent;cursor:pointer;color:#374151;padding:0;font-weight:700;}
.social-comment-empty{color:#6b7280;font-size:14px;padding:8px 0;}
.social-detail-actions-hidden{display:none;}
@media(max-width:900px){.social-detail{padding:10px !important;align-items:flex-start !important;overflow:auto;}.social-detail-panel-preview{width:100%;max-height:none;gap:18px;padding:0 14px 24px;border-radius:18px;}.social-detail-close{right:18px;top:16px}.social-detail-left{padding:54px 0 0}.social-detail-panel-preview .social-detail-image img{max-height:60vh}.social-detail-title{font-size:28px}.social-detail-side-preview{padding-bottom:20px}.social-detail-under-meta,.social-detail-bottom-actions{padding-left:0}}


/* === v8 requested fixes === */
.social-detail{
  background:rgba(0,0,0,.82) !important;
  backdrop-filter:none !important;
}
.social-prompt-preview{
  border:none;
}
.social-comments-preview{
  max-height:340px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:14px;
  scrollbar-width:none;
  position:relative;
}
.social-comments-preview::-webkit-scrollbar{width:0;height:0;display:none;}
.social-comments-preview::after{
  content:"";
  position:sticky;
  right:2px;
  top:50%;
  float:right;
  width:8px;
  height:8px;
  margin-right:-10px;
  border-radius:50%;
  background:#b8bec8;
  opacity:.9;
}
.social-sort-wrap{position:relative;display:inline-flex;align-items:center;}
.social-sort-menu{display:none;position:absolute;right:0;top:38px;width:190px;background:#fff;border:none;border-radius:14px;box-shadow:none;padding:7px;z-index:7000;}
.social-sort-wrap.open .social-sort-menu{display:grid;}
.social-sort-menu button{border:none;background:transparent;text-align:left;border-radius:10px;padding:10px 11px;font-size:14px;color:#111827;cursor:pointer;}
.social-sort-menu button:hover{background:#f3f4f6;}
.social-btn img,.social-comment-actions img{filter:grayscale(1) brightness(0) !important;}
.social-btn.like.active,.social-detail-bottom-actions .social-btn.like.active{color:#111827 !important;background:#fff !important;border:none;}
.social-btn.dislike.active,.social-detail-bottom-actions .social-btn.dislike.active{color:#111827 !important;background:#fff !important;border:none;}
.social-comment-actions button{display:inline-flex;align-items:center;gap:4px;}
.social-comment-actions img{width:15px;height:15px;display:block;}
.detail-title-toggle{border:none;background:transparent;color:#111827;cursor:pointer;font-size:22px;line-height:1;vertical-align:middle;padding:0 4px;margin-left:3px;border-radius:8px;}
.detail-title-toggle:hover{background:#f3f4f6;}
.social-detail-bottom-actions{gap:6px !important;}
.social-detail-bottom-actions .social-btn{min-width:48px !important;padding:0 13px !important;}
.social-detail-bottom-actions .social-btn.like{min-width:82px !important;}
.social-detail-bottom-actions .social-btn.save{min-width:120px !important;}
.social-detail-bottom-actions .social-btn.icon-only{width:40px !important;min-width:40px !important;padding:0 !important;}

/* v9: правки открытого окна и комментариев */
.social-detail{
  background:rgba(17,24,39,.30) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.social-detail-panel-preview{
  border-radius:28px !important;
  overflow:hidden !important;
  box-shadow:none;
  padding:0 44px 0 0 !important;
}
.social-detail-close{
  position:absolute !important;
  left:16px !important;
  top:16px !important;
  right:auto !important;
  width:40px !important;
  height:40px !important;
  border-radius:18px !important;
  z-index:5 !important;
}
.social-detail-left{padding-top:72px !important;}
.social-prompt-preview,.social-prompt{border:none;border-style:solid !important;}
.social-comments-preview{
  max-height:360px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
  padding-right:14px !important;
  position:relative !important;
}
.social-comments-preview::-webkit-scrollbar{width:0 !important;height:0 !important;display:none !important;}
.social-comments-preview::after{
  content:"";
  position:sticky;
  display:block;
  width:8px;
  height:8px;
  border-radius:999px;
  background:#c4c9d1;
  left:100%;
  bottom:50%;
  margin-left:auto;
  opacity:.9;
  pointer-events:none;
}
.comment-like.active,.comment-dislike.active{border-color:#111827 !important;background:#fff !important;filter:none !important;}
.comment-like.active img,.comment-dislike.active img{filter:brightness(0) !important;}
@media(max-width:900px){
  .social-detail-panel-preview{border-radius:22px !important;padding:0 14px 24px !important;}
  .social-detail-close{left:18px !important;top:16px !important;}
  .social-detail-left{padding-top:66px !important;}
}


/* v10: исправления окна просмотра и комментариев */
.social-detail{
  background:rgba(17,24,39,.22) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.social-detail-panel-preview{
  border-radius:28px !important;
  overflow:hidden !important;
}
.social-detail-close{
  position:absolute !important;
  right:16px !important;
  left:auto !important;
  top:16px !important;
  border-radius:18px !important;
}
.social-detail-left{padding-top:28px !important;}
.social-detail-panel-preview .social-detail-image{
  border:none;
  border-radius:28px !important;
  background-color:#fff !important;
  background-image:
    linear-gradient(45deg,#eef1f5 25%,transparent 25%),
    linear-gradient(-45deg,#eef1f5 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,#eef1f5 75%),
    linear-gradient(-45deg,transparent 75%,#eef1f5 75%) !important;
  background-size:28px 28px !important;
  background-position:0 0,0 14px,14px -14px,-14px 0 !important;
  overflow:hidden !important;
  box-shadow:none;
}
.social-detail-panel-preview .social-detail-image img{
  background:transparent !important;
  border:none;
  box-shadow:none;
  filter:none !important;
  border-radius:18px !important;
}
.social-comment-submit:disabled{opacity:.55;cursor:not-allowed;}
@media(max-width:900px){
  .social-detail-close{right:18px !important;left:auto !important;top:16px !important;}
  .social-detail-left{padding-top:66px !important;}
}

/* v11 modal refinements */
.social-detail-panel-preview .social-detail-image{
  padding:6px !important;
  min-height:0 !important;
}
.social-detail-panel-preview .social-detail-image img{
  width:100% !important;
  height:auto !important;
  max-height:calc(100vh - 185px) !important;
  object-fit:contain !important;
}
.social-detail-left{
  gap:10px !important;
}
.social-comments-wrap{
  position:relative;
}
.social-comments-preview{
  max-height:min(42vh,420px) !important;
  overflow:auto !important;
  padding-right:18px !important;
  scrollbar-width:none !important;
}
.social-comments-preview::-webkit-scrollbar{width:0 !important;height:0 !important;display:none !important;}
.social-comments-preview::after{display:none !important;}
.social-comments-scroll-dot{
  position:absolute;
  right:2px;
  top:3px;
  width:13px;
  height:13px;
  border-radius:50%;
  background:#aeb4bd;
  display:none;
  pointer-events:none;
  transition:transform .08s linear;
}
.social-reply-form{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:8px;
  background:#f1f3f5;
  border:none;
  border-radius:999px;
  padding:7px 8px 7px 14px;
}
.social-reply-form input{
  flex:1;
  min-width:0;
  border:none;
  outline:0;
  background:transparent;
  font-size:14px;
}
.social-reply-form button{
  border:none;
  border-radius:999px;
  background:#111827;
  color:#fff;
  font-weight:800;
  padding:8px 13px;
  cursor:pointer;
}
.social-replies{
  margin-top:14px;
  display:grid;
  gap:14px;
}
.social-comment-reply{
  margin-left:0;
  padding-left:14px;
  border-left:2px solid #e5e7eb !important;
}
.social-detail-menu-wrap{position:relative;}
.social-detail-menu-wrap .social-detail-menu{
  position:absolute;
  right:0;
  bottom:calc(100% + 8px);
  min-width:220px;
  z-index:7000;
}
.social-detail-menu-wrap.open .social-detail-menu{display:block !important;}
.social-detail-close{
  right:16px !important;
  left:auto !important;
}
@media(max-width:900px){
  .social-detail-panel-preview .social-detail-image img{max-height:56vh !important;}
  .social-comments-preview{max-height:45vh !important;}
}


/* v12 final fixes: smaller preview, bell notifications, outer dropdown */
.social-top{z-index:3500;}
.social-bell{position:relative;width:40px;height:40px;border:none;background:#fff;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto;}
.social-bell img{width:21px;height:21px;display:block;}
.social-bell:hover,.social-bell.active{background:#f3f4f6;border-color:#cbd5e1;}
.social-bell span{position:absolute;right:-5px;top:-6px;min-width:19px;height:19px;border-radius:999px;background:#dc2626;color:#fff;font-size:11px;font-weight:900;line-height:19px;text-align:center;padding:0 5px;box-shadow:none;}
.social-bell.has-unread span{animation:socialBadgePulse .95s infinite;}
@keyframes socialBadgePulse{0%,100%{transform:scale(1)}50%{transform:scale(1.16)}}
.social-comments-count.notify-blink{display:inline-flex;align-items:center;justify-content:center;background:#dc2626;color:#fff;border-radius:999px;padding:3px 8px;animation:socialBadgePulse .95s infinite;font-weight:800;}
.social-detail-panel-preview{overflow:visible !important;}
.social-detail-left{padding-top:22px !important;}
.social-detail-panel-preview .social-detail-image{max-height:calc(100vh - 245px) !important;display:flex !important;align-items:center !important;justify-content:center !important;padding:10px !important;}
.social-detail-panel-preview .social-detail-image img{width:auto !important;max-width:92% !important;max-height:calc(100vh - 270px) !important;}
.social-detail-bottom-actions{margin-top:0 !important;}
.social-comments-scroll-dot{width:17px !important;height:17px !important;right:0 !important;background:#9ca3af !important;}
.social-detail-menu-wrap{position:relative !important;}
.social-detail-menu-wrap .social-detail-menu{position:absolute !important;left:calc(100% + 10px) !important;right:auto !important;top:0 !important;bottom:auto !important;min-width:220px !important;z-index:9000 !important;}
.social-detail-menu-wrap.open .social-detail-menu{display:grid !important;}
@media(max-width:900px){.social-detail-panel-preview{overflow:auto !important}.social-detail-menu-wrap .social-detail-menu{left:auto !important;right:0 !important;top:42px !important}.social-detail-panel-preview .social-detail-image img{max-height:50vh !important}.social-bell{width:38px;height:38px}}


/* v13: sidebar generator and calm notifications */
.social-shell{grid-template-columns:271px 1fr !important;}
.social-sidebar{width:271px !important;}
#socialGenerator{display:none !important;}
.social-side-generator{border:none;background:#f8fafc;border-radius:18px;padding:14px;display:grid;gap:10px;}
.social-side-generator[hidden]{display:none !important;}
.social-side-gen-label{font-size:13px;font-weight:800;color:#374151;}
.social-side-gen-textarea{width:100%;resize:vertical;min-height:150px;border:none;background:#fff;border-radius:14px;padding:12px;color:#111827;outline:none;font:inherit;font-size:13px;line-height:1.45;}
.social-side-gen-textarea::placeholder{color:#8b95a1;}
.social-side-gen-textarea:focus{border-color:#93c5fd;box-shadow:none;}
.social-side-gen-btn{border:none;background:#1a73e8;color:#fff;border-radius:14px;min-height:42px;padding:0 14px;font-size:14px;font-weight:400;cursor:pointer;}
.social-side-gen-btn:disabled{opacity:.65;cursor:wait;}
.social-generator-status{font-size:12px;color:#6b7280;line-height:1.35;}
.social-generated-placeholder{background:#fff;border:none;border-radius:14px;padding:9px;box-shadow:none;display:grid;gap:9px;}
.social-generated-placeholder .placeholder-preview{aspect-ratio:1/1;border:none;border-radius:12px;background:linear-gradient(45deg,#f3f4f6 25%,transparent 25%),linear-gradient(-45deg,#f3f4f6 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f3f4f6 75%),linear-gradient(-45deg,transparent 75%,#f3f4f6 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0;display:flex;align-items:center;justify-content:center;}
.social-spinner{width:38px;height:38px;border-radius:50%;border:none;border-top-color:#9ca3af;animation:socialSpin .8s linear infinite;}
@keyframes socialSpin{to{transform:rotate(360deg)}}
.social-generated-placeholder .placeholder-text{font-size:12px;color:#6b7280;text-align:center;}
.social-bell.has-unread span{animation:none !important;}
.social-comments-count.notify-blink{animation:none !important;background:transparent !important;color:inherit !important;padding:0 !important;font-weight:inherit !important;}
.social-comment-number-badge{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;border-radius:999px;background:#dc2626;color:#fff;font-size:11px;font-weight:800;line-height:18px;padding:0 5px;margin-right:4px;vertical-align:middle;}
@media(max-width:900px){.social-shell{grid-template-columns:1fr !important}.social-sidebar{width:auto !important}.social-side-generator{order:3}}

/* User requested social generator tweaks */
.social-generated-placeholder{width:180px;min-height:258px;background:#fff;border:none;border-radius:14px;padding:9px;box-shadow:none;display:grid;gap:9px;}
.social-generated-placeholder .placeholder-preview{aspect-ratio:1/1;border:none;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;}
.social-spinner{width:42px;height:42px;border-radius:50%;border:none;border-top-color:#1a73e8;animation:socialSpin .8s linear infinite;}
.social-brand{max-width:none;}
@media(max-width:900px){.social-shell{grid-template-columns:1fr !important}}

/* v14: robust social generation result */
.social-generator-status.is-error{color:#b91c1c;white-space:pre-wrap;}
.social-img-error{position:absolute;color:#b91c1c;font-size:12px;text-align:center;padding:8px;}
.social-card-img{position:relative;}

/* v15: generation placeholder uses the same full card layout as published cards */
.social-generating-card{min-height:448px;}
.social-generating-card .social-card-img{cursor:default;}
.social-card-img.is-generating{aspect-ratio:1/1;border:none;border-radius:16px;background:linear-gradient(45deg,#f3f4f6 25%,transparent 25%),linear-gradient(-45deg,#f3f4f6 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f3f4f6 75%),linear-gradient(-45deg,transparent 75%,#f3f4f6 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0;display:flex;align-items:center;justify-content:center;}
.social-generating-card .social-card-actions{
  margin-top: auto;
  display: flex;
  gap: 10px;
position:static;display:flex;justify-content:center;margin-top:8px;}


/* v16: requested fixes — fixed card width, smaller detail preview, no central generation error */
.social-grid{
  grid-template-columns:repeat(auto-fill, minmax(280px, 304px)) !important;
  justify-content:start !important;
  align-items:start !important;
}
.social-card{
  display: flex;
  flex-direction: column;
width:100% !important;max-width:304px !important;}
.social-empty{max-width:520px !important;}
.social-detail-panel-preview .social-detail-image{padding:8px !important;}
.social-detail-panel-preview .social-detail-image img{
  max-width:84% !important;
  max-height:calc(100vh - 300px) !important;
}
.social-generator-status.is-error{white-space:normal !important;}
@media(max-width:900px){
  .social-grid{grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)) !important;justify-content:stretch !important;}
  .social-card{
  display: flex;
  flex-direction: column;
max-width:none !important;}
  .social-detail-panel-preview .social-detail-image img{max-width:88% !important;max-height:48vh !important;}
}

/* v17: smart Pinterest-like compact grid (190–230px), no stretched last row */
.social-grid{
  --social-card-size: clamp(190px, 12vw, 230px);
  grid-template-columns: repeat(auto-fill, minmax(var(--social-card-size), var(--social-card-size))) !important;
  gap: 18px !important;
  justify-content: start !important;
  align-items: start !important;
}
.social-card{
  display: flex;
  flex-direction: column;

  width: 100% !important;
  max-width: none !important;
}
.social-generating-card{
  min-height: auto !important;
}
@media(max-width:900px){
  .social-grid{
    --social-card-size: clamp(165px, 44vw, 220px);
    grid-template-columns: repeat(auto-fill, minmax(var(--social-card-size), var(--social-card-size))) !important;
    justify-content: center !important;
    gap: 16px !important;
  }
}
@media(max-width:420px){
  .social-grid{
    --social-card-size: min(100%, 220px);
    grid-template-columns: minmax(0, var(--social-card-size)) !important;
  }
}

/* v18: softer smart grid — cards are not too small and content stays inside */
.social-grid{
  --social-card-size: clamp(260px, 15.5vw, 300px);
  grid-template-columns: repeat(auto-fill, minmax(var(--social-card-size), var(--social-card-size))) !important;
  gap: 20px !important;
  justify-content: start !important;
  align-items: start !important;
}
.social-card{
  display: flex;
  flex-direction: column;

  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  overflow: visible !important;
}
.social-card-body,
.social-card-author,
.social-card-actions,
.social-card-stats,
.social-card-title{
  min-width: 0 !important;
}
.social-card-actions{
  margin-top: auto;
  display: flex;
  gap: 10px;
position:static;display:flex;justify-content:center;margin-top:8px;}
.social-card-actions .social-btn{
  flex: 0 1 auto !important;
  min-width: 32px !important;
  max-width: 100% !important;
  padding-left: 8px !important;
  padding-right: 8px !important;
  white-space: nowrap !important;
}
.social-card-actions .social-btn.like{
  min-width: 58px !important;
}
.social-card-actions .social-btn.save{
  min-width: 76px !important;
}
.social-card-actions .social-btn.icon-only{
  flex: 0 0 32px !important;
  width: 32px !important;
  min-width: 32px !important;
  padding: 0 !important;
}
.social-card-actions .social-btn span{
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.social-author-name,
.social-author-followers,
.social-card-stats,
.social-card-title{
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.social-avatar{
  flex: 0 0 42px !important;
}
@media(max-width:900px){
  .social-grid{
    --social-card-size: clamp(240px, 46vw, 290px);
    grid-template-columns: repeat(auto-fill, minmax(var(--social-card-size), var(--social-card-size))) !important;
    justify-content: center !important;
    gap: 18px !important;
  }
}
@media(max-width:560px){
  .social-grid{
    --social-card-size: min(100%, 300px);
    grid-template-columns: minmax(0, var(--social-card-size)) !important;
  }
}


/* v19: detail title popup and narrower preview */
.detail-title-toggle{display:none !important;}
.social-detail-title{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  min-width:0 !important;
}
.detail-title-text{
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
.detail-title-more{
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  border:none;
  border-radius:999px !important;
  background:#f3f4f6 !important;
  color:#111827 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:3px !important;
  padding:0 !important;
  cursor:pointer !important;
  box-shadow:none;
}
.detail-title-more:hover{background:#e5e7eb !important;}
.detail-title-more span{
  width:4px !important;
  height:4px !important;
  border-radius:50% !important;
  background:#111827 !important;
  display:block !important;
}
.detail-title-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:10020 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  background:rgba(17,24,39,.32) !important;
  padding:20px !important;
}
.detail-title-modal.open{display:flex !important;}
.detail-title-modal-card{
  position:relative !important;
  width:min(520px,calc(100vw - 40px)) !important;
  background:#fff !important;
  border:none;
  border-radius:22px !important;
  box-shadow:none;
  padding:22px 20px 20px !important;
}
.detail-title-modal-close{
  position:absolute !important;
  right:14px !important;
  top:14px !important;
  width:38px !important;
  height:38px !important;
  border:none;
  border-radius:14px !important;
  background:#f9fafb !important;
  color:#111827 !important;
  font-size:24px !important;
  line-height:1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
}
.detail-title-modal-heading{
  margin:0 48px 14px 0 !important;
  font-size:17px !important;
  line-height:1.25 !important;
  font-weight:700 !important;
  color:#111827 !important;
}
.detail-title-modal-text{
  font-size:14px !important;
  line-height:1.55 !important;
  font-weight:400 !important;
  color:#374151 !important;
  white-space:pre-wrap !important;
  overflow-wrap:anywhere !important;
  max-height:50vh !important;
  overflow:auto !important;
}
.social-detail-panel-preview .social-detail-image{
  width:calc(100% - 20px) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
@media(max-width:900px){
  .social-detail-panel-preview .social-detail-image{width:100% !important;}
}

/* v20: requested comment/detail controls refinement */
.detail-title-more{
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  border-radius:14px !important;
  align-self:center !important;
  gap:3px !important;
}
.detail-title-more span{width:3px !important;height:3px !important;}
.social-detail-title{padding-right:50px !important;}

.social-detail-panel-preview .social-detail-image{
  width:calc(100% - 46px) !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
.social-detail-panel-preview .social-detail-image img{
  max-width:78% !important;
  max-height:calc(100vh - 310px) !important;
}

.social-comment-submit{
  background:#eaf2ff !important;
  color:#1d4ed8 !important;
  border:none;
  font-weight:400 !important;
  box-shadow:none;
}
.social-reply-form button{
  background:#e5e7eb !important;
  color:#374151 !important;
  border:none;
  font-weight:400 !important;
  box-shadow:none;
}
.social-comment-cancel{font-weight:400 !important;}

.social-comments-wrap{
  position:relative !important;
  padding-right:20px !important;
}
.social-comments-wrap::after{
  content:"";
  position:absolute;
  right:8px;
  top:0;
  bottom:0;
  width:1px;
  background:#d1d5db;
  border-radius:999px;
  pointer-events:none;
}
.social-comments-scroll-dot{
  width:17px !important;
  height:17px !important;
  right:0 !important;
  top:0 !important;
  background:#9ca3af !important;
  cursor:grab !important;
  pointer-events:auto !important;
  z-index:3 !important;
  touch-action:none !important;
}
.social-comments-scroll-dot.dragging{cursor:grabbing !important;background:#6b7280 !important;}

.social-comment-preview{
  border:none;
  background:#fff !important;
  border-radius:18px !important;
  padding:10px !important;
  margin:-15px 0 0 !important;
}
.social-comment-reply{
  border:none;
  background:#f9fafb !important;
  border-radius:18px !important;
  padding:10px !important;
  margin-left:24px !important;
}
.social-replies{gap:10px !important;}
.social-comment-actions{gap:10px !important;flex-wrap:wrap !important;}
.social-comment-actions button{
  font-weight:400 !important;
}
.social-comment-actions .comment-delete{
  color:#6b7280 !important;
}
.social-comment-actions .comment-delete:hover{color:#dc2626 !important;}

.social-btn.like.active,
.social-detail-bottom-actions .social-btn.like.active{
  color:#dc2626 !important;
  background:#fff1f2 !important;
  border-color:#fecdd3 !important;
}
.social-btn.like.active img,
.social-detail-bottom-actions .social-btn.like.active img,
.comment-like.active img{
  filter:invert(19%) sepia(90%) saturate(3312%) hue-rotate(344deg) brightness(92%) contrast(96%) !important;
}
.social-btn.dislike.active,
.social-detail-bottom-actions .social-btn.dislike.active{
  color:#111827 !important;
  background:#f3f4f6 !important;
  border-color:#111827 !important;
}
.social-btn.dislike.active img,
.social-detail-bottom-actions .social-btn.dislike.active img,
.comment-dislike.active img{
  filter:brightness(0) !important;
}
.comment-like.active{
  color:#dc2626 !important;
}
.comment-dislike.active{
  color:#111827 !important;
}

@media(max-width:900px){
  .social-detail-panel-preview .social-detail-image{width:calc(100% - 20px) !important;}
  .social-detail-panel-preview .social-detail-image img{max-width:84% !important;max-height:48vh !important;}
}


/* v21: финальные правки комментариев, лайков и заголовка */
.social-detail-title{
  gap:6px !important;
  padding-right:48px !important;
}
.detail-title-text{
  text-overflow:clip !important;
  white-space:nowrap !important;
  overflow:hidden !important;
}
.detail-title-more{
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  border-radius:14px !important;
  margin-left:0 !important;
  background:#f3f4f6 !important;
}
.detail-title-more span{width:3px !important;height:3px !important;background:#111827 !important;}

/* одна общая рамка на блок сообщений */
.social-comments-wrap{
  position:relative !important;
  border:none;
  border-radius:18px !important;
  padding:12px 22px 12px 12px !important;
  background:#fff !important;
  overflow:hidden !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}
.social-comments-wrap::after{
  content:"" !important;
  position:absolute !important;
  right:8px !important;
  top:12px !important;
  bottom:12px !important;
  width:1px !important;
  background:#d1d5db !important;
  border-radius:999px !important;
  pointer-events:none !important;
}
.social-comments-preview{
  max-height:min(42vh,420px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding:0 !important;
  padding-right:4px !important;
  max-width:100% !important;
  width:100% !important;
  box-sizing:border-box !important;
  scrollbar-width:none !important;
}
.social-comments-preview::-webkit-scrollbar{width:0 !important;height:0 !important;display:none !important;}
.social-comment-preview,
.social-comment-reply{
  border:none;
  background:transparent !important;
  border-radius:18px !important;
  padding:0 !important;
  margin:0 !important;
  max-width:100% !important;
  width:100% !important;
  box-sizing:border-box !important;
}
.social-comments-preview{gap:18px !important;}
.social-replies{
  margin-top:12px !important;
  display:grid !important;
  gap:12px !important;
  max-width:100% !important;
}
.social-comment-content{
  min-width:0 !important;
  max-width:100% !important;
  overflow:hidden !important;
}
.social-comment-line,
.social-comment-preview p,
.social-comment-actions,
.social-reply-form{
  max-width:100% !important;
  box-sizing:border-box !important;
}
.social-comment-preview p{
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
.social-comment-actions{
  flex-wrap:wrap !important;
  overflow:hidden !important;
}
.social-reply-form{
  width:100% !important;
  overflow:hidden !important;
}
.social-comments-scroll-dot{
  width:17px !important;
  height:17px !important;
  right:0 !important;
  top:12px !important;
  margin:0 !important;
  background:#9ca3af !important;
  border-radius:50% !important;
  cursor:grab !important;
  pointer-events:auto !important;
  z-index:5 !important;
  touch-action:none !important;
}
.social-comments-scroll-dot.dragging{cursor:grabbing !important;background:#6b7280 !important;}

/* активный лайк — залитый красный палец с белым манжетом */
.social-btn.like.active,
.social-detail-bottom-actions .social-btn.like.active{
  color:#dc2626 !important;
  background:#fff !important;
  border-color:#fecdd3 !important;
}
.social-btn.like.active img,
.social-detail-bottom-actions .social-btn.like.active img,
.comment-like.active img{
  content:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23dc2626%22%20stroke%3D%22%23dc2626%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M14%209V5a3%203%200%200%200-3-3l-4%209v11h11.3a2%202%200%200%200%202-1.7l1.4-8a2%202%200%200%200-2-2.3H14z%22/%3E%3Cpath%20fill%3D%22%23ffffff%22%20stroke%3D%22%23dc2626%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M7%2022H4a2%202%200%200%201-2-2v-7a2%202%200%200%201%202-2h3z%22/%3E%3C/svg%3E") !important;
  filter:none !important;
}
.social-btn.dislike.active,
.social-detail-bottom-actions .social-btn.dislike.active{
  color:#111827 !important;
  background:#fff !important;
  border-color:#111827 !important;
}
.social-btn.dislike.active img,
.social-detail-bottom-actions .social-btn.dislike.active img,
.comment-dislike.active img{
  content:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20fill%3D%22%23111827%22%20stroke%3D%22%23111827%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M10%2015v4a3%203%200%200%200%203%203l4-9V2H6.7a2%202%200%200%200-2%201.6L3%2011a2%202%200%200%200%202%202h5z%22/%3E%3Cpath%20fill%3D%22%23ffffff%22%20stroke%3D%22%23111827%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20d%3D%22M17%202h3a2%202%200%200%201%202%202v7a2%202%200%200%201-2%202h-3z%22/%3E%3C/svg%3E") !important;
  filter:none !important;
}
.comment-like.active img,.comment-dislike.active img{width:15px !important;height:15px !important;}

/* превью ещё чуть уже */
.social-detail-panel-preview .social-detail-image{
  width:calc(100% - 64px) !important;
}
.social-detail-panel-preview .social-detail-image img{
  max-width:74% !important;
  max-height:calc(100vh - 320px) !important;
}
@media(max-width:900px){
  .social-detail-panel-preview .social-detail-image{width:calc(100% - 24px) !important;}
  .social-detail-panel-preview .social-detail-image img{max-width:82% !important;max-height:46vh !important;}
}


/* PXPress stable modal fixes: no card-render changes */
.social-prompt.social-prompt-preview,
#detailSystemPrompt{
  max-height:105px !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}
.social-card-title,
.social-detail-title,
.detail-title-text,
#detailName{
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.social-detail-title{
  display:flex !important;
  align-items:center !important;
  flex-wrap:nowrap !important;
  min-width:0 !important;
  gap:4px !important;
}
.detail-title-text{
  display:block !important;
  min-width:0 !important;
  flex:0 1 auto !important;
  text-overflow:clip !important;
}
.detail-title-more{
  flex:0 0 30px !important;
  width:30px !important;
  height:30px !important;
  min-width:30px !important;
  margin-left:2px !important;
  transform:translateY(3px) !important;
}
.social-comments-wrap{
  position:relative !important;
  border:none;
  border-radius:18px !important;
  padding:12px 18px 12px 12px !important;
  background:#fff !important;
  overflow:visible !important;
  box-sizing:border-box !important;
}
.social-comments-wrap::after{
  content:none !important;
  display:none !important;
}
.social-comments-preview{
  padding:0 !important;
  padding-right:0 !important;
  margin-right:0 !important;
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  scrollbar-width:none !important;
}
.social-comments-preview::-webkit-scrollbar{width:0 !important;height:0 !important;display:none !important;}
.social-comment-preview,
.social-comment-reply{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}
.social-comments-scroll-dot{
  width:17px !important;
  height:17px !important;
  right:0 !important;
  top:12px !important;
  background:#9ca3af !important;
  border-radius:50% !important;
  z-index:6 !important;
  pointer-events:auto !important;
  box-shadow:none;
}
.social-detail-tech-info{
  margin-top:8px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4px 16px;
  color:#6b7280;
  font-size:12px;
  line-height:1.35;
}
.social-detail-tech-info span{color:#9ca3af;}
@media(max-width:700px){.social-detail-tech-info{}}

/* PXPress v22: stable local fixes for modal info, custom scroll dot and narrow windows */
.social-detail-panel,
.social-detail-panel-preview{
  min-width:0 !important;
}
.social-detail-left,
.social-detail-side,
.social-detail-side-preview{
  min-width:0 !important;
  max-width:100% !important;
}
.social-detail-bottom-actions{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  width:100% !important;
  box-sizing:border-box !important;
}
.social-detail-tech-info{
  width:100% !important;
  margin:10px auto 0 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:5px 18px !important;
  color:#6b7280 !important;
  font-size:12px !important;
  line-height:1.35 !important;
  box-sizing:border-box !important;
}
.social-detail-tech-info div{
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  min-width:0 !important;
}
.social-detail-tech-info span{
  color:#6b7280 !important;
  font-weight:700 !important;
}
.social-comments-wrap{
  position:relative !important;
  overflow:visible !important;
  padding:0 !important;
  border:none;
  border-radius:18px !important;
  background:#fff !important;
  box-sizing:border-box !important;
  max-width:100% !important;
}
.social-comments-wrap::after{
  content:none !important;
  display:none !important;
}
.social-comments-preview{
  width:100% !important;
  max-width:100% !important;
  padding:12px !important;
  margin:0 !important;
  box-sizing:border-box !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
}
.social-comments-preview::-webkit-scrollbar{width:0 !important;height:0 !important;display:none !important;}
.social-comments-scroll-dot{
  width:17px !important;
  height:17px !important;
  right:-9px !important;
  top:0 !important;
  margin:0 !important;
  background:#9ca3af !important;
  border-radius:50% !important;
  z-index:20 !important;
  pointer-events:auto !important;
  box-shadow:none;
}
.social-comment-preview,
.social-comment-reply{
  display:grid !important;
  grid-template-columns:32px minmax(0,1fr) !important;
  column-gap:10px !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}
.social-comment-content,
.social-comment-line,
.social-comment-actions,
.social-reply-form,
.social-replies{
  min-width:0 !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}
.social-comment-preview p,
.social-comment-reply p{
  max-width:100% !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
.social-comment-line{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:4px 8px !important;
}
.social-comment-actions{
  display:flex !important;
  flex-wrap:wrap !important;
  overflow:hidden !important;
}
.social-reply-form{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
}
.social-reply-form input,
.social-comment-composer input{
  min-width:0 !important;
  max-width:100% !important;
}
@media(max-width:700px){
  .social-detail-tech-info{grid-template-columns:1fr !important;}
}


/* === AUTO FIX: align tech info with like button in detail view === */
.social-detail-side-preview {
  display: flex;
  flex-direction: column;
}

.social-detail-tech-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 2px;
  padding-left: 20px;
  line-height: 1.4;
}

.social-detail-bottom-actions,
.social-detail-tech-info {
  align-items: center;
}








/* Moon Assistant RU v4 */
.moon-message{
  margin:0 0 8px;
  padding:7px 9px;
  border-radius:10px;
  white-space:pre-wrap;
  line-height:1.35;
}
.moon-message.user{
  background:#f3f4f6;
  color:#111827;
}
.moon-message.bot{
  background:#eef2ff;
  color:#111827;
}



.moon{padding:6px;margin:4px 0;font-size:13px}
.moon.user{color:#333}
.moon.bot{color:#111;font-weight:500}
.moon.sys{color:#888;font-size:12px}



/* Moon only in comments */
.moon-panel,#moonPanel,.moon-header,.moon-messages,.moon-input{display:none!important;}



.social-comment.moon-pending{opacity:.75;}





/* Moon is displayed as an ordinary comment.
   Only the small "ИИ-консультант" label distinguishes it. */
.moon-panel,
#moonPanel,
.moon-header,
.moon-messages,
.moon-input {
  display: none !important;
}

.social-comment.moon-ai-comment {
  background: inherit !important;
  border:none;
  box-shadow:none;
}

.social-comment.moon-ai-comment .social-comment-line span {
  color: #6b7280;
  font-size: 12px;
}

.social-comment.moon-ai-comment p {
  white-space: pre-wrap;
}


/* Flat comment threads: replies stay aligned under each other */
.social-replies {
  margin-left: 0 !important;
  padding-left: 0 !important;
  border-left: 0 !important;
}

.social-comment.social-comment-reply {
  margin-left: 0 !important;
  padding-left: 0 !important;
  transform: none !important;
}

.social-reply-holder {
  margin-left: 0 !important;
}


/* FINAL: flat comments layout.
   Replies do not shift to the right at any nesting level. */
#detailComments .social-replies,
#detailComments .social-replies .social-replies {
  margin-left: 0 !important;
  padding-left: 0 !important;
  border-left: 0 !important;
}

#detailComments .social-comment,
#detailComments .social-comment.social-comment-reply,
#detailComments .social-replies .social-comment,
#detailComments .social-replies .social-comment.social-comment-reply {
  margin-left: 0 !important;
  padding-left: 0 !important;
  transform: none !important;
}

#detailComments .social-comment-content,
#detailComments .social-replies .social-comment-content {
  margin-left: 0 !important;
}

#detailComments .social-reply-holder,
#detailComments .social-replies .social-reply-holder {
  margin-left: 0 !important;
  padding-left: 0 !important;
}

#detailComments .social-comment-preview.social-comment-reply::before,
#detailComments .social-replies::before {
  display: none !important;
}


/* FINAL HARD FIX: comments are rendered flat, no nested visual offsets */
#detailComments .social-replies {
  display: contents !important;
  margin: 0 !important;
  padding: 0 !important;
  border:none;
}

#detailComments .social-comment,
#detailComments .social-comment-reply,
#detailComments .social-comment-preview,
#detailComments .social-replies .social-comment,
#detailComments .social-replies .social-comment-reply {
  margin-left: 0 !important;
  padding-left: 0 !important;
  left: auto !important;
  transform: none !important;
}

#detailComments .social-comment-content {
  margin-left: 0 !important;
  padding-left: 0 !important;
}

#detailComments .social-comment::before,
#detailComments .social-comment-reply::before,
#detailComments .social-replies::before {
  display: none !important;
  content: none !important;
}


/* Single reply indent:
   Top-level comments are left aligned.
   All replies, including replies to replies and Moon replies, use one fixed shift only. */
#detailComments .social-comment {
  margin-left: 0 !important;
}

#detailComments .social-comment.social-comment-reply {
  margin-left: 42px !important;
  padding-left: 0 !important;
  transform: none !important;
}

#detailComments .social-replies {
  display: contents !important;
  margin: 0 !important;
  padding: 0 !important;
  border:none;
}

#detailComments .social-replies .social-comment.social-comment-reply,
#detailComments .social-replies .social-replies .social-comment.social-comment-reply {
  margin-left: 42px !important;
  padding-left: 0 !important;
  transform: none !important;
}

#detailComments .social-comment-reply::before,
#detailComments .social-replies::before {
  display: none !important;
  content: none !important;
}


/* FINAL: one stable reply indent, no cascade, no overflow */
#detailComments,
.social-comments {
  overflow-x: hidden !important;
  box-sizing: border-box !important;
}

#detailComments .social-replies {
  display: contents !important;
  margin: 0 !important;
  padding: 0 !important;
  border:none;
}

#detailComments .social-comment {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  box-sizing: border-box !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  transform: none !important;
}

#detailComments .social-comment.social-comment-reply {
  width: calc(100% - 34px) !important;
  max-width: calc(100% - 34px) !important;
  margin-left: 34px !important;
  padding-left: 0 !important;
  box-sizing: border-box !important;
  transform: none !important;
}

#detailComments .social-replies .social-comment.social-comment-reply,
#detailComments .social-replies .social-replies .social-comment.social-comment-reply {
  width: calc(100% - 34px) !important;
  max-width: calc(100% - 34px) !important;
  margin-left: 34px !important;
  padding-left: 0 !important;
  box-sizing: border-box !important;
  transform: none !important;
}

#detailComments .social-comment-content,
#detailComments .social-comment.social-comment-reply .social-comment-content {
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow-wrap: anywhere !important;
}

#detailComments .social-reply-holder,
#detailComments .social-reply-form {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  box-sizing: border-box !important;
}

#detailComments .social-reply-form input,
#detailComments .social-reply-form textarea {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

#detailComments .social-comment::before,
#detailComments .social-comment-reply::before,
#detailComments .social-replies::before {
  display: none !important;
  content: none !important;
}

/* Верхняя лента популярных пользователей над карточками */
.social-popular{
  padding:14px 22px 0;
  background:var(--soc-bg);
}
.social-popular-row{
  display:flex;
  align-items:flex-start;
  gap:18px;
  overflow:hidden;
  min-height:86px;
}
.social-popular-user{
  width:72px;
  min-width:72px;
  border:none;
  background:transparent;
  padding:0;
  cursor:pointer;
  display:grid;
  justify-items:center;
  gap:3px;
  color:#6b7280;
  transition:opacity .16s;
}
.social-popular-user:hover{opacity:.86;transform:none;}
.social-popular-user img{
  width:46px;
  height:46px;
  border-radius:50%;
  object-fit:cover;
  background:#e5e7eb;
  border:none;
  box-shadow:none;
}
.social-popular-user span{
  max-width:72px;
  font-size:13px;
  line-height:1.12;
  font-weight:400;
  color:#6b7280;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.social-popular-user small{
  max-width:72px;
  font-size:10px;
  line-height:1.05;
  font-weight:400;
  color:#9ca3af;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.social-popular-user.active img{
  outline:2px solid #dbeafe;
  box-shadow:none;
}
.social-popular + .social-grid{padding-top:16px;}
@media(max-width:900px){
  .social-popular{padding:12px 14px 0;}
  .social-popular-row{gap:14px;min-height:82px;}
}
@media(max-width:520px){
  .social-popular-row{gap:12px;}
  .social-popular-user{width:64px;min-width:64px;}
  .social-popular-user span,.social-popular-user small{max-width:64px;}
}


/* === Dark theme toggle for social header === */
.social-theme-switch{
  display:inline-flex;
  align-items:center;
  gap:7px;
  border:none;
  border-radius:999px;
  background:#fff;
  padding:4px 9px;
  color:#374151;
  font-size:12px;
  font-weight:400;
  cursor:pointer;
  user-select:none;
  white-space:nowrap;
  box-shadow:none;
  line-height:18px;
  transition:none!important;
  transform:none!important;
}
.social-theme-switch:hover{filter:none;background:#fff;transform:none!important;box-shadow:none;transition:none!important;}
.social-theme-indicator{
  appearance:none;
  width:34px;
  height:18px;
  min-width:34px;
  border-radius:999px;
  background:#d1d5db;
  position:relative;
  margin:0;
  transition:.2s;
  box-shadow:none;
  vertical-align:middle;
  display:inline-block;
  transform:none;
}
.social-theme-indicator::before{
  content:"";
  position:absolute;
  width:14px;
  height:14px;
  left:2px;
  top:2px;
  border-radius:50%;
  background:#fff;
  box-shadow:none;
  transition:.2s;
}
.social-theme-switch.active .social-theme-indicator{background:#2563eb;}
.social-theme-switch.active .social-theme-indicator::before{left:18px;}
.social-theme-switch.active .social-theme-label{color:#93c5fd;}

body.social-page.social-dark{
  --soc-ink:#f9fafb;
  --soc-muted:#d1d5db;
  --soc-line:#252b36;
  --soc-bg:#000;
  --soc-soft:#111827;
  background:#000!important;
  color:#f9fafb!important;
}
body.social-page.social-dark .social-main,
body.social-page.social-dark .social-popular,
body.social-page.social-dark .social-grid{background:#000!important;}
body.social-page.social-dark .social-sidebar,
body.social-page.social-dark .social-card,
body.social-page.social-dark .social-auth-panel,
body.social-page.social-dark .social-generator-card,
body.social-page.social-dark .social-detail-panel,
body.social-page.social-dark .social-detail-side,
body.social-page.social-dark .social-comment,
body.social-page.social-dark .social-comment-reply,
body.social-page.social-dark .social-menu,
body.social-page.social-dark .social-sort-menu,
body.social-page.social-dark .social-notifications-panel,
body.social-page.social-dark .social-load-more{
  background:#0b0f17!important;
  color:#f9fafb!important;
  border-color:#252b36!important;
  box-shadow:none;
}
body.social-page.social-dark .social-top{
  background:rgba(0,0,0,.94)!important;
  border-bottom-color:#252b36!important;
}
body.social-page.social-dark .social-brand,
body.social-page.social-dark .social-title,
body.social-page.social-dark .social-card-title,
body.social-page.social-dark .social-author-name,
body.social-page.social-dark .social-detail-title,
body.social-page.social-dark .social-detail-author,
body.social-page.social-dark h2,
body.social-page.social-dark h3,
body.social-page.social-dark strong,
body.social-page.social-dark .social-user-name{
  color:#f9fafb!important;
}
body.social-page.social-dark .social-subtitle,
body.social-page.social-dark .social-note,
body.social-page.social-dark .social-card-stats,
body.social-page.social-dark .social-author-followers,
body.social-page.social-dark .social-detail-followers,
body.social-page.social-dark .social-comment p,
body.social-page.social-dark .social-generator-head p,
body.social-page.social-dark .social-generator-status,
body.social-page.social-dark .social-popular-user span,
body.social-page.social-dark .social-popular-user small{
  color:#cbd5e1!important;
}
body.social-page.social-dark .social-nav-btn,
body.social-page.social-dark .social-user-action,
body.social-page.social-dark .social-menu button,
body.social-page.social-dark .social-sort-menu button{
  color:#e5e7eb!important;
}
body.social-page.social-dark .social-nav-btn:hover,
body.social-page.social-dark .social-menu button:hover,
body.social-page.social-dark .social-sort-menu button:hover{
  background:#111827!important;
}
body.social-page.social-dark .social-nav-btn.active{
  background:#10203a!important;
  border-color:#1d4ed8!important;
  color:#bfdbfe!important;
}
body.social-page.social-dark .social-search,
body.social-page.social-dark input,
body.social-page.social-dark textarea,
body.social-page.social-dark .social-prompt{
  background:#05070b!important;
  border-color:#303744!important;
  color:#f9fafb!important;
}
body.social-page.social-dark .social-search::placeholder,
body.social-page.social-dark input::placeholder,
body.social-page.social-dark textarea::placeholder{color:#7f8794!important;}
body.social-page.social-dark .social-btn,
body.social-page.social-dark .social-bell,
body.social-page.social-dark .social-theme-switch,
body.social-page.social-dark .social-auth-close,
body.social-page.social-dark .social-generator-result a{
  background:#111827!important;
  border-color:#303744!important;
  color:#f9fafb!important;
}
body.social-page.social-dark .social-btn:hover,
body.social-page.social-dark .social-bell:hover,
body.social-page.social-dark .social-theme-switch:hover,
body.social-page.social-dark .social-load-more:hover{background:#172033!important;}
body.social-page.social-dark .social-card-img,
body.social-page.social-dark .social-generator-result img,
body.social-page.social-dark .social-detail-image,
body.social-page.social-dark .social-detail-image img{
  background:#05070b!important;
  border-color:#252b36!important;
}
body.social-page.social-dark .social-avatar,
body.social-page.social-dark .social-user-avatar,
body.social-page.social-dark .social-detail-avatar,
body.social-page.social-dark .social-comment-avatar,
body.social-page.social-dark .social-popular-user img{
  background:#111827!important;
  border-color:#4b5563!important;
  box-shadow:none;
}
body.social-page.social-dark .social-theme-switch.active .social-theme-label{color:#bfdbfe!important;}
@media(max-width:900px){.social-theme-switch{order:3}.social-top{gap:10px}.social-theme-label{display:none}}

/* === PXPress v23: library button, modal chat bounds, persistent account UI === */
.social-userbox{display:inline-flex;align-items:center;gap:9px;white-space:nowrap;}
.social-logout{color:#6b7280!important;margin-left:4px;}
.social-logout:hover{color:#111827!important;text-decoration:underline;}
.social-library-card .social-card-title{font-size:13px;line-height:1.25;color:#111827;}
.social-library-card .social-card-actions .social-btn{width:auto;min-width:34px;padding:0 10px;font-size:12px;}
.social-library-card .social-card-actions .social-btn span{display:inline;}
.social-detail-panel-preview{box-sizing:border-box!important;max-width:calc(100vw - 48px)!important;overflow:hidden!important;}
.social-detail-side-preview{box-sizing:border-box!important;min-width:0!important;max-width:100%!important;overflow:hidden!important;padding-right:24px!important;}
.social-detail-section{min-width:0!important;max-width:100%!important;box-sizing:border-box!important;overflow:hidden!important;}
.social-comments-wrap{width:100%!important;max-width:100%!important;margin-right:0!important;overflow:hidden!important;box-sizing:border-box!important;padding:0!important;}
.social-comments-preview{width:100%!important;max-width:100%!important;overflow-x:hidden!important;box-sizing:border-box!important;padding:12px 16px 12px 12px!important;}
.social-comments-scroll-dot{right:6px!important;}
#detailComments .social-comment-preview,
#detailComments .social-comment-reply,
#detailComments .social-comment-content,
#detailComments .social-comment-line,
#detailComments .social-comment-actions,
#detailComments p{max-width:100%!important;min-width:0!important;box-sizing:border-box!important;overflow-wrap:anywhere!important;word-break:break-word!important;}
@media(max-width:900px){
  .social-detail-panel-preview{max-width:calc(100vw - 24px)!important;}
  .social-detail-side-preview{padding-right:16px!important;}
}
body.social-page.social-dark .social-logout{color:#cbd5e1!important;}
body.social-page.social-dark .social-logout:hover{color:#fff!important;}
body.social-page.social-dark .social-library-card .social-card-title{color:#f9fafb!important;}

/* === PXPress v24: generation screen like preview 15 === */
.social-nav-btn[data-mode="generate"].active ~ *{}
.social-main:has(.social-generation-layout) .social-popular{display:none!important;}

.social-generation-left{
  display:grid;
  gap:22px;
  position:sticky;
  top:92px;
  align-self:start;
}
.social-generation-card-slot .social-card{
  display: flex;
  flex-direction: column;

  display: flex;
  flex-direction: column;
  height: 100%;

  --social-card-size:280px;
  max-width:304px!important;
  width:304px!important;
  border-radius:18px!important;
  box-shadow:none;
}
.social-generation-card-slot .social-card-img{
  min-height:0!important;
}
.social-generation-description{
  width:304px;
  min-height:305px;
  border-radius:14px;
  border:none;
  background:rgba(229,231,235,.55);
  padding:16px 12px 14px;
  display:grid;
  grid-template-rows:auto 1fr auto auto;
  gap:12px;
  color:#111827;
}
.gen-desc-head{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;font-weight:600;color:#111827;}
.gen-desc-head button{width:28px;height:28px;border:none;border-radius:999px;background:#eef0f3;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.gen-desc-head button img{width:14px;height:14px;opacity:.75;}
.gen-desc-body{font-size:12px;line-height:1.4;color:#6b7280;max-height:170px;overflow:hidden;white-space:pre-wrap;mask-image:linear-gradient(#000 70%,transparent);}
.gen-desc-tags{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.gen-desc-tags span{min-height:28px;border-radius:999px;background:#f1f3f5;color:#6b7280;font-size:12px;display:inline-flex;align-items:center;padding:0 12px;box-shadow:none;}
.gen-desc-hints{display:grid;gap:8px;}
.gen-desc-hints small{font-size:11px;color:#9ca3af;}
.gen-desc-hints div{display:grid;grid-template-columns:1fr 2fr 1fr;gap:8px;}
.gen-desc-hints i{height:28px;border-radius:999px;background:#dfe3e8;display:block;}
.social-generation-list{display:grid;gap:30px;padding-top:2px;min-width:0;}
.social-generation-row{
  position:relative;
  display:grid;
  grid-template-columns:96px minmax(0,1fr) 52px;
  gap:14px;
  align-items:center;
  min-height:104px;
  padding:0 0 0 0;
  overflow:visible;
}
.gen-row-img{
  width:96px;
  height:96px;
  border:none;
  border-radius:0;
  padding:0;
  cursor:pointer;
  background:linear-gradient(45deg,#f3f4f6 25%,transparent 25%),linear-gradient(-45deg,#f3f4f6 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#f3f4f6 75%),linear-gradient(-45deg,transparent 75%,#f3f4f6 75%);
  background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.gen-row-img img{max-width:100%;max-height:100%;display:block;object-fit:contain;}
.gen-row-main{min-width:0;display:grid;gap:3px;}
.gen-row-title{display:flex;align-items:center;gap:8px;min-width:0;}
.gen-row-title span{font-size:15px;font-weight:800;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:340px;}
.gen-row-title em{font-style:normal;font-size:12px;font-weight:400;color:#4b5563;border:none;background:#f8fafc;border-radius:4px;padding:1px 5px;white-space:nowrap;}
.gen-row-prompt{font-size:13px;line-height:1.25;color:#374151;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:calc(100vw - 760px);}
.gen-row-actions{display:flex;gap:8px;margin-top:4px;}
.gen-row-actions .social-btn{width:30px!important;min-width:30px!important;height:30px!important;padding:0!important;background:#eef0f3!important;border-color:#eef0f3!important;border-radius:50%!important;opacity:.85;}
.gen-row-actions .social-btn img{width:14px!important;height:14px!important;opacity:.65;}
.gen-row-menu{justify-self:end;align-self:center;}
.gen-row-menu > .social-btn{width:46px!important;min-width:46px!important;height:46px!important;border-radius:50%!important;background:#eef0f3!important;border-color:#eef0f3!important;}
.gen-row-menu .social-menu{right:0!important;top:50px!important;left:auto!important;}
.social-generation-row.menu-open{z-index:3000;}
.social-generation-empty{width:304px;border:none;border-radius:18px;background:#fff;color:#6b7280;padding:30px 18px;text-align:center;}
@media(max-width:1100px){
  
  .gen-row-prompt{max-width:none;}
  .social-generation-row{grid-template-columns:82px minmax(0,1fr) 44px;gap:10px;}
  .gen-row-img{width:82px;height:82px;}
}
@media(max-width:800px){
  
  .social-generation-left{position:static;}
  .social-generation-card-slot .social-card,.social-generation-description,.social-generation-empty{width:min(304px,100%);}
  .social-generation-row{grid-template-columns:78px minmax(0,1fr) 40px;min-height:86px;}
  .gen-row-img{width:78px;height:78px;}
  .gen-row-title span{max-width:170px;}
  .gen-row-title em{display:none;}
}
body.social-page.social-dark .social-generation-description,
body.social-page.social-dark .social-generation-empty{background:#111827!important;border-color:#303744!important;color:#f9fafb!important;}
body.social-page.social-dark .gen-desc-head,
body.social-page.social-dark .gen-row-title span{color:#f9fafb!important;}
body.social-page.social-dark .gen-desc-body,
body.social-page.social-dark .gen-row-prompt{color:#cbd5e1!important;}
body.social-page.social-dark .gen-desc-tags span,
body.social-page.social-dark .gen-desc-head button,
body.social-page.social-dark .gen-desc-hints i,
body.social-page.social-dark .gen-row-actions .social-btn,
body.social-page.social-dark .gen-row-menu > .social-btn{background:#172033!important;border-color:#303744!important;color:#cbd5e1!important;}
body.social-page.social-dark .gen-row-title em{background:#05070b!important;border-color:#303744!important;color:#cbd5e1!important;}

/* === v16: generation editor panel === */
.social-side-generator{display:none !important;}
.social-generation-editor{padding:18px !important;}
.gen-desc-input{
  width:100%;
  min-height:170px;
  resize:vertical;
  border:none;
  outline:none;
  background:transparent;
  color:#111827;
  font:inherit;
  font-size:13px;
  line-height:1.45;
  box-sizing:border-box;
  padding:10px 2px 14px;
}
.gen-desc-controls{
  display:flex;
  align-items:center;
  gap:8px;
  margin:10px 0 12px;
  flex-wrap:nowrap;
}
.gen-desc-select,
.gen-desc-generate{
  height:34px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
  outline:none;
}
.gen-desc-select{
  border:none;
  background:#eef0f3;
  color:#374151;
  padding:0 24px 0 12px;
  cursor:pointer;
}
.gen-aspect-select{width:68px;flex:0 0 68px;}
.gen-model-select{min-width:118px;flex:1 1 auto;}
.gen-desc-generate{
  border:none;
  background:#1877f2;
  color:#fff;
  padding:0 13px;
  cursor:pointer;
  flex:0 0 auto;
  box-shadow:none;
}
.gen-desc-generate:disabled{opacity:.65;cursor:wait;}
.gen-prompt-chips{display:flex !important;gap:8px !important;flex-wrap:wrap;align-items:center;}
.gen-prompt-chips button{
  border:none;
  background:#eef0f3;
  color:#6b7280;
  border-radius:999px;
  height:30px;
  padding:0 14px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  width:auto !important;
  min-width:0 !important;
}
.gen-prompt-chips button:hover{background:#e5e7eb;color:#111827;}
.gen-desc-head button[data-random-gen-prompt]{
  width:28px;height:28px;border-radius:50%;border:none;background:#eef0f3;display:grid;place-items:center;cursor:pointer;
}
.gen-desc-head button[data-random-gen-prompt] img{width:14px;height:14px;}
body.social-page.social-dark .gen-desc-input{color:#f9fafb;}
body.social-page.social-dark .gen-desc-select,
body.social-page.social-dark .gen-prompt-chips button,
body.social-page.social-dark .gen-desc-head button[data-random-gen-prompt]{background:#1f2937;border-color:#374151;color:#d1d5db;}
body.social-page.social-dark .gen-prompt-chips button:hover{background:#374151;color:#fff;}
@media(max-width:520px){.gen-desc-controls{flex-wrap:wrap}.gen-model-select{width:100%;flex-basis:100%;}.gen-desc-generate{flex:1}}


/* === PXPress generation window redesign: Canva-like preview layout === */
.social-main:has(.gen-preview-workspace) {
  overflow: visible;
}
.social-main:has(.gen-preview-workspace) .social-grid {
  display: block !important;
  padding: 0 !important;
  max-width: none !important;
}
.gen-preview-workspace {
  width: 100%;
  height: calc(100vh - 78px);
  display: grid;
  grid-template-columns: 320px 450px minmax(420px, 1fr);
  gap: 28px;
  padding: 34px 28px 22px;
  box-sizing: border-box;
  align-items: start;
  overflow: hidden;
}
.gen-preview-editor {
  min-width: 0;
}
.gen-preview-editor .social-generation-description {
  width: 100% !important;
  height: calc(100vh - 154px);
  min-height: 620px;
  box-sizing: border-box;
  border-radius: 16px;
  border:none;
  background: #f7f8fa;
  box-shadow:none;
  padding: 18px 16px 14px !important;
  display: grid;
  grid-template-rows: auto 1fr auto auto;
}
.gen-preview-editor .gen-desc-head {
  font-size: 13px;
  color: #111827;
}
.gen-preview-editor .gen-desc-head::after {
  content: attr(data-count);
}
.gen-preview-editor .gen-desc-input {
  min-height: 0;
  height: 100%;
  background: transparent;
  border:none;
  padding: 26px 2px 10px;
  font-size: 14px;
  line-height: 1.45;
  color: #111827;
}
.gen-preview-editor .gen-desc-input::placeholder {
  color: #8a9099;
}
.gen-preview-editor .gen-desc-hints {
  display: none !important;
}
.gen-preview-editor .gen-desc-controls {
  display: grid;
  grid-template-columns: 68px 1fr 48px;
  gap: 10px;
  align-items: center;
  margin: 12px 0 0;
}
.gen-preview-editor .gen-model-select {
  grid-column: 2 / 3;
  grid-row: 2;
  width: 100%;
}
.gen-preview-editor .gen-aspect-select {
  grid-column: 1 / 2;
  grid-row: 2;
  width: 68px;
}
.gen-preview-editor .gen-desc-generate {
  grid-column: 2 / 4;
  grid-row: 1;
  justify-self: end;
  height: 38px;
  padding: 0 18px;
  background: #1677f2;
  box-shadow:none;
}
.gen-preview-stage {
  width: 100%;
  max-width: 450px;
  border:none;
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow:none;
}
.gen-canvas-frame {
  height: min(70vh, 690px);
  min-height: 560px;
  background-color: #fff;
  background-image:
    linear-gradient(45deg, #c9c9c9 25%, transparent 25%),
    linear-gradient(-45deg, #c9c9c9 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #c9c9c9 75%),
    linear-gradient(-45deg, transparent 75%, #c9c9c9 75%);
  background-size: 18px 18px;
  background-position: 0 0, 0 9px, 9px -9px, -9px 0;
  display: grid;
  place-items: center;
  position: relative;
}
.gen-canvas-image-btn {
  width: 100%;
  height: 100%;
  border:none;
  padding: 28px;
  background: transparent;
  cursor: pointer;
  display: grid;
  place-items: center;
}
.gen-canvas-image-btn img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}
.gen-canvas-state {
  display: grid;
  gap: 8px;
  place-items: center;
  text-align: center;
  padding: 24px;
  color: #6b7280;
  background: rgba(255,255,255,.74);
  border-radius: 14px;
}
.gen-canvas-state b {
  color: #111827;
  font-size: 15px;
}
.gen-canvas-state small {
  font-size: 13px;
}
.gen-canvas-info {
  min-height: 98px;
  padding: 18px 18px 16px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 22px;
  font-size: 13px;
  color: #6b7280;
  line-height: 1.35;
  border-top: 1px solid #eceff3;
}
.gen-canvas-info b {
  color: #6b7280;
  font-weight: 700;
}
.gen-canvas-prompt {
  grid-column: 1 / -1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gen-preview-gallery {
  min-width: 0;
  height: calc(100vh - 132px);
  overflow: hidden;
  display: grid;
  grid-template-rows: auto 1fr;
}
.gen-gallery-tabs {
  display: flex;
  gap: 28px;
  align-items: center;
  height: 36px;
  margin-bottom: 18px;
  border-bottom: 0;
}
.gen-gallery-tabs button {
  width: auto !important;
  min-width: 0 !important;
  padding: 0 0 7px !important;
  border:none;
  border-radius: 0 !important;
  background: transparent !important;
  color: #111827 !important;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
}
.gen-gallery-tabs button.active {
  font-weight: 700;
  border-bottom: 2px solid #111827 !important;
}
.gen-gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 22px;
  align-content: start;
  overflow: visible;
  padding-right: 8px;
  padding-bottom: 24px;
}
.gen-preview-card {
  width: auto !important;
  max-width: none !important;
  border:none;
  box-shadow:none;
  background: transparent !important;
  padding: 0 !important;
  cursor: pointer;
}
.gen-preview-card-image {
  width: 100%;
  aspect-ratio: 1.65 / 1;
  border:none;
  border-radius: 13px;
  overflow: hidden;
  background: #f3f4f6;
  padding: 0;
  cursor: pointer;
  display: block;
}
.gen-preview-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .18s ease;
}
.gen-preview-card:hover .gen-preview-card-image img {
  transform: scale(1.03);
}
.gen-preview-card-title {
  margin-top: 13px;
  font-size: 15px;
  line-height: 1.2;
  font-weight: 800;
  color: #111827;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gen-preview-card-meta {
  margin-top: 8px;
  font-size: 12px;
  color: #8a9099;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.social-page.social-dark .gen-preview-editor .social-generation-description,
body.social-page.social-dark .gen-preview-stage,
body.social-page.social-dark .gen-preview-gallery {
  background: #111827 !important;
  border-color: #303744 !important;
}
body.social-page.social-dark .gen-canvas-state b,
body.social-page.social-dark .gen-preview-card-title,
body.social-page.social-dark .gen-gallery-tabs button {
  color: #f9fafb !important;
}
body.social-page.social-dark .gen-canvas-info,
body.social-page.social-dark .gen-canvas-info b,
body.social-page.social-dark .gen-preview-card-meta,
body.social-page.social-dark .gen-canvas-state {
  color: #cbd5e1 !important;
}
@media (max-width: 1500px) {
  .gen-preview-workspace { grid-template-columns: 320px 430px minmax(360px, 1fr); gap: 22px; }
  .gen-gallery-grid { grid-template-columns: repeat(2, minmax(170px, 1fr)); }
}
@media (max-width: 1180px) {
  .gen-preview-workspace { grid-template-columns: 300px 1fr; overflow: auto; height: auto; }
  .gen-preview-gallery { grid-column: 1 / -1; height: auto; overflow: visible; }
  .gen-gallery-grid { grid-template-columns: repeat(3, minmax(160px, 1fr)); overflow: visible; }
}
@media (max-width: 820px) {
  .gen-preview-workspace {  padding: 18px 14px; }
  .gen-preview-editor .social-generation-description { min-height: 420px; height: auto; }
  .gen-canvas-frame { min-height: 420px; height: 58vh; }
  .gen-gallery-grid {  }
}

/* === PXPress generation refinements 2026-06-22 === */
html, body.social-page{
  background:#fff !important;
  overflow:hidden !important;
}
.social-shell,
.social-main,
.social-grid,
.gen-preview-workspace{
  background:#fff !important;
}
.social-main:has(.gen-preview-workspace){
  height:calc(100vh - 0px) !important;
  overflow:hidden !important;
}
.social-main:has(.gen-preview-workspace) .social-grid{
  overflow:hidden !important;
}
.gen-preview-workspace{
  height:calc(100vh - 78px) !important;
  align-items:stretch !important;
  padding-bottom:18px !important;
}
.gen-preview-editor,
.gen-preview-stage{
  height:calc(100vh - 132px) !important;
  min-height:620px !important;
}
.gen-preview-editor .social-generation-description{
  height:100% !important;
  min-height:0 !important;
  background:#f7f8fa !important;
}
.gen-preview-stage{
  display:grid !important;
  grid-template-rows:1fr auto !important;
  max-width:450px;
}
.gen-canvas-frame{
  height:auto !important;
  min-height:0 !important;
}
.gen-desc-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}
.gen-desc-title{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.gen-desc-counter{
  font-size:13px;
  font-weight:700;
  color:#111827;
  white-space:nowrap;
}
.gen-random-btn,
.gen-desc-head button[data-random-gen-prompt]{
  margin-left:auto !important;
  flex:0 0 auto !important;
}
.gen-preview-editor .gen-desc-controls{
  display:grid !important;
  grid-template-columns:68px 1fr auto 42px !important;
  gap:10px !important;
  align-items:center !important;
}
.gen-preview-editor .gen-aspect-select{
  grid-column:1 / 2 !important;
  grid-row:2 !important;
}
.gen-own-images{
  grid-column:2 / 3 !important;
  grid-row:1 !important;
  justify-self:end !important;
  height:38px !important;
  padding:0 18px !important;
  border:none;
  border-radius:999px !important;
  background:#fff !important;
  color:#374151 !important;
  font-weight:700 !important;
  box-shadow:none;
  cursor:pointer !important;
  width:auto !important;
}
.gen-preview-editor .gen-desc-generate{
  grid-column:3 / 5 !important;
  grid-row:1 !important;
  justify-self:end !important;
  height:38px !important;
  border-radius:999px !important;
  box-shadow:none;
}
.gen-preview-editor .gen-model-select{
  grid-column:2 / 4 !important;
  grid-row:2 !important;
}
.gen-format-btn{
  grid-column:4 / 5 !important;
  grid-row:2 !important;
  width:38px !important;
  height:38px !important;
  border:none;
  border-radius:50% !important;
  background:#fff !important;
  color:#6b7280 !important;
  box-shadow:none;
  cursor:pointer !important;
  display:grid !important;
  place-items:center !important;
  font-size:16px !important;
  line-height:1 !important;
}
.gen-preview-editor .gen-desc-generate:hover{box-shadow:none;}
.gen-desc-input{resize:none !important;}
.gen-canvas-info div{min-height:18px;}
.gen-gallery-grid{
  overflow:auto !important;
  scrollbar-width:thin;
}
.social-load-more{display:none !important;}
@media (max-width:1180px){
  html, body.social-page{overflow:auto !important;}
  .gen-preview-workspace{height:auto !important;align-items:start !important;}
  .gen-preview-editor,.gen-preview-stage{height:auto !important;min-height:0 !important;}
}



/* === Patch: description panel exactly like preview === */
body.social-page,
body.social-page .social-shell,
body.social-page .social-main,
body.social-page .social-grid,
body.social-page .gen-preview-workspace{
  background:#fff !important;
}

body.social-page{
  overflow:hidden !important;
}

.gen-preview-workspace{
  align-items:stretch !important;
}

.gen-preview-editor{
  height:calc(100vh - 132px) !important;
  min-height:620px !important;
}

.gen-preview-editor .social-generation-description.social-generation-editor{
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  box-sizing:border-box !important;
  background:#f7f7f8 !important;
  border:none;
  border-radius:18px !important;
  box-shadow:none;
  padding:18px 16px 14px !important;
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) auto !important;
  gap:0 !important;
}

.gen-preview-editor .gen-desc-head{
  min-height:28px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin:0 !important;
  padding:0 !important;
  color:#111827 !important;
  font-size:13px !important;
  font-weight:700 !important;
}

.gen-preview-editor .gen-desc-title{
  display:flex !important;
  align-items:center !important;
  gap:13px !important;
  min-width:0 !important;
}

.gen-preview-editor .gen-desc-counter{
  font-size:13px !important;
  font-weight:700 !important;
  color:#111827 !important;
  white-space:nowrap !important;
}

.gen-preview-editor .gen-random-btn,
.gen-preview-editor .gen-desc-head button[data-random-gen-prompt]{
  width:28px !important;
  height:28px !important;
  min-width:28px !important;
  margin-left:auto !important;
  border:none;
  border-radius:8px !important;
  background:transparent !important;
  box-shadow:none;
  display:grid !important;
  place-items:center !important;
  cursor:pointer !important;
  padding:0 !important;
  opacity:.78 !important;
}

.gen-preview-editor .gen-random-btn:hover,
.gen-preview-editor .gen-desc-head button[data-random-gen-prompt]:hover{
  background:#eef0f3 !important;
  opacity:1 !important;
}

.gen-preview-editor .gen-random-btn img,
.gen-preview-editor .gen-desc-head button[data-random-gen-prompt] img{
  width:16px !important;
  height:16px !important;
  opacity:.75 !important;
}

.gen-preview-editor .gen-desc-input{
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  resize:none !important;
  border:none;
  outline:none !important;
  background:transparent !important;
  box-shadow:none;
  box-sizing:border-box !important;
  margin:0 !important;
  padding:27px 1px 18px !important;
  color:#111827 !important;
  font-size:14px !important;
  line-height:1.45 !important;
  font-weight:400 !important;
}

.gen-preview-editor .gen-desc-input::placeholder{
  color:#8c929c !important;
}

.gen-preview-editor .gen-desc-controls{
  align-self:end !important;
  display:grid !important;
  grid-template-columns:70px minmax(0,1fr) auto 38px !important;
  grid-template-rows:38px 38px !important;
  gap:10px !important;
  align-items:center !important;
  margin:0 !important;
  padding:0 !important;
}

.gen-preview-editor .gen-own-images{
  grid-column:1 / 3 !important;
  grid-row:1 !important;
  justify-self:start !important;
  width:170px !important;
  height:38px !important;
  padding:0 18px !important;
  border:none;
  border-radius:999px !important;
  background:#fff !important;
  color:#374151 !important;
  font-size:13px !important;
  font-weight:700 !important;
  line-height:38px !important;
  box-shadow:none;
  cursor:pointer !important;
  white-space:nowrap !important;
}

.gen-preview-editor .gen-desc-generate{
  grid-column:3 / 5 !important;
  grid-row:1 !important;
  justify-self:end !important;
  width:auto !important;
  min-width:128px !important;
  height:38px !important;
  padding:0 18px !important;
  border:none;
  border-radius:999px !important;
  background:#1677f2 !important;
  color:#fff !important;
  font-size:13px !important;
  font-weight:700 !important;
  line-height:38px !important;
  box-shadow:none;
  cursor:pointer !important;
  white-space:nowrap !important;
}

.gen-preview-editor .gen-desc-generate:hover,
.gen-preview-editor .gen-desc-generate:active,
.gen-preview-editor .gen-desc-generate:focus{
  box-shadow:none;
}

.gen-preview-editor .gen-aspect-select{
  grid-column:1 / 2 !important;
  grid-row:2 !important;
  width:70px !important;
  min-width:70px !important;
}

.gen-preview-editor .gen-model-select{
  grid-column:2 / 4 !important;
  grid-row:2 !important;
  width:100% !important;
  min-width:0 !important;
}

.gen-preview-editor .gen-desc-select{
  height:38px !important;
  border:none;
  border-radius:999px !important;
  background:#fff !important;
  color:#374151 !important;
  font-size:13px !important;
  font-weight:500 !important;
  box-shadow:none;
  outline:none !important;
}

.gen-preview-editor .gen-format-btn{
  grid-column:4 / 5 !important;
  grid-row:2 !important;
  width:38px !important;
  min-width:38px !important;
  height:38px !important;
  border:none;
  border-radius:50% !important;
  background:#fff !important;
  color:#6b7280 !important;
  box-shadow:none;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
  cursor:pointer !important;
}

.gen-preview-editor .gen-desc-hints,
.gen-preview-editor .gen-prompt-chips{
  display:none !important;
}

@media(max-width:820px){
  .gen-preview-editor{
    height:auto !important;
    min-height:520px !important;
  }
  .gen-preview-editor .social-generation-description.social-generation-editor{
    min-height:520px !important;
  }
}



/* === Patch: generation tabs, custom dropdowns, white header === */
body.social-page .social-top,
body.social-page .social-sidebar,
body.social-page .social-shell{
  background:#fff !important;
}

.gen-preview-editor .gen-desc-controls{
  position:relative !important;
  grid-template-rows:38px 1px 38px !important;
  grid-template-columns:70px minmax(0,1fr) auto 38px !important;
}

.gen-preview-editor .gen-own-images{
  grid-column:1 / 3 !important;
  grid-row:1 !important;
  width:142px !important;
}

.gen-preview-editor .gen-desc-generate{
  grid-column:3 / 5 !important;
  grid-row:1 !important;
}

.gen-control-separator{
  grid-column:1 / 5 !important;
  grid-row:2 !important;
  height:1px !important;
  background:#e5e7eb !important;
  margin:0 !important;
}

.gen-preview-editor .gen-aspect-select{
  grid-column:1 / 2 !important;
  grid-row:3 !important;
}

.gen-preview-editor .gen-model-select{
  grid-column:2 / 4 !important;
  grid-row:3 !important;
}

.gen-preview-editor .gen-format-btn{
  grid-column:4 / 5 !important;
  grid-row:3 !important;
}

.gen-dd-btn{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  cursor:pointer !important;
  appearance:none !important;
  -webkit-appearance:none !important;
}

.gen-dd-menu{
  position:absolute !important;
  z-index:50 !important;
  display:none !important;
  min-width:118px !important;
  padding:6px !important;
  border:none;
  border-radius:14px !important;
  background:#fff !important;
  box-shadow:none;
}

.gen-dd-menu.open{
  display:grid !important;
  gap:4px !important;
}

.gen-dd-menu button{
  width:100% !important;
  height:34px !important;
  border:none;
  border-radius:14px !important;
  background:transparent !important;
  color:#374151 !important;
  text-align:left !important;
  padding:0 10px !important;
  font-size:13px !important;
  cursor:pointer !important;
}

.gen-dd-menu button:hover,
.gen-dd-menu button.active{
  background:#f3f6fb !important;
  color:#111827 !important;
  font-weight:700 !important;
}

.gen-dd-menu[data-gen-menu="aspect"]{
  left:0 !important;
  bottom:44px !important;
  min-width:86px !important;
}

.gen-dd-menu[data-gen-menu="model"]{
  left:80px !important;
  right:48px !important;
  bottom:44px !important;
}

.gen-dd-menu[data-gen-menu="format"]{
  right:0 !important;
  bottom:44px !important;
  min-width:92px !important;
}

.gen-gallery-tabs{
  gap:24px !important;
  overflow-x:auto !important;
  scrollbar-width:none !important;
}

.gen-gallery-tabs::-webkit-scrollbar{
  display:none !important;
}

.gen-gallery-tabs button{
  white-space:nowrap !important;
}

.gen-gallery-grid.is-prompts{
  grid-template-columns:repeat(2, minmax(220px, 1fr)) !important;
}

.gen-prompt-example{
  border:none;
  border-radius:14px !important;
  background:#fff !important;
  padding:14px !important;
  display:grid !important;
  gap:10px !important;
  box-shadow:none;
}

.gen-prompt-example-title{
  font-size:14px !important;
  font-weight:800 !important;
  color:#111827 !important;
}

.gen-prompt-example-text{
  font-size:13px !important;
  line-height:1.4 !important;
  color:#4b5563 !important;
  display:-webkit-box !important;
  -webkit-line-clamp:5 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}

.gen-prompt-example button{
  justify-self:start !important;
  width:auto !important;
  height:32px !important;
  padding:0 14px !important;
  border:none;
  border-radius:999px !important;
  background:#f3f4f6 !important;
  color:#374151 !important;
  font-weight:700 !important;
  cursor:pointer !important;
}

.gen-prompt-example button:hover{
  background:#e5e7eb !important;
  color:#111827 !important;
}

@media(max-width:1500px){
  .gen-gallery-grid.is-prompts{
    grid-template-columns:1fr !important;
  }
}



/* === Patch: prompt examples use Library cards with preview === */
.gen-gallery-grid.is-prompts{
  grid-template-columns:repeat(2, minmax(260px, 1fr)) !important;
  gap:16px !important;
}

.gen-prompt-example{
  border:none;
  border-radius:14px !important;
  background:#fff !important;
  padding:10px !important;
  display:grid !important;
  grid-template-columns:74px minmax(0,1fr) !important;
  gap:12px !important;
  align-items:start !important;
  box-shadow:none;
}

.gen-prompt-example-preview{
  width:74px !important;
  height:74px !important;
  min-width:74px !important;
  border:none;
  border-radius:18px !important;
  padding:0 !important;
  overflow:hidden !important;
  background:
    linear-gradient(45deg,#eef0f3 25%,transparent 25%),
    linear-gradient(-45deg,#eef0f3 25%,transparent 25%),
    linear-gradient(45deg,transparent 75%,#eef0f3 75%),
    linear-gradient(-45deg,transparent 75%,#eef0f3 75%) !important;
  background-size:16px 16px !important;
  background-position:0 0,0 8px,8px -8px,-8px 0 !important;
  cursor:pointer !important;
  display:block !important;
}

.gen-prompt-example-preview img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}

.gen-prompt-example-preview span{
  display:block !important;
  width:100% !important;
  height:100% !important;
}

.gen-prompt-example-body{
  min-width:0 !important;
  display:grid !important;
  gap:7px !important;
}

.gen-prompt-example-title{
  font-size:14px !important;
  font-weight:800 !important;
  color:#111827 !important;
  line-height:1.2 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.gen-prompt-example-text{
  font-size:12px !important;
  line-height:1.35 !important;
  color:#4b5563 !important;
  display:-webkit-box !important;
  -webkit-line-clamp:3 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}

.gen-prompt-example-body > button{
  justify-self:start !important;
  width:auto !important;
  height:30px !important;
  padding:0 12px !important;
  border:none;
  border-radius:999px !important;
  background:#f3f4f6 !important;
  color:#374151 !important;
  font-size:12px !important;
  font-weight:700 !important;
  cursor:pointer !important;
}

.gen-prompt-example-body > button:hover{
  background:#e5e7eb !important;
  color:#111827 !important;
}

@media(max-width:1500px){
  .gen-gallery-grid.is-prompts{
    grid-template-columns:1fr !important;
  }
}


/* SAFE UI FIXES */
.gen-control-separator{
  height:1px;
  background:#e5e7eb;
  margin:8px 0;
}

.gen-bg-toggle-wrap{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13px;
  color:#6b7280;
  margin-top:6px;
}

.gen-bg-toggle{
  width:18px;
  height:18px;
}

/* make prompts thumbnails bigger square */
.gen-prompt-example-preview,
.gen-prompt-example img{
  width:110px !important;
  height:110px !important;
  object-fit:cover !important;
  border-radius:18px !important;
}

/* aspect preview hint */
.gen-dd-menu button::before{
  content:"";
  display:inline-block;
  width:18px;
  height:12px;
  margin-right:8px;
  background:#e5e7eb;
  border-radius:2px;
}


/* === Fix: aspect menu previews, format menu, background toggle, prompt previews === */

/* Remove preview rectangles from model / format menus */
.gen-dd-menu[data-gen-menu="model"] button::before,
.gen-dd-menu[data-gen-menu="format"] button::before{
  content:none !important;
  display:none !important;
}

.gen-dd-menu[data-gen-menu="aspect"] button::before{
  content:none !important;
  display:none !important;
}

.gen-dd-menu[data-gen-menu="aspect"] button{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  height:36px !important;
  text-align:left !important;
}

.gen-dd-menu[data-gen-menu="aspect"] button .gen-aspect-preview{
  display:inline-block !important;
  background:#e5e7eb !important;
  border-radius:2px !important;
  flex:0 0 auto !important;
}

.gen-dd-menu[data-gen-menu="aspect"] button[data-aspect="1:1"] .gen-aspect-preview{
  width:12px !important;
  height:12px !important;
}

.gen-dd-menu[data-gen-menu="aspect"] button[data-aspect="1:2"] .gen-aspect-preview{
  width:10px !important;
  height:20px !important;
}

.gen-dd-menu[data-gen-menu="aspect"] button[data-aspect="2:1"] .gen-aspect-preview{
  width:24px !important;
  height:12px !important;
}

.gen-dd-menu[data-gen-menu="aspect"] button[data-aspect="4:1"] .gen-aspect-preview{
  width:34px !important;
  height:9px !important;
}

.gen-dd-menu[data-gen-menu="aspect"] button[data-aspect="1:4"] .gen-aspect-preview{
  width:9px !important;
  height:34px !important;
}

/* Background toggle under controls */
.gen-bg-toggle-wrap{
  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  margin-top:12px !important;
  color:#8a9099 !important;
  font-size:13px !important;
  font-weight:500 !important;
  cursor:pointer !important;
  user-select:none !important;
}

.gen-bg-toggle-wrap input{
  position:absolute !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.gen-bg-fake-check{
  width:18px !important;
  height:18px !important;
  border-radius:50% !important;
  border:none;
  background:#fff !important;
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.gen-bg-toggle-wrap input:checked + .gen-bg-fake-check{
  background:#1677f2 !important;
  border-color:#1677f2 !important;
}

.gen-bg-toggle-wrap input:checked + .gen-bg-fake-check::after{
  content:"" !important;
  width:7px !important;
  height:4px !important;
  border-left:2px solid #fff !important;
  border-bottom:2px solid #fff !important;
  transform:rotate(-45deg) translate(1px,-1px) !important;
}

/* Prompt examples: larger square previews, no text overlap */
.gen-gallery-grid.is-prompts{
  grid-template-columns:repeat(2, minmax(320px, 1fr)) !important;
  gap:18px !important;
}

.gen-prompt-example{
  display:grid !important;
  grid-template-columns:120px minmax(0,1fr) !important;
  gap:14px !important;
  align-items:start !important;
  min-height:120px !important;
  overflow:hidden !important;
}

.gen-prompt-example-preview{
  width:120px !important;
  height:120px !important;
  min-width:120px !important;
  border-radius:18px !important;
  overflow:hidden !important;
  grid-column:1 !important;
  grid-row:1 !important;
}

.gen-prompt-example-preview img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}

.gen-prompt-example-body{
  grid-column:2 !important;
  min-width:0 !important;
  overflow:hidden !important;
}

.gen-prompt-example-title,
.gen-prompt-example-text{
  max-width:100% !important;
  overflow:hidden !important;
}

@media(max-width:1500px){
  .gen-gallery-grid.is-prompts{
    grid-template-columns:1fr !important;
  }
}

/* FIX UI BREAK */
.gen-gallery-grid img, .social-card img{
  max-width:100% !important;
  height:auto !important;
  display:block !important;
}

.social-card{
  display: flex;
  flex-direction: column;

  max-width:100% !important;
  overflow:hidden !important;
}

.gen-gallery-grid{
  overflow-x:hidden !important;
}

/* prevent columns overflow */
.gen-gallery-grid{
  column-gap:14px !important;
}


/* === Safe patch: Style dropdown for generation panel === */
.gen-style-row{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin:10px 0 8px !important;
  position:relative !important;
}

.gen-style-label{
  font-size:13px !important;
  font-weight:700 !important;
  color:#111827 !important;
}

.gen-style-select{
  position:relative !important;
  min-width:155px !important;
}

.gen-style-current{
  width:100% !important;
  height:34px !important;
  border:none;
  border-radius:999px !important;
  background:#fff !important;
  color:#374151 !important;
  box-shadow:none;
  font-size:13px !important;
  font-weight:700 !important;
  cursor:pointer !important;
  padding:0 14px !important;
  text-align:left !important;
}

.gen-style-current::after{
  content:"" !important;
  float:right !important;
  width:6px !important;
  height:6px !important;
  border-right:1.5px solid #6b7280 !important;
  border-bottom:1.5px solid #6b7280 !important;
  transform:rotate(45deg) translateY(3px) !important;
  margin-top:9px !important;
}

.gen-style-menu{
  position:absolute !important;
  top:40px !important;
  right:0 !important;
  z-index:80 !important;
  display:none !important;
  min-width:210px !important;
  padding:8px !important;
  border:none;
  border-radius:14px !important;
  background:#fff !important;
  box-shadow:none;
}

.gen-style-select.open .gen-style-menu{
  display:grid !important;
  gap:4px !important;
}

.gen-style-menu button{
  height:34px !important;
  border:none;
  border-radius:14px !important;
  background:transparent !important;
  color:#374151 !important;
  text-align:left !important;
  padding:0 10px !important;
  font-size:13px !important;
  cursor:pointer !important;
}

.gen-style-menu button:hover,
.gen-style-menu button.active{
  background:#f3f6fb !important;
  color:#111827 !important;
  font-weight:800 !important;
}

.gen-style-menu label{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  padding:7px 10px !important;
  font-size:13px !important;
  color:#374151 !important;
  cursor:pointer !important;
}

.gen-style-divider{
  height:1px !important;
  background:#e5e7eb !important;
  margin:4px 0 !important;
}


/* === Safe patch: restore vertical page scroll in normal social tabs === */
html,
body.social-page{
  overflow-x:hidden !important;
  overflow-y:auto !important;
}

body.social-page .social-shell{
  min-height:100vh !important;
}

body.social-page .social-main{
  min-height:100vh !important;
  overflow:visible !important;
}

body.social-page .social-main > .social-grid{
  overflow:visible !important;
}

/* Keep only generation screen fixed; normal tabs should scroll. */
body.social-page:has(.gen-preview-workspace){
  overflow:hidden !important;
}

body.social-page:has(.gen-preview-workspace) .social-main{
  overflow:hidden !important;
}

body.social-page:has(.gen-preview-workspace) .social-main > .social-grid{
  overflow:hidden !important;
}

body.social-page:has(.gen-preview-workspace) .gen-gallery-grid{
  overflow-y:auto !important;
  overflow-x:hidden !important;
}



/* === Preview 38 generator layout === */
.gen-preview38-editor{
  display:grid !important;
  grid-template-rows:auto minmax(300px,1fr) auto auto auto !important;
  gap:10px !important;
  min-height:720px !important;
  padding:18px !important;
}

.gen-preview38-editor .gen-desc-head{
  grid-row:1 !important;
  margin:0 !important;
}

.gen-preview38-editor .gen-desc-input{
  grid-row:2 !important;
  min-height:285px !important;
  border:none;
  resize:none !important;
  background:transparent !important;
  padding:12px 2px !important;
  margin:0 !important;
  color:#111827 !important;
}

.gen-preview38-editor .gen-desc-input::placeholder{
  color:#9ca3af !important;
}

.gen-preview38-editor .gen-upload-zones{
  grid-row:3 !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:12px !important;
  margin:-112px 0 18px !important;
}

.gen-preview38-editor .gen-upload-zone{
  min-height:88px !important;
  border:none;
  border-radius:18px !important;
  background:transparent !important;
  padding:10px 8px !important;
  display:grid !important;
  place-items:center !important;
  text-align:center !important;
  color:#6b7280 !important;
  cursor:pointer !important;
  position:relative !important;
  overflow:hidden !important;
}

.gen-preview38-editor .gen-upload-zone:hover{
  background:rgba(243,244,246,.55) !important;
}

.gen-preview38-editor .gen-upload-icon{
  display:block !important;
  margin:0 auto 6px !important;
  color:#9ca3af !important;
  line-height:1 !important;
}

.gen-preview38-editor .gen-upload-text{
  display:grid !important;
  gap:2px !important;
  justify-items:center !important;
}

.gen-preview38-editor .gen-upload-text b{
  max-width:126px !important;
  color:#374151 !important;
  font-size:11px !important;
  line-height:1.12 !important;
  font-weight:800 !important;
}

.gen-preview38-editor .gen-upload-text small{
  max-width:130px !important;
  color:#6b7280 !important;
  font-size:10px !important;
  line-height:1.15 !important;
  font-weight:500 !important;
}

.gen-preview38-editor .gen-upload-preview{
  display:none;
  position:absolute !important;
  inset:4px !important;
  width:calc(100% - 8px) !important;
  height:calc(100% - 8px) !important;
  object-fit:contain !important;
  border-radius:14px !important;
  background:#fff !important;
}

.gen-preview38-editor .gen-upload-zone.has-preview .gen-upload-icon,
.gen-preview38-editor .gen-upload-zone.has-preview .gen-upload-text{
  opacity:0 !important;
}

.gen-preview38-editor .gen-desc-controls{
  grid-row:4 !important;
  margin:0 !important;
}

.gen-preview38-editor .gen-bg-toggle-wrap{
  grid-row:5 !important;
  margin-top:4px !important;
}


/* === v10: Masonry gallery cards for Social === */
.social-main{background:#f4f5f7;}
.social-grid.is-masonry{
  display:block !important;
  columns:6 188px;
  column-gap:12px;
  padding:16px 18px 34px !important;
}
.social-grid.is-masonry .social-empty{break-inside:avoid;display:block;width:100%;}
.social-masonry-card{
  position:relative !important;
  display:inline-block !important;
  width:100% !important;
  margin:0 0 12px !important;
  break-inside:avoid !important;
  border:none;
  border-radius:18px !important;
  overflow:hidden !important;
  background:#e5e7eb !important;
  box-shadow:none;
  transform:translateZ(0);
}
.social-masonry-card:hover{box-shadow:none;}
.social-masonry-media{
  display:block !important;
  width:100% !important;
  min-height:108px;
  border:none;
  border-radius:0 !important;
  padding:0 !important;
  margin:0 !important;
  background:#eef2f7 !important;
  overflow:hidden !important;
  cursor:pointer;
}
.social-masonry-media img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
  background:transparent !important;
  transition:transform .28s ease, filter .28s ease;
}
.social-masonry-card:hover .social-masonry-media img{transform:scale(1.025);filter:saturate(1.06) contrast(1.02);}
.social-masonry-shade{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.18) 42%,rgba(0,0,0,.78) 100%);
  opacity:0;transition:opacity .2s ease;pointer-events:none;
}
.social-masonry-card:hover .social-masonry-shade,
.social-masonry-card.menu-open .social-masonry-shade{opacity:1;}
.social-masonry-overlay{
  position:absolute;inset:0;
  display:flex;flex-direction:column;justify-content:flex-end;
  gap:10px;padding:12px;
  color:#fff;opacity:0;transform:translateY(10px);
  transition:opacity .2s ease,transform .2s ease;
  pointer-events:none;
}
.social-masonry-card:hover .social-masonry-overlay,
.social-masonry-card.menu-open .social-masonry-overlay{opacity:1;transform:translateY(0);pointer-events:auto;}
.social-masonry-head{display:flex;align-items:center;gap:9px;min-width:0;}
.social-masonry-head .social-avatar{width:32px;height:32px;border:none;box-shadow:none;}
.social-masonry-head .social-card-title{font-size:14px;font-weight:900;color:#fff;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px;text-shadow:0 1px 6px rgba(0,0,0,.5);}
.social-masonry-head .social-author-name{font-size:12px;color:rgba(255,255,255,.84);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px;}
.social-card-tech{display:grid;grid-template-columns:1fr 1fr;gap:5px 9px;margin:0;padding:9px;border-radius:14px;background:rgba(17,24,39,.54);backdrop-filter:blur(8px);border:none;}
.social-card-tech div{min-width:0;}
.social-card-tech dt{margin:0 0 1px;color:rgba(255,255,255,.58);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;}
.social-card-tech dd{margin:0;color:#fff;font-size:11px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.social-masonry-actions{display:flex !important;align-items:center !important;gap:6px !important;justify-content:flex-start !important;pointer-events:auto;}
.social-masonry-actions .social-btn{height:32px !important;min-width:36px !important;padding:0 9px !important;border-radius:999px !important;border:none;background:rgba(255,255,255,.92) !important;color:#111827 !important;box-shadow:none;}
.social-masonry-actions .social-btn.save{min-width:92px !important;}
.social-masonry-actions .social-btn.icon-only{width:34px !important;min-width:34px !important;padding:0 !important;}
.social-masonry-actions .social-menu-wrap{margin-left:auto !important;position:relative;}
.social-masonry-actions .social-menu{right:0;bottom:38px;top:auto;z-index:50;}
.social-masonry-card .social-card-body,.social-masonry-card>.social-card-author{display:none !important;}
.social-library-card{border-radius:18px !important;}
.social-library-card .social-card-body{display:block !important;}
@media(max-width:1280px){.social-grid.is-masonry{columns:5 180px;}}
@media(max-width:1024px){.social-shell{grid-template-columns:220px 1fr}.social-grid.is-masonry{columns:4 170px;padding:14px !important;}}
@media(max-width:760px){.social-shell{display:block}.social-sidebar{position:relative;height:auto}.social-grid.is-masonry{columns:2 150px;padding:12px !important}.social-card-tech{grid-template-columns:1fr}.social-masonry-head .social-card-title,.social-masonry-head .social-author-name{max-width:130px;}}
@media(max-width:420px){.social-grid.is-masonry{columns:1 100%;}.social-masonry-overlay{padding:10px}.social-card-tech{grid-template-columns:1fr 1fr;}}
@media(hover:none){.social-masonry-shade,.social-masonry-card .social-masonry-overlay{opacity:1;transform:none}.social-masonry-overlay{justify-content:flex-end;background:linear-gradient(180deg,transparent 30%,rgba(0,0,0,.72) 100%)}.social-card-tech{display:none}.social-masonry-actions .social-btn.save span{display:none}.social-masonry-actions .social-btn.save{min-width:34px !important;width:34px !important;padding:0 !important;}}

/* === v11: lighter masonry cards, menu below image, detail chat on card click === */
.social-grid.is-masonry{column-gap:14px !important;}
.social-masonry-card{
  background:transparent !important;
  border:none;
  border-radius:18px !important;
  padding:0 !important;
  overflow:visible !important;
  box-shadow:none;
}
.social-masonry-card:hover{box-shadow:none;transform:none !important;}
.social-masonry-media{
  position:relative !important;
  display:block !important;
  width:100% !important;
  border:none;
  border-radius:18px !important;
  padding:0 !important;
  margin:0 !important;
  background:#eef0f3 !important;
  overflow:hidden !important;
  box-shadow:none;
}
.social-masonry-media img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
  background:transparent !important;
  border:none;
  border-radius:0 !important;
}
.social-masonry-card:hover .social-masonry-media img{transform:none !important;filter:none !important;}
.social-masonry-shade{border-radius:18px !important;}
.social-masonry-overlay{
  position:absolute !important;
  inset:0 !important;
  border-radius:18px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-end !important;
  gap:10px !important;
  padding:12px !important;
  color:#fff !important;
  opacity:0 !important;
  transform:translateY(8px) !important;
  transition:opacity .18s ease,transform .18s ease !important;
  pointer-events:none !important;
}
.social-masonry-card:hover .social-masonry-overlay,
.social-masonry-card.menu-open .social-masonry-overlay{opacity:1 !important;transform:translateY(0) !important;}
.social-masonry-head,.social-masonry-head > span{display:flex !important;align-items:center !important;gap:9px !important;min-width:0 !important;}
.social-masonry-head > span{display:block !important;}
.social-masonry-footer{
  display:flex !important;
  align-items:baseline !important;
  justify-content:flex-start !important;
  gap:7px !important;
  padding:7px 2px 2px !important;
  margin:0 !important;
  background:transparent !important;
  position:relative !important;
  pointer-events:auto !important;
}
.social-masonry-footer .social-btn{
  height:30px !important;
  min-width:32px !important;
  padding:0 8px !important;
  border-radius:999px !important;
  border:none;
  background:transparent !important;
  color:#4b5563 !important;
  box-shadow:none;
}
.social-masonry-footer .social-btn:hover{background:#e5e7eb !important;color:#111827 !important;transform:none !important;}
.social-masonry-footer .social-btn.icon-only{width:30px !important;min-width:30px !important;padding:0 !important;}
.social-masonry-footer .social-btn.save{min-width:34px !important;}
.social-masonry-footer .social-btn.save span{display:none !important;}
.social-masonry-footer .social-menu-wrap{margin-left:auto !important;position:relative !important;}
.social-masonry-footer .social-menu{right:0 !important;top:36px !important;bottom:auto !important;z-index:80 !important;}
.social-card-tech{pointer-events:none !important;}
body.social-page.social-dark .social-masonry-media{background:#2b3038 !important;}
body.social-page.social-dark .social-masonry-footer .social-btn{color:#d1d5db !important;}
body.social-page.social-dark .social-masonry-footer .social-btn:hover{background:#374151 !important;color:#fff !important;}
@media(hover:none){.social-masonry-overlay{opacity:0 !important}.social-masonry-card.menu-open .social-masonry-overlay{opacity:1 !important}.social-masonry-footer .social-btn.save{width:30px !important;min-width:30px !important;}}

/* === PXPress final social card controls: only three dots under card, save/download on hover === */
.social-masonry-footer{
  display:flex !important;
  justify-content:flex-end !important;
  align-items:center !important;
  padding:6px 2px 0 !important;
  margin:0 !important;
  background:transparent !important;
}
.social-masonry-footer > .social-btn,
.social-masonry-footer > button,
.social-masonry-footer > a{
  display:none !important;
}
.social-masonry-footer .social-menu-wrap{
  display:block !important;
  margin-left:auto !important;
  margin-right:0 !important;
  position:relative !important;
}
.social-masonry-footer .social-menu-wrap > .social-btn.icon-only{
  display:inline-flex !important;
  width:30px !important;
  min-width:30px !important;
  height:30px !important;
  padding:0 !important;
  align-items:center !important;
  justify-content:center !important;
  border:none;
  border-radius:999px !important;
  background:transparent !important;
  box-shadow:none;
}
.social-masonry-footer .social-menu-wrap > .social-btn.icon-only:hover{
  background:#e5e7eb !important;
}
.social-masonry-overlay{
  justify-content:space-between !important;
  pointer-events:none !important;
}
.social-masonry-card:hover .social-masonry-overlay,
.social-masonry-card.menu-open .social-masonry-overlay{
  pointer-events:auto !important;
}
.social-masonry-hover-actions{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
  width:100% !important;
  pointer-events:auto !important;
}
.social-hover-save{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:36px !important;
  padding:0 16px !important;
  border:none;
  border-radius:999px !important;
  background:#ef233c !important;
  color:#fff !important;
  font-size:14px !important;
  font-weight:900 !important;
  line-height:1 !important;
  box-shadow:none;
  cursor:pointer !important;
}
.social-hover-save:hover{background:#dc1430 !important;transform:translateY(-1px) !important;}
.social-hover-save.active{background:#b91c1c !important;}
.social-hover-download{
  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:none;
  border-radius:999px !important;
  background:rgba(255,255,255,.96) !important;
  box-shadow:none;
  cursor:pointer !important;
}
.social-hover-download img{width:17px !important;height:17px !important;display:block !important;filter:brightness(0) !important;}
.social-hover-download:hover{background:#fff !important;transform:translateY(-1px) !important;}
.social-masonry-overlay .social-masonry-head,
.social-masonry-overlay .social-card-tech{
  width:100% !important;
}
@media(hover:none){
  .social-masonry-overlay{opacity:0 !important;}
  .social-masonry-card:hover .social-masonry-overlay,
  .social-masonry-card.menu-open .social-masonry-overlay{opacity:1 !important;}
}


/* === PXPress clean hover: only Save and download icon on card hover === */
.social-masonry-overlay{
  justify-content:flex-start !important;
  align-items:stretch !important;
  padding:12px !important;
  gap:0 !important;
}
.social-masonry-overlay .social-masonry-head,
.social-masonry-overlay .social-card-tech,
.social-masonry-overlay .social-avatar,
.social-masonry-overlay .social-card-title,
.social-masonry-overlay .social-author-name{
  display:none !important;
  visibility:hidden !important;
}
.social-masonry-hover-actions{
  display:flex !important;
  width:100% !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
}
.social-hover-save,
.social-hover-download{
  pointer-events:auto !important;
}
.social-hover-save::before,
.social-hover-save::after,
.social-hover-download::before,
.social-hover-download::after{
  content:none !important;
  display:none !important;
}
.social-hover-download span,
.social-hover-download small,
.social-hover-download b{
  display:none !important;
}


/* === PXPress v18: fixed light hover plate and save button above it === */
.social-masonry-media{
  position:relative !important;
}
.social-masonry-shade{
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  border-radius:18px !important;
  background:rgba(0,0,0,.10) !important;
  opacity:0 !important;
  transition:opacity .16s ease !important;
  pointer-events:none !important;
}
.social-masonry-card:hover .social-masonry-shade,
.social-masonry-card.menu-open .social-masonry-shade{
  opacity:1 !important;
}
.social-masonry-overlay{
  position:absolute !important;
  inset:0 !important;
  z-index:2 !important;
  border-radius:18px !important;
  background:transparent !important;
  opacity:0 !important;
  transform:none !important;
  transition:opacity .16s ease !important;
  pointer-events:none !important;
  padding:12px !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
}
.social-masonry-card:hover .social-masonry-overlay,
.social-masonry-card.menu-open .social-masonry-overlay{
  opacity:1 !important;
  pointer-events:auto !important;
}
.social-masonry-hover-actions{
  position:relative !important;
  z-index:3 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  width:100% !important;
  gap:10px !important;
  pointer-events:auto !important;
}
.social-hover-save{
  position:relative !important;
  z-index:4 !important;
  background:#ef233c !important;
  color:#fff !important;
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  box-shadow:none;
}
.social-hover-save.active{
  background:#ef233c !important;
}
.social-hover-download{
  position:relative !important;
  z-index:4 !important;
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
}
.social-masonry-overlay .social-masonry-head,
.social-masonry-overlay .social-card-tech,
.social-masonry-overlay .social-avatar,
.social-masonry-overlay .social-card-title,
.social-masonry-overlay .social-author-name{
  display:none !important;
  visibility:hidden !important;
}




/* === PXPress uniform light overlay: buttons always above shade === */
.social-masonry-shade{background:rgba(0,0,0,.12) !important;opacity:0 !important;z-index:2 !important;}
.social-masonry-overlay{background:transparent !important;z-index:8 !important;}
.social-masonry-card:hover .social-masonry-shade,.social-masonry-card.menu-open .social-masonry-shade{opacity:1 !important;}
.social-masonry-hover-actions{position:relative !important;z-index:9 !important;}
.social-hover-save{position:relative !important;z-index:10 !important;background:#ef233c !important;filter:none !important;opacity:1 !important;}
.social-hover-download{position:relative !important;z-index:10 !important;filter:none !important;opacity:1 !important;}


/* === PXPress final layout: fixed header/sidebar, content-only scroll, no developer mode === */
html, body.social-page{
  height:100%;
  overflow:hidden !important;
}
body.social-page .social-shell{
  height:100vh !important;
  min-height:100vh !important;
  display:grid !important;
  grid-template-columns:271px minmax(0,1fr) !important;
  overflow:hidden !important;
}
body.social-page .social-sidebar{
  position:sticky !important;
  top:0 !important;
  height:100vh !important;
  overflow:hidden !important;
  z-index:80 !important;
}
body.social-page .social-main{
  height:100vh !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  display:flex !important;
  flex-direction:column !important;
  background:#f4f5f7 !important;
}
body.social-page .social-top{
  position:sticky !important;
  top:0 !important;
  flex:0 0 auto !important;
  z-index:90 !important;
}
body.social-page .social-generator{
  flex:1 0 auto;
}
body.social-page .social-grid{
  flex:0 0 auto;
}
body.social-page .social-grid.is-masonry{
  flex:0 0 auto !important;
  min-height:0 !important;
}
body.social-page .social-load-more{
  flex:0 0 auto;
}
body.social-page .social-popular{
  flex:0 0 auto;
  order:50;
  margin:8px 22px 28px !important;
  padding:16px !important;
  border-radius:22px !important;
  background:#eceff3 !important;
}
body.social-page .social-popular[hidden]{display:none !important;}
body.social-page .gen-dd-menu [data-aspect="4:5"] .gen-aspect-preview{aspect-ratio:4/5;}
body.social-page .gen-dd-menu [data-aspect="9:16"] .gen-aspect-preview{aspect-ratio:9/16;}
body.social-page .gen-dd-menu [data-aspect="16:9"] .gen-aspect-preview{aspect-ratio:16/9;}
body.social-page .gen-dd-menu [data-aspect="3:4"] .gen-aspect-preview{aspect-ratio:3/4;}
body.social-page .gen-dd-menu [data-aspect="2:3"] .gen-aspect-preview{aspect-ratio:2/3;}

@media(max-width:900px){
  html, body.social-page{overflow:auto !important;height:auto;}
  body.social-page .social-shell{display:block !important;height:auto !important;overflow:visible !important;}
  body.social-page .social-sidebar{position:relative !important;height:auto !important;overflow:visible !important;}
  body.social-page .social-main{height:auto !important;overflow:visible !important;display:block !important;}
  body.social-page .social-top{position:sticky !important;top:0 !important;}
}


/* v22: social cards use real generated image proportions */
.social-card-img,
.social-masonry-media{
  aspect-ratio:var(--social-image-ratio, 1 / 1) !important;
  height:auto !important;
}
.social-masonry-media img,
.social-card-img img{
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:cover !important;
  display:block !important;
}
.social-card-img.is-generating,
.social-masonry-media.is-generating{
  aspect-ratio:var(--social-image-ratio, 1 / 1) !important;
}

.social-card{
  display: flex;
  flex-direction: column;

  border:none !important;
  box-shadow:none !important;
  border-radius:18px;
  overflow:hidden;
  position:relative;
  background:transparent;
}

/* overlay buttons on image */
.social-card-img{
  position:relative;
  border:none !important;
}

.social-card-actions{
  margin-top: auto;
  display: flex;
  gap: 10px;
position:static;display:flex;justify-content:center;margin-top:8px;}

/* save button red */
.social-btn.primary{
  background:#ff2d2d !important;
  color:#fff !important;
  border:none !important;
}

/* download icon overlay */
.social-btn.download{
  position:absolute;
  top:10px;
  right:60px;
  background:rgba(255,255,255,0.9);
}

/* three dots below card */
.social-card-meta{
  display:flex;
  justify-content:center;
}

.social-card{
  display: flex;
  flex-direction: column;

  transition: transform .15s ease;
}
.social-card:hover{
  transform: translateY(-2px);
}

/* prevent layout shift: meta fixed flow */
.social-card{
  display: flex;
  flex-direction: column;

  display:flex;
  flex-direction:column;
}

.social-card-img{
  order:1;
}

.social-card-actions{
  margin-top: auto;
  display: flex;
  gap: 10px;
position:static;display:flex;justify-content:center;margin-top:8px;}

.social-card-meta{
  order:2;
  margin-top:6px;
}

/* ensure no jump from border/shadow */
.social-card, .social-card *{
  box-sizing:border-box;
}

.social-grid{
  padding:18px;
  align-content:start;
}
.social-card{
  display: flex;
  flex-direction: column;

  margin:0;
}



/* === FIX: side scroll + newest cards above older cards. Generation untouched except gallery order. === */

/* Main feed: vertical flow, multiple columns, scrollbar on the side */
body.social-page .social-main > #socialGrid.is-grid {
  display: block !important;
  columns: 280px !important;
  column-gap: 20px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 16px 22px 34px !important;
}

body.social-page .social-main > #socialGrid.is-grid > .social-card {
  display: flex;
  flex-direction: column;

  display: inline-block !important;
  width: 100% !important;
  max-width: 280px !important;
  margin: 0 0 20px 0 !important;
  break-inside: avoid !important;
}

/* Generator gallery: side scrollbar, newest item starts above older items */
body.social-page .gen-gallery-grid:not(.is-prompts) {
  display: block !important;
  columns: 180px !important;
  column-gap: 22px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding-right: 8px !important;
  padding-bottom: 24px !important;
}

body.social-page .gen-gallery-grid:not(.is-prompts) > .gen-preview-card {
  display: inline-block !important;
  width: 100% !important;
  margin: 0 0 20px 0 !important;
  break-inside: avoid !important;
}



/* deprecated duplicate gap/layout block removed: === FINAL GAP FIX: reduce real visual space between feed cards === */

/* deprecated duplicate gap/layout block removed: === Adaptive larger Pinterest-like cards + gray border for transparent logos === */

/* deprecated duplicate gap/layout block removed: === FINAL STABLE FEED LAYOUT: 5px gaps + adaptive card width === */

/* === Restore bottom three-dot menu + hover save/download buttons === */
body.social-page #socialGrid.is-grid .social-card,
body.social-page #socialGrid.is-grid .social-grid-card {
  overflow: visible !important;
  position: relative !important;
}

body.social-page #socialGrid.is-grid .social-card.menu-open {
  z-index: 9999 !important;
}

body.social-page #socialGrid.is-grid .social-card-actions,
body.social-page #socialGrid.is-grid .social-grid-actions,
body.social-page #socialGrid.is-grid .social-grid-footer {
  position: static !important;
  display: flex !important;
  justify-content: center !important;
  margin-top: 6px !important;
  overflow: visible !important;
  order: 2 !important;
}

body.social-page #socialGrid.is-grid .social-menu-wrap {
  position: relative !important;
  overflow: visible !important;
  z-index: 10000 !important;
}

body.social-page #socialGrid.is-grid .social-menu {
  display: none !important;
  position: absolute !important;
  right: 0 !important;
  top: 36px !important;
  width: 190px !important;
  background: #fff !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  padding: 7px !important;
  z-index: 10001 !important;
}

body.social-page #socialGrid.is-grid .social-menu-wrap.open .social-menu {
  display: grid !important;
}

body.social-page #socialGrid.is-grid .social-grid-media {
  position: relative !important;
}

body.social-page #socialGrid.is-grid .social-grid-overlay {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  padding: 10px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .16s ease !important;
  background: transparent !important;
  box-shadow: none !important;
}

body.social-page #socialGrid.is-grid .social-card:hover .social-grid-overlay {
  opacity: 1 !important;
}

body.social-page #socialGrid.is-grid .social-grid-hover-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  pointer-events: auto !important;
  box-shadow: none !important;
}

body.social-page #socialGrid.is-grid .social-hover-save {
  min-height: 34px !important;
  padding: 0 14px !important;
  border: none !important;
  border-radius: 999px !important;
  background: #e53935 !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

body.social-page #socialGrid.is-grid .social-hover-download {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 50% !important;
  background: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  box-shadow: none !important;
}

body.social-page #socialGrid.is-grid .social-hover-download img {
  width: 16px !important;
  height: 16px !important;
  display: block !important;
}


/* === FIX: detail/chat modal always above all cards and menus === */
body.social-page.social-modal-open {
  overflow: hidden !important;
}

body.social-page .social-detail,
body.social-page #socialDetail {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483000 !important;
  isolation: isolate !important;
}

body.social-page .social-detail.open,
body.social-page #socialDetail.open {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  pointer-events: auto !important;
}

body.social-page .social-detail::before,
body.social-page #socialDetail::before {
  z-index: 2147483001 !important;
}

body.social-page .social-detail-panel {
  position: relative !important;
  z-index: 2147483002 !important;
}

body.social-page .social-card,
body.social-page .social-card.menu-open,
body.social-page .social-menu-wrap,
body.social-page .social-menu,
body.social-page .social-grid-overlay,
body.social-page .masonry-col {
  z-index: auto !important;
}

/* restored animated generation scale */
.gen-progress{width:min(220px,70%);height:12px;border-radius:999px;background:rgba(148,163,184,.22);overflow:hidden;position:relative;margin:0 auto 10px;}
.gen-progress span{position:absolute;inset:0 auto 0 0;width:45%;border-radius:inherit;background:linear-gradient(90deg,rgba(26,115,232,.25),rgba(26,115,232,.95),rgba(26,115,232,.25));animation:genProgressMove 1.15s ease-in-out infinite;}
@keyframes genProgressMove{0%{left:-45%;}50%{left:55%;}100%{left:100%;}}
.social-card-img.is-generating,.social-masonry-media.is-generating,.gen-canvas-frame.is-generating{display:flex;align-items:center;justify-content:center;}
.social-spinner{border:4px solid #e5e7eb !important;border-top-color:#1a73e8 !important;}

/* === Unified generator tabs/cards: My, All, Subscriptions, Prompt examples === */
body.social-page .gen-gallery-grid.is-prompts{
  display:block !important;
  columns:180px !important;
  column-gap:22px !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  padding-right:8px !important;
  padding-bottom:24px !important;
}
body.social-page .gen-gallery-grid.is-prompts > .gen-preview-card,
body.social-page .gen-gallery-grid.is-prompts > .gen-prompt-example{
  display:inline-block !important;
  width:100% !important;
  margin:0 0 22px 0 !important;
  break-inside:avoid !important;
  border:none !important;
  box-shadow:none !important;
  background:transparent !important;
  padding:0 !important;
}
body.social-page .gen-prompt-example-preview,
body.social-page .gen-prompt-example .gen-preview-card-image{
  width:100% !important;
  height:auto !important;
  min-width:0 !important;
  aspect-ratio:1.65 / 1 !important;
  border:none !important;
  border-radius:13px !important;
  overflow:hidden !important;
  padding:0 !important;
  display:block !important;
}
body.social-page .gen-prompt-example-preview img,
body.social-page .gen-prompt-example .gen-preview-card-image img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}
body.social-page .gen-prompt-example-title,
body.social-page .gen-prompt-example .gen-preview-card-title{
  margin-top:13px !important;
  font-size:15px !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  color:#111827 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
body.social-page .gen-prompt-example-text,
body.social-page .gen-prompt-example .gen-preview-card-meta{
  margin-top:8px !important;
  font-size:12px !important;
  line-height:1.3 !important;
  color:#8a9099 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  display:block !important;
}
body.social-page .gen-preview-card-use{
  margin-top:10px !important;
  width:100% !important;
  height:34px !important;
  border:none !important;
  border-radius:999px !important;
  background:#f3f4f6 !important;
  color:#374151 !important;
  font-size:12px !important;
  font-weight:800 !important;
  cursor:pointer !important;
}
body.social-page .gen-preview-card-use:hover{
  background:#e5e7eb !important;
  color:#111827 !important;
}
body.social-page.social-dark .gen-prompt-example-title,
body.social-page.social-dark .gen-prompt-example .gen-preview-card-title{color:#f9fafb !important;}
body.social-page.social-dark .gen-prompt-example-text,
body.social-page.social-dark .gen-prompt-example .gen-preview-card-meta{color:#cbd5e1 !important;}
body.social-page.social-dark .gen-preview-card-use{background:#1f2937 !important;color:#e5e7eb !important;}
body.social-page.social-dark .gen-preview-card-use:hover{background:#374151 !important;color:#fff !important;}


/* deprecated duplicate gap/layout block removed: === generation gallery logo cards: keep prompt examples as-is, unify other tabs === */



/* === PXPress ACTIVE: one shared gap control for all logo card galleries ===
   This block controls BOTH:
   1) left menu page: "Мои логотипы" / "Все логотипы" / "Мои подписки"
   2) generator window tabs: "Генерация логотипа" -> "Мои логотипы" / "Все логотипы" / "Мои подписки"
   Prompt examples are intentionally excluded by .is-prompts.
*/
body.social-page{
  --logo-card-column-gap:5px;
  --logo-card-row-gap:3px;
  --logo-card-footer-height:18px;
  --logo-card-menu-offset:2px;
  --logo-card-column-width:205px;
  --gen-logo-card-column-width:180px;
}

/* Shared masonry containers */
body.social-page #socialGrid.is-grid,
body.social-page .gen-gallery-grid.is-logo-cards{
  display:block !important;
  columns:auto !important;
  column-count:auto !important;
  column-width:var(--logo-card-column-width) !important;
  column-gap:var(--logo-card-column-gap) !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  align-content:start !important;
  padding:5px !important;
}

/* Generator side panel is narrower, so keep its cards narrower while using the same gaps */
body.social-page .gen-gallery-grid.is-logo-cards{
  column-width:var(--gen-logo-card-column-width) !important;
  padding:0 4px 24px 0 !important;
}

/* Shared logo cards */
body.social-page #socialGrid.is-grid > .social-card,
body.social-page #socialGrid.is-grid > .social-grid-card,
body.social-page .gen-gallery-grid.is-logo-cards > .social-card,
body.social-page .gen-gallery-grid.is-logo-cards > .social-masonry-card,
body.social-page .gen-gallery-grid.is-logo-cards > .social-grid-card{
  display:inline-block !important;
  width:100% !important;
  max-width:none !important;
  margin:0 0 var(--logo-card-row-gap) 0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
  break-inside:avoid !important;
  page-break-inside:avoid !important;
  vertical-align:top !important;
  background:transparent !important;
  box-shadow:none !important;
  border:none !important;
  overflow:visible !important;
}

/* Shared image block */
body.social-page #socialGrid.is-grid .social-card-img,
body.social-page #socialGrid.is-grid .social-grid-media,
body.social-page .gen-gallery-grid.is-logo-cards .social-masonry-media,
body.social-page .gen-gallery-grid.is-logo-cards .social-grid-media,
body.social-page .gen-gallery-grid.is-logo-cards .social-card-img{
  margin:0 !important;
  border:1px solid #e5e7eb !important;
  border-radius:16px !important;
  overflow:hidden !important;
}

/* Shared bottom three-dot footer */
body.social-page #socialGrid.is-grid .social-card-actions,
body.social-page #socialGrid.is-grid .social-grid-actions,
body.social-page #socialGrid.is-grid .social-grid-footer,
body.social-page .gen-gallery-grid.is-logo-cards .social-masonry-footer,
body.social-page .gen-gallery-grid.is-logo-cards .social-grid-footer,
body.social-page .gen-gallery-grid.is-logo-cards .social-card-actions{
  margin-top: auto;
  display: flex;
  gap: 10px;

  height:var(--logo-card-footer-height) !important;
  min-height:var(--logo-card-footer-height) !important;
  padding:0 var(--logo-card-menu-offset) !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  background:transparent !important;
}

body.social-page #socialGrid.is-grid .social-menu-wrap,
body.social-page .gen-gallery-grid.is-logo-cards .social-menu-wrap{
  margin-left:auto !important;
  margin-right:0 !important;
  position:relative !important;
}

body.social-page #socialGrid.is-grid .social-menu-wrap > .social-btn.icon-only,
body.social-page .gen-gallery-grid.is-logo-cards .social-menu-wrap > .social-btn.icon-only{
  display:inline-flex !important;
  width:28px !important;
  min-width:28px !important;
  height:18px !important;
  padding:0 !important;
  align-items:center !important;
  justify-content:center !important;
  border:0 !important;
  border-radius:999px !important;
  background:transparent !important;
  box-shadow:none !important;
  color:#111827 !important;
}
body.social-page.social-dark #socialGrid.is-grid .social-menu-wrap > .social-btn.icon-only,
body.social-page.social-dark .gen-gallery-grid.is-logo-cards .social-menu-wrap > .social-btn.icon-only{color:#e5e7eb !important;}

@media(max-width:1280px){body.social-page .gen-gallery-grid.is-logo-cards{columns:2 170px !important;}}
@media(max-width:760px){body.social-page .gen-gallery-grid.is-logo-cards{columns:2 150px !important;}}
@media(max-width:420px){body.social-page .gen-gallery-grid.is-logo-cards{columns:1 100% !important;}}


/* === PXPress ACTIVE: gallery view controls inside generation gear === */
body.social-page .gen-dd-menu[data-gen-menu="format"]{
  min-width:236px !important;
  padding:8px !important;
}
body.social-page .gen-gallery-settings{
  margin-top:8px !important;
  padding-top:8px !important;
  border-top:1px solid #edf0f4 !important;
  display:grid !important;
  gap:8px !important;
}
body.social-page .gen-gallery-settings-title{
  font-size:12px !important;
  font-weight:800 !important;
  color:#111827 !important;
  padding:0 var(--logo-card-menu-offset) !important;
}
body.social-page .gen-gallery-range{
  display:grid !important;
  grid-template-columns:1fr auto !important;
  gap:5px 8px !important;
  align-items:center !important;
  font-size:12px !important;
  color:#374151 !important;
  padding:0 var(--logo-card-menu-offset) !important;
}
body.social-page .gen-gallery-range output{
  font-weight:800 !important;
  color:#111827 !important;
  font-size:12px !important;
}
body.social-page .gen-gallery-range input[type="range"]{
  grid-column:1 / -1 !important;
  width:100% !important;
  margin:0 !important;
  accent-color:#111827 !important;
}
body.social-page .gen-gallery-reset{
  width:100% !important;
  height:30px !important;
  border:0 !important;
  border-radius:12px !important;
  background:#f3f6fb !important;
  color:#111827 !important;
  font-size:12px !important;
  font-weight:800 !important;
  cursor:pointer !important;
  text-align:center !important;
}
body.social-page.social-dark .gen-gallery-settings{border-top-color:#263241 !important;}
body.social-page.social-dark .gen-gallery-settings-title,
body.social-page.social-dark .gen-gallery-range output{color:#f9fafb !important;}
body.social-page.social-dark .gen-gallery-range{color:#cbd5e1 !important;}
body.social-page.social-dark .gen-gallery-reset{background:#1f2937 !important;color:#e5e7eb !important;}

/* Keep gallery scale variable authoritative after old responsive rules */
body.social-page #socialGrid.is-grid{column-width:var(--logo-card-column-width) !important;}
body.social-page .gen-gallery-grid.is-logo-cards{column-width:var(--gen-logo-card-column-width) !important;}


/* === PXPress ACTIVE: vertical three-dot menu control ===
   The gallery slider "⋯ По вертикали" changes --logo-card-footer-height.
   Horizontal position stays fixed; only the vertical distance below the image changes. */
body.social-page #socialGrid.is-grid .social-card-actions,
body.social-page #socialGrid.is-grid .social-grid-actions,
body.social-page #socialGrid.is-grid .social-grid-footer,
body.social-page .gen-gallery-grid.is-logo-cards .social-masonry-footer,
body.social-page .gen-gallery-grid.is-logo-cards .social-grid-footer,
body.social-page .gen-gallery-grid.is-logo-cards .social-card-actions{
  margin-top: auto;
  display: flex;
  gap: 10px;

  height:var(--logo-card-footer-height) !important;
  min-height:var(--logo-card-footer-height) !important;
  padding:0 2px !important;
  align-items:center !important;
  justify-content:flex-end !important;
}


/* === PXPress ACTIVE: separate top-panel controls for main logo pages: Мои / Все / Подписки === */
body.social-page{
  --my-logo-card-row-gap:3px;
  --my-logo-card-column-gap:5px;
  --my-logo-card-footer-height:18px;
  --my-logo-card-column-width:205px;
}
body.social-page .my-gallery-controls{
  margin:0 0 10px 0 !important;
  padding:0 !important;
}
body.social-page .my-gallery-controls[hidden]{display:none !important;}
body.social-page .my-gallery-controls-inner{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  flex-wrap:wrap !important;
  padding:8px 10px !important;
  border:1px solid #e5e7eb !important;
  border-radius:16px !important;
  background:#fff !important;
  box-shadow:0 8px 22px rgba(15,23,42,.05) !important;
}
body.social-page .my-gallery-controls-title{
  font-size:13px !important;
  font-weight:900 !important;
  color:#111827 !important;
  white-space:nowrap !important;
}
body.social-page .my-gallery-range{
  display:grid !important;
  grid-template-columns:auto auto !important;
  align-items:center !important;
  gap:2px 6px !important;
  min-width:150px !important;
  font-size:12px !important;
  color:#374151 !important;
}
body.social-page .my-gallery-range output{
  font-size:12px !important;
  font-weight:800 !important;
  color:#111827 !important;
  text-align:right !important;
}
body.social-page .my-gallery-range input[type="range"]{
  grid-column:1 / -1 !important;
  width:100% !important;
  margin:0 !important;
  accent-color:#111827 !important;
}
body.social-page .my-gallery-reset{
  height:32px !important;
  padding:0 12px !important;
  border:0 !important;
  border-radius:12px !important;
  background:#f3f6fb !important;
  color:#111827 !important;
  font-size:12px !important;
  font-weight:900 !important;
  cursor:pointer !important;
}
body.social-page.social-dark .my-gallery-controls-inner{
  background:#111827 !important;
  border-color:#263241 !important;
  box-shadow:none !important;
}
body.social-page.social-dark .my-gallery-controls-title,
body.social-page.social-dark .my-gallery-range output{color:#f9fafb !important;}
body.social-page.social-dark .my-gallery-range{color:#cbd5e1 !important;}
body.social-page.social-dark .my-gallery-reset{background:#1f2937 !important;color:#e5e7eb !important;}

/* Main logo pages use their own variables; generator window keeps --logo-card-* variables. */
body.social-page #socialGrid.is-grid{
  column-width:var(--my-logo-card-column-width) !important;
  column-gap:var(--my-logo-card-column-gap) !important;
}
body.social-page #socialGrid.is-grid > .social-card,
body.social-page #socialGrid.is-grid > .social-grid-card{
  margin:0 0 var(--my-logo-card-row-gap) 0 !important;
}
body.social-page #socialGrid.is-grid .social-card-actions,
body.social-page #socialGrid.is-grid .social-grid-actions,
body.social-page #socialGrid.is-grid .social-grid-footer{
  height:var(--my-logo-card-footer-height) !important;
  min-height:var(--my-logo-card-footer-height) !important;
  padding:0 2px !important;
  align-items:center !important;
  justify-content:flex-end !important;
}
@media(max-width:760px){
  body.social-page .my-gallery-controls-inner{gap:8px !important;}
  body.social-page .my-gallery-range{min-width:130px !important;}
}


/* === PXPress ACTIVE FIX: top sliders control real masonry width/gap on Мои / Все / Подписки === */
body.social-page.social-my-gallery-active #socialGrid.is-grid{
  display:block !important;
  columns:var(--my-logo-card-column-width) !important;
  column-width:var(--my-logo-card-column-width) !important;
  column-gap:var(--my-logo-card-column-gap) !important;
}
body.social-page.social-my-gallery-active #socialGrid.is-grid > .social-card,
body.social-page.social-my-gallery-active #socialGrid.is-grid > .social-grid-card{
  display:inline-block !important;
  width:100% !important;
  max-width:none !important;
  margin:0 0 var(--my-logo-card-row-gap) 0 !important;
  break-inside:avoid !important;
  page-break-inside:avoid !important;
}


/* === PXPress final fixes: social menus, modal image, prompt frame, titles === */
body.social-page .social-menu{
  min-width:218px !important;
  border:1px solid rgba(15,23,42,.08) !important;
  box-shadow:0 18px 42px rgba(15,23,42,.18),0 4px 12px rgba(15,23,42,.10) !important;
  border-radius:16px !important;
  padding:7px !important;
  background:#fff !important;
}
body.social-page .social-menu button,
body.social-page .social-menu .social-menu-item{
  min-height:38px !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  width:100% !important;
  padding:9px 11px !important;
  border:0 !important;
  border-radius:11px !important;
  background:transparent !important;
  color:#111827 !important;
  text-align:left !important;
  font:500 13px/1.15 Inter,system-ui,-apple-system,Segoe UI,Arial,sans-serif !important;
  cursor:pointer !important;
}
body.social-page .social-menu button:hover{background:#f3f4f6 !important;}
body.social-page .social-menu button.danger{color:#dc2626 !important;}
body.social-page .social-menu button svg{width:16px !important;height:16px !important;flex:0 0 16px !important;fill:currentColor !important;display:block !important;}
body.social-page .social-menu button .social-menu-icon{width:16px !important;height:16px !important;flex:0 0 16px !important;display:block !important;object-fit:contain !important;}
body.social-page .social-menu button span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
body.social-page .social-detail-panel-preview .social-detail-image{
  width:100% !important;
  min-height:420px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:transparent !important;
  border:0 !important;
  padding:0 !important;
  overflow:visible !important;
}
body.social-page .social-detail-panel-preview .social-detail-image img{
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:calc(100vh - 175px) !important;
  object-fit:contain !important;
  background:transparent !important;
  border:0 !important;
  border-radius:22px !important;
  cursor:zoom-in !important;
}
body.social-page .social-prompt.social-prompt-preview,
body.social-page #detailSystemPrompt{
  border:1px solid #e5e7eb !important;
  box-shadow:none !important;
  outline:0 !important;
  background:#f8fafc !important;
  border-radius:12px !important;
}
body.social-page .social-detail-title,
body.social-page .detail-title-text{
  overflow-wrap:normal !important;
  word-break:normal !important;
  hyphens:none !important;
}
body.social-page .social-image-lightbox{
  position:fixed;inset:0;z-index:2147483646!important;display:none;align-items:center;justify-content:center;background:rgba(15,23,42,.86);padding:24px;
}
body.social-page .social-image-lightbox.open{display:flex;}
body.social-page .social-image-lightbox img{max-width:96vw;max-height:94vh;object-fit:contain;background:transparent;border-radius:16px;box-shadow:0 24px 70px rgba(0,0,0,.35);}
body.social-page .social-image-lightbox-close{position:fixed;right:22px;top:18px;width:42px;height:42px;border:0;border-radius:12px;background:#fff;color:#111827;font-size:28px;line-height:1;cursor:pointer;box-shadow:0 12px 30px rgba(0,0,0,.22);z-index:2147483647!important;}


/* === PXPress cleanup: all gallery sliders live only in seller → System prompt → Interface === */
body.social-page .my-gallery-controls,
body.social-page .gen-gallery-settings{
  display:none!important;
  visibility:hidden!important;
  height:0!important;
  min-height:0!important;
  overflow:hidden!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
}
body.social-page .social-image-lightbox,
body.social-page .social-image-lightbox.open{
  z-index:2147483646!important;
}
body.social-page .social-image-lightbox img{
  position:relative!important;
  z-index:2147483646!important;
}
body.social-page .social-image-lightbox-close{
  z-index:2147483647!important;
}


/* === Requested social UI fixes 2026-06-30 === */
.social-search{
  border:1px solid #d1d5db !important;
  border-radius:999px !important;
  background:#fff !important;
}
.social-user-sep{
  display:inline-block !important;
  width:1px !important;
  height:22px !important;
  background:#d1d5db !important;
  color:transparent !important;
  margin:0 4px !important;
  vertical-align:middle !important;
}
.gen-preview38-editor{
  overflow:hidden !important;
}
.gen-preview38-editor .gen-desc-input{
  min-height:0 !important;
  max-height:260px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding:12px 8px !important;
  scrollbar-width:thin !important;
}
.gen-preview38-editor .gen-upload-zones{
  margin:0 0 14px !important;
}
.gen-preview38-editor .gen-upload-zone{
  border:1px solid #d1d5db !important;
  border-radius:18px !important;
}
.gen-canvas-frame{
  border:1px solid #d1d5db !important;
  border-radius:24px !important;
}
.gen-bg-toggle-wrap{
  color:#4b5563 !important;
}
.gen-bg-fake-check{
  width:42px !important;
  height:24px !important;
  border-radius:999px !important;
  border:1px solid #d1d5db !important;
  background:#e5e7eb !important;
  position:relative !important;
  transition:background .18s ease,border-color .18s ease !important;
}
.gen-bg-fake-check::before{
  content:"" !important;
  position:absolute !important;
  width:18px !important;
  height:18px !important;
  left:2px !important;
  top:2px !important;
  border-radius:50% !important;
  background:#fff !important;
  box-shadow:0 1px 2px rgba(0,0,0,.18) !important;
  transition:transform .18s ease !important;
}
.gen-bg-toggle-wrap input:checked + .gen-bg-fake-check{
  background:#1677f2 !important;
  border-color:#1677f2 !important;
}
.gen-bg-toggle-wrap input:checked + .gen-bg-fake-check::before{
  transform:translateX(18px) !important;
}
.gen-bg-toggle-wrap input:checked + .gen-bg-fake-check::after{
  content:none !important;
}
body.social-page.social-dark .social-search,
body.social-page.social-dark .gen-preview38-editor .gen-upload-zone,
body.social-page.social-dark .gen-canvas-frame{
  border-color:#4b5563 !important;
}


/* === Requested generator refinements 2026-06-30 v2 === */
/* 1) Обводка только вокруг блока данных результата, без обводки пустой панели "Введите описание" */
.gen-canvas-frame.is-empty{
  border:none !important;
}
.gen-canvas-frame.has-image,
.gen-canvas-frame.is-generating{
  border:1px solid #d1d5db !important;
  border-radius:24px !important;
}
.gen-canvas-info{
  border:1px solid #d1d5db !important;
  border-radius:16px !important;
  padding:12px 14px !important;
  background:#fff !important;
  box-sizing:border-box !important;
}
body.social-page.social-dark .gen-canvas-info{
  border-color:#4b5563 !important;
  background:#05070b !important;
}

/* 2) Бегунок "Добавить фон" — размер и анимация как у "Тёмная тема" */
.gen-bg-toggle-wrap{
  display:inline-flex !important;
  align-items:center !important;
  gap:7px !important;
  line-height:18px !important;
}
.gen-bg-fake-check{
  width:34px !important;
  height:18px !important;
  min-width:34px !important;
  border-radius:999px !important;
  border:none !important;
  background:#d1d5db !important;
  position:relative !important;
  transition:background .2s ease !important;
  box-shadow:none !important;
}
.gen-bg-fake-check::before{
  content:"" !important;
  position:absolute !important;
  width:14px !important;
  height:14px !important;
  left:2px !important;
  top:2px !important;
  border-radius:50% !important;
  background:#fff !important;
  box-shadow:none !important;
  transition:left .2s ease, transform .2s ease !important;
  transform:none !important;
}
.gen-bg-toggle-wrap input:checked + .gen-bg-fake-check{
  background:#2563eb !important;
  border-color:#2563eb !important;
}
.gen-bg-toggle-wrap input:checked + .gen-bg-fake-check::before{
  left:18px !important;
  transform:none !important;
}
.gen-bg-toggle-wrap input:checked + .gen-bg-fake-check::after{
  content:none !important;
}

/* 3) Текст в "Описание" заканчивается примерно за 5 мм до рамок загрузки */
.gen-preview38-editor .gen-desc-input{
  max-height:none !important;
  padding:12px 8px 20px !important;
}
.gen-preview38-editor .gen-upload-zones{
  margin-top:18px !important;
}

/* === Requested generator refinements 2026-06-30 v3 === */
/* 1) Одна общая тонкая серая рамка вокруг всего блока технических данных */
.gen-canvas-info,
.social-detail-tech-info{
  border:1px solid #d1d5db !important;
  border-radius:16px !important;
  padding:12px 14px !important;
  box-sizing:border-box !important;
  background:#fff !important;
}
.gen-canvas-info > div,
.social-detail-tech-info > div{
  border:none !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.social-page.social-dark .gen-canvas-info,
body.social-page.social-dark .social-detail-tech-info{
  border-color:#4b5563 !important;
  background:#05070b !important;
}

/* 2) Опустить бегунок "Добавить фон / Убрать фон" ниже */
.gen-preview38-editor .gen-bg-toggle-wrap,
.gen-bg-toggle-wrap{
  margin-top:12px !important;
  transform:translateY(6px) !important;
}

/* === Frame only fix: make result panel frame match the reference version === */
.gen-preview-stage{
  border:1px solid #dfe3e8 !important;
  border-radius:16px !important;
  overflow:hidden !important;
  background:#fff !important;
  box-shadow:0 1px 2px rgba(15,23,42,.03) !important;
}
.gen-canvas-frame,
.gen-canvas-frame.is-empty,
.gen-canvas-frame.has-image,
.gen-canvas-frame.is-generating{
  border:none !important;
  border-radius:0 !important;
}
.gen-canvas-info{
  border:none !important;
  border-top:1px solid #eceff3 !important;
  border-radius:0 !important;
  padding:18px 18px 16px !important;
  background:#fff !important;
  box-shadow:none !important;
}
body.social-page.social-dark .gen-preview-stage{
  background:#111827 !important;
  border-color:#303744 !important;
}
body.social-page.social-dark .gen-canvas-info{
  background:#111827 !important;
  border-top-color:#303744 !important;
}

/* PXPress modal fixes 2026-06-30: image crop, info border off, title/chat alignment */
.social-detail-panel-preview{
  overflow:hidden !important;
}
.social-detail-left{
  display:flex !important;
  flex-direction:column !important;
  min-height:0 !important;
  overflow:hidden !important;
}
.social-detail-panel-preview .social-detail-image{
  width:calc(100% - 64px) !important;
  height:clamp(260px, calc(100vh - 335px), 520px) !important;
  max-height:calc(100vh - 335px) !important;
  min-height:0 !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:8px !important;
  box-sizing:border-box !important;
}
.social-detail-panel-preview .social-detail-image img,
#detailImg{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  border-radius:16px !important;
}
.social-detail-under-meta{
  position:relative !important;
  z-index:2 !important;
  flex:0 0 auto !important;
}
.social-detail-tech-info,
body.social-page.social-dark .social-detail-tech-info{
  border:none !important;
  outline:none !important;
  box-shadow:none !important;
  background:transparent !important;
  padding:0 !important;
}
.social-detail-side-preview{
  padding-top:22px !important;
  display:flex !important;
  flex-direction:column !important;
  min-height:0 !important;
  overflow:hidden !important;
}
.social-detail-title{
  margin-top:0 !important;
  align-items:flex-start !important;
}
.detail-title-text{
  text-overflow:clip !important;
}
.detail-title-modal{
  z-index:20000 !important;
}
.detail-title-modal-card{
  z-index:20001 !important;
}
.social-detail-section:last-of-type{
  display:flex !important;
  flex-direction:column !important;
  min-height:0 !important;
  flex:1 1 auto !important;
  margin-bottom:5px !important;
  overflow:hidden !important;
}
.social-comments-wrap{
  flex:1 1 auto !important;
  min-height:0 !important;
  max-height:calc(100vh - 470px) !important;
  margin-bottom:5px !important;
  overflow:hidden !important;
}
.social-comments-preview,
#detailComments{
  max-height:100% !important;
  height:100% !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}
#detailComments .social-comment-actions span{
  background:transparent !important;
  border:none !important;
  border-radius:0 !important;
  padding:0 !important;
  box-shadow:none !important;
}
@media(max-width:900px){
  .social-detail-panel-preview{overflow:auto !important;}
  .social-detail-panel-preview .social-detail-image{
    width:calc(100% - 24px) !important;
    height:min(46vh, 420px) !important;
    max-height:46vh !important;
  }
  .social-comments-wrap{max-height:45vh !important;}
}

/* === PXPress modal fixes v2 2026-06-30 === */
/* 1) Техническую колонку выровнять по лайку и началу строки просмотров */
.social-detail-tech-info,
body.social-page.social-dark .social-detail-tech-info{
  width:calc(100% - 64px) !important;
  align-self:center !important;
  margin:8px auto 0 !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:4px !important;
  border:none !important;
  outline:none !important;
  box-shadow:none !important;
  background:transparent !important;
  padding:0 !important;
  color:#6b7280 !important;
  font-size:12px !important;
  line-height:1.35 !important;
}
.social-detail-tech-info > div{
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  min-width:0 !important;
}
.social-detail-tech-info span{color:#6b7280 !important;font-weight:700 !important;}
.social-detail-under-meta,
.social-detail-bottom-actions{
  width:calc(100% - 64px) !important;
  align-self:center !important;
  padding-left:0 !important;
  justify-content:flex-start !important;
}

/* 2) В чате показать обычную полосу прокрутки */
.social-comments-preview,
#detailComments{
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:thin !important;
  scrollbar-color:#b8bec8 transparent !important;
  padding-right:12px !important;
}
.social-comments-preview::-webkit-scrollbar,
#detailComments::-webkit-scrollbar{
  width:7px !important;
  height:7px !important;
  display:block !important;
}
.social-comments-preview::-webkit-scrollbar-track,
#detailComments::-webkit-scrollbar-track{background:transparent !important;}
.social-comments-preview::-webkit-scrollbar-thumb,
#detailComments::-webkit-scrollbar-thumb{
  background:#b8bec8 !important;
  border-radius:999px !important;
}
.social-comments-scroll-dot{display:none !important;}

/* 3) Полный просмотр фотографии: черный фон, без крестика */
body.social-page .social-image-lightbox,
body.social-page .social-image-lightbox.open{
  background:#000 !important;
}
body.social-page .social-image-lightbox-close{
  display:none !important;
}
body.social-page .social-image-lightbox img{
  background:#000 !important;
  box-shadow:none !important;
}

/* 4) Отодвинуть чат от края модального окна еще примерно на 5 мм */
.social-detail-side-preview{
  padding-right:19px !important;
}
.social-comments-wrap{
  margin-right:19px !important;
}

/* 5) Изображения/иллюстрации — скругленные углы и выравнивание по верхнему краю */
.social-card-img,
.social-grid-media,
.social-library-card .social-card-img{
  border-radius:16px !important;
  overflow:hidden !important;
}
.social-card-img img,
.social-grid-media img,
.social-library-card .social-card-img img{
  border-radius:16px !important;
  object-position:top center !important;
}
.social-detail-panel-preview .social-detail-image{
  align-items:flex-start !important;
}
.social-detail-panel-preview .social-detail-image img,
#detailImg{
  border-radius:18px !important;
  object-position:top center !important;
}

/* 6) Панель полного названия поверх всех панелей */
.detail-title-modal{
  z-index:2147483647 !important;
}
.detail-title-modal-card{
  z-index:2147483647 !important;
}
@media(max-width:900px){
  .social-detail-under-meta,
  .social-detail-bottom-actions,
  .social-detail-tech-info{width:calc(100% - 24px) !important;}
  .social-detail-side-preview{padding-right:14px !important;}
  .social-comments-wrap{margin-right:0 !important;}
}

/* === Video generation panel === */
.video-generation-workspace{
  display:grid;
  grid-template-columns:minmax(360px, 1.05fr) minmax(320px, .95fr);
  gap:18px;
  align-items:start;
  width:100%;
}
.video-generation-card,.video-preview-card{
  background:var(--social-card-bg,#fff);
  border:1px solid rgba(130,130,130,.32);
  border-radius:18px;
  padding:18px;
  box-shadow:0 10px 30px rgba(20,20,20,.06);
}
.video-generation-head h2{margin:0 0 6px;font-size:24px;line-height:1.15}
.video-generation-head p{margin:0 0 16px;color:var(--social-muted,#777);font-size:14px;line-height:1.4}
.video-prompt-input{
  width:100%;
  min-height:150px;
  resize:vertical;
  border:1px solid rgba(130,130,130,.35);
  border-radius:14px;
  padding:12px 14px;
  font:inherit;
  outline:none;
  background:var(--social-input-bg,#fff);
  color:inherit;
}
.video-prompt-input:focus{border-color:rgba(90,90,90,.55);box-shadow:0 0 0 3px rgba(120,120,120,.12)}
.video-options-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}
.video-options-grid label{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--social-muted,#777)}
.video-options-grid select{
  height:40px;
  border:1px solid rgba(130,130,130,.35);
  border-radius:12px;
  padding:0 10px;
  background:var(--social-input-bg,#fff);
  color:inherit;
  font:inherit;
}
.video-upload-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}
.video-upload-zone{
  min-height:142px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:10px;
  border:1px solid rgba(130,130,130,.45);
  border-radius:16px;
  background:rgba(127,127,127,.035);
  color:inherit;
  cursor:pointer;
  overflow:hidden;
}
.video-upload-zone:hover{border-color:rgba(100,100,100,.65);background:rgba(127,127,127,.06)}
.video-upload-title{font-weight:700;font-size:14px;text-align:center}
.video-upload-zone small{font-size:11px;line-height:1.25;text-align:center;color:var(--social-muted,#777)}
.video-upload-empty{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:1px solid rgba(130,130,130,.35);font-size:24px;color:var(--social-muted,#777)}
.video-upload-zone img,.video-upload-zone video{width:100%;height:78px;object-fit:cover;border-radius:10px;margin-top:4px;background:transparent}
.video-generation-actions{display:flex;align-items:center;gap:10px;margin-top:16px;flex-wrap:wrap}
.video-generate-btn,.video-clear-btn{
  height:42px;
  border:0;
  border-radius:12px;
  padding:0 16px;
  font-weight:700;
  cursor:pointer;
}
.video-generate-btn{background:#111;color:#fff}
.video-clear-btn{background:rgba(127,127,127,.12);color:inherit}
.video-status{font-size:12px;color:var(--social-muted,#777);line-height:1.35;max-width:360px}
.video-preview-box{
  min-height:360px;
  border-radius:18px;
  background:transparent;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  color:#fff;
  text-align:center;
}
.video-preview-box img,.video-preview-box video{width:100%;height:100%;max-height:520px;object-fit:contain;background:transparent}
.video-preview-box div{display:flex;flex-direction:column;gap:6px;padding:22px}
.video-preview-box small{color:rgba(255,255,255,.72)}
.video-info-box{margin-top:12px;border:1px solid rgba(130,130,130,.32);border-radius:14px;padding:12px;font-size:13px;line-height:1.7;color:inherit}
body.social-dark .video-generation-card,body.social-dark .video-preview-card{background:rgba(28,28,30,.96);border-color:rgba(160,160,160,.25)}
body.social-dark .video-prompt-input,body.social-dark .video-options-grid select{background:rgba(255,255,255,.06);border-color:rgba(160,160,160,.25);color:#f2f2f2}
body.social-dark .video-clear-btn{background:rgba(255,255,255,.1)}
@media (max-width:980px){.video-generation-workspace{grid-template-columns:1fr}.video-upload-grid{grid-template-columns:1fr}.video-options-grid{grid-template-columns:1fr}}
/* === end video generation panel === */

/* === video generation server integration === */
.social-grid-media video{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  background:transparent;
}
.social-video-badge{
  position:absolute;
  left:10px;
  bottom:10px;
  z-index:4;
  width:34px;
  height:34px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.62);
  color:#fff;
  font-size:15px;
  backdrop-filter:blur(8px);
}
.social-detail-image video#detailVideo{
  width:100%;
  height:100%;
  max-height:100%;
  object-fit:contain;
  background:transparent;
  border-radius:inherit;
}
.video-generate-btn[disabled]{opacity:.65;cursor:wait;transform:none!important}
.video-status.is-error{color:#b00020}
/* === end video generation server integration === */

/* Video generation effects panel */
.video-effects-panel{margin-top:14px;border:1px solid rgba(130,130,130,.32);border-radius:16px;padding:14px;background:rgba(127,127,127,.045)}

.video-effects-launcher[data-video-effects-toggle]{cursor:pointer;transition:background .18s ease,border-color .18s ease}
.video-effects-launcher[data-video-effects-toggle]:hover{background:var(--social-hover-bg,rgba(120,120,120,.12));border-color:var(--social-hover-border,rgba(120,120,120,.45))}
.video-effects-launcher .video-effects-title{cursor:pointer;width:100%;background:transparent;border:0;text-align:left;padding:0}
.video-effects-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.video-effects-title b{font-size:15px}
.video-effects-title small{max-width:440px;color:var(--social-muted,#777);font-size:12px;line-height:1.35;text-align:right}
.video-effect-group{padding:10px 0;border-top:1px solid rgba(130,130,130,.18)}
.video-effect-group-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.video-effect-group-head b{font-size:13px}
.video-effect-group-head small{font-size:11px;color:var(--social-muted,#777)}
.video-effect-chips{display:flex;flex-wrap:wrap;gap:8px}
.video-effect-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(130,130,130,.34);border-radius:999px;padding:7px 10px;font-size:12px;line-height:1;cursor:pointer;background:rgba(255,255,255,.04);user-select:none;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.video-effect-chip:hover{border-color:rgba(90,90,90,.55);transform:translateY(-1px)}
.video-effect-chip input{width:14px;height:14px;margin:0;accent-color:#111}
.video-effect-chip.is-selected{background:rgba(20,20,20,.08);border-color:rgba(40,40,40,.55);font-weight:700}
.video-effects-selected{margin-top:8px;padding-top:10px;border-top:1px solid rgba(130,130,130,.18);font-size:12px;color:var(--social-muted,#777);line-height:1.35}
body.social-dark .video-effects-panel{background:rgba(255,255,255,.04);border-color:rgba(160,160,160,.25)}
body.social-dark .video-effect-chip{background:rgba(255,255,255,.05);border-color:rgba(160,160,160,.25)}
body.social-dark .video-effect-chip input{accent-color:#fff}
body.social-dark .video-effect-chip.is-selected{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.42)}
@media (max-width:680px){.video-effects-title{display:block}.video-effects-title small{display:block;text-align:left;margin-top:4px}.video-effect-chip{font-size:11px;padding:7px 9px}}

/* === expanded video effects panel === */
.video-effect-presets{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 12px}
.video-effect-presets button{border:1px solid rgba(130,130,130,.34);background:rgba(255,255,255,.06);border-radius:999px;padding:7px 11px;font-size:12px;line-height:1;cursor:pointer;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.video-effect-presets button:hover{border-color:rgba(80,80,80,.55);transform:translateY(-1px)}
.video-intensity-panel{margin-top:12px;padding-top:12px;border-top:1px solid rgba(130,130,130,.18)}
.video-intensity-row{display:grid;grid-template-columns:minmax(120px,1fr) minmax(120px,220px) 44px;align-items:center;gap:10px;padding:7px 0;font-size:12px;color:inherit}
.video-intensity-row input[type="range"]{width:100%;accent-color:#111}
.video-intensity-row b{font-size:12px;text-align:right;color:var(--social-muted,#777)}
.video-upload-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
body.social-dark .video-effect-presets button{background:rgba(255,255,255,.05);border-color:rgba(160,160,160,.25);color:#f2f2f2}
body.social-dark .video-effect-presets button:hover{border-color:rgba(255,255,255,.42)}
body.social-dark .video-intensity-row input[type="range"]{accent-color:#fff}
@media (max-width:1100px){.video-upload-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:680px){.video-upload-grid{grid-template-columns:1fr}.video-intensity-row{grid-template-columns:1fr}.video-intensity-row b{text-align:left}}
/* === end expanded video effects panel === */

/* === video uploads + collapsible effects + inner scroll fix === */
.video-upload-zone input[type="file"]{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.video-upload-zone{
  position:relative;
}
.video-effects-title{
  width:100%;
  border:0;
  background:transparent;
  color:inherit;
  padding:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
  text-align:left;
}
.video-effects-title span{display:grid;gap:3px;min-width:0}
.video-effects-title b{font-size:15px;line-height:1.2}
.video-effects-title small{color:var(--social-muted,#777);font-size:12px;line-height:1.25}
.video-effects-title i{font-style:normal;color:var(--social-muted,#777);font-size:12px;line-height:1;flex:0 0 auto}
.video-effects-body{display:none;margin-top:12px}
.video-effects-panel.is-open .video-effects-body{display:block}
.video-effects-panel:not(.is-open){padding:12px 14px}
.video-effects-panel:not(.is-open) .video-effects-selected{margin-top:8px;padding-top:8px}

body.social-video-mode{
  overflow:hidden !important;
}
body.social-video-mode .social-shell{
  height:100vh;
  overflow:hidden;
}
body.social-video-mode .social-main{
  height:100vh !important;
  overflow:hidden !important;
  display:flex;
  flex-direction:column;
  min-height:0;
}
body.social-video-mode .social-top{
  flex:0 0 auto;
}
body.social-video-mode #socialGrid{
  flex:1 1 auto;
  min-height:0;
  overflow:hidden !important;
  padding-bottom:0 !important;
}
body.social-video-mode .video-generation-workspace{
  height:100%;
  min-height:0;
  overflow:hidden;
}
body.social-video-mode .video-generation-card{
  max-height:calc(100vh - 98px);
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding-right:16px;
}
body.social-video-mode .video-preview-card{
  max-height:calc(100vh - 98px);
  overflow:hidden;
}
body.social-video-mode .social-load-more,
body.social-video-mode .social-popular{
  display:none !important;
}
body.social-dark .video-effects-title{color:#f2f2f2}
@media (max-width:980px){
  body.social-video-mode{overflow:auto !important;}
  body.social-video-mode .social-shell,
  body.social-video-mode .social-main,
  body.social-video-mode #socialGrid{height:auto !important;overflow:visible !important;}
  body.social-video-mode .video-generation-workspace{height:auto;overflow:visible;}
  body.social-video-mode .video-generation-card,
  body.social-video-mode .video-preview-card{max-height:none;overflow:visible;}
}
/* === end video uploads + collapsible effects + inner scroll fix === */


/* === Marketplace video safe fixes v36 === */
.marketplace-mode-switch{
  margin:8px 0 10px!important;
  padding:4px!important;
  border:1px solid #93c5fd!important;
  border-radius:14px!important;
  background:#eff6ff!important;
}
.marketplace-mode-switch button{
  height:30px!important;
  border:1px solid transparent!important;
  border-radius:10px!important;
  background:transparent!important;
  color:#2563eb!important;
  font-size:12px!important;
  font-weight:600!important;
}
.marketplace-mode-switch button.active{
  background:#dbeafe!important;
  border-color:#2563eb!important;
  color:#1d4ed8!important;
  box-shadow:none!important;
}
body.social-dark .marketplace-mode-switch{
  background:rgba(37,99,235,.14)!important;
  border-color:rgba(96,165,250,.75)!important;
}
body.social-dark .marketplace-mode-switch button{color:#93c5fd!important}
body.social-dark .marketplace-mode-switch button.active{
  background:rgba(59,130,246,.24)!important;
  border-color:#60a5fa!important;
  color:#bfdbfe!important;
}
.marketplace-video-options{display:none!important}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-body{
  max-height:none!important;
  overflow:visible!important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-body::-webkit-scrollbar{display:none!important}
.marketplace-video-effects .video-effect-group{margin:8px 0!important}
.marketplace-video-effects .video-effect-group-head{margin-bottom:5px!important;font-size:11px!important}
.marketplace-video-effects .video-effect-checks{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:4px!important;
}
.marketplace-video-effects .video-effect-checks label{
  min-height:22px!important;
  padding:2px 0!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  font-size:11px!important;
  line-height:1.15!important;
}
.marketplace-video-effects input[data-video-effect-checkbox]{
  appearance:none!important;
  -webkit-appearance:none!important;
  width:12px!important;
  height:12px!important;
  min-width:12px!important;
  border-radius:50%!important;
  border:1.5px solid #9ca3af!important;
  background:transparent!important;
  position:relative!important;
  margin:0!important;
}
.marketplace-video-effects input[data-video-effect-checkbox]:checked{
  border-color:#2563eb!important;
}
.marketplace-video-effects input[data-video-effect-checkbox]:checked::after{
  content:'';
  position:absolute;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#2563eb;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}
.marketplace-video-panel,
.marketplace-video-upload-grid,
.marketplace-video-images,
.marketplace-video-effects,
.marketplace-select-grid,
.marketplace-category-row{
  margin-top:8px!important;
  margin-bottom:8px!important;
}
.marketplace-editor .gen-upload-zones{gap:8px!important;margin-top:8px!important}
.marketplace-video-upload-grid{gap:8px!important}
.video-upload-zone{min-height:58px!important;padding:8px!important}
.video-upload-zone .video-upload-title{font-size:11px!important}
.video-upload-zone small{font-size:10px!important;line-height:1.15!important}

/* === Marketplace mode switch requested colors === */
.marketplace-mode-switch{
  background:#f3f4f6!important;
  border:1px solid #d1d5db!important;
  border-radius:14px!important;
  padding:4px!important;
  gap:6px!important;
}
.marketplace-mode-switch button{
  background:#f3f4f6!important;
  border:1px solid #d1d5db!important;
  color:#6b7280!important;
  font-weight:500!important;
  box-shadow:none!important;
  transition:background .18s ease,border-color .18s ease,color .18s ease!important;
}
.marketplace-mode-switch button.active{
  background:#dbeafe!important;
  border-color:#2563eb!important;
  color:#1d4ed8!important;
  font-weight:600!important;
  box-shadow:none!important;
}
body.social-dark .marketplace-mode-switch{
  background:#111827!important;
  border-color:#374151!important;
}
body.social-dark .marketplace-mode-switch button{
  background:#1f2937!important;
  border-color:#374151!important;
  color:#9ca3af!important;
}
body.social-dark .marketplace-mode-switch button.active{
  background:rgba(59,130,246,.24)!important;
  border-color:#60a5fa!important;
  color:#93c5fd!important;
}

/* === Marketplace video result/stage behavior fixes === */
.gen-canvas-frame .gen-canvas-video{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  border-radius:16px!important;
  display:block!important;
  background:#000!important;
}

/* One visible outline only for inactive marketplace mode switch buttons */
.marketplace-mode-switch button:not(.active){
  border-color:transparent!important;
  box-shadow:none!important;
}
.marketplace-mode-switch button.active{
  background:#dbeafe!important;
  border:1px solid #2563eb!important;
  color:#1d4ed8!important;
  box-shadow:none!important;
}
body.social-dark .marketplace-mode-switch button:not(.active){
  border-color:transparent!important;
}

/* Give the ordinary card mode more prompt space and push settings lower */
.marketplace-editor.mode-card .gen-desc-input{
  height:230px!important;
  min-height:230px!important;
  max-height:230px!important;
}
.marketplace-editor.mode-card .marketplace-select-grid{
  margin-top:auto!important;
}
@media (max-height:760px){
  .marketplace-editor.mode-card .gen-desc-input{
    height:190px!important;
    min-height:190px!important;
    max-height:190px!important;
  }
}

/* === User request: marketplace prompt button, video prompt common scroll, upload icon === */
.marketplace-workspace .marketplace-editor .gen-desc-head .gen-random-btn[data-market-prompt-sample]{
  transform:translateX(6px) !important;
}
.marketplace-workspace .marketplace-editor.mode-video .gen-desc-input{
  height:auto !important;
  min-height:150px !important;
  max-height:none !important;
  overflow-y:hidden !important;
  resize:none !important;
}
.marketplace-workspace .marketplace-editor.mode-video .gen-desc-input::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
}
.marketplace-workspace .marketplace-editor.mode-video .gen-desc-input{
  scrollbar-width:none !important;
}
.marketplace-video-upload-grid .video-upload-empty.is-download-icon{
  width:34px !important;
  height:34px !important;
  border:none !important;
  background:transparent !important;
  padding:0 !important;
}
.marketplace-video-upload-grid .video-upload-empty.is-download-icon img{
  width:24px !important;
  height:24px !important;
  object-fit:contain !important;
  margin:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  opacity:.78;
}
.marketplace-video-upload-grid .video-upload-zone:hover .video-upload-empty.is-download-icon img{
  opacity:1;
}
/* === end user request === */

/* Fix: animated progress ring for marketplace/video generation */
.gen-progress-ring{
  --gen-pct:0;
  width:86px;
  height:86px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  position:relative;
  color:#1a73e8;
  font-size:18px;
  font-weight:800;
  line-height:1;
  background:conic-gradient(#1a73e8 calc(var(--gen-pct,0) * 1%), #e5e7eb 0);
  animation:marketplaceProgressSpin 1.05s linear infinite;
  box-shadow:inset 0 0 0 1px rgba(26,115,232,.08);
}
.gen-progress-ring::before{
  content:"";
  position:absolute;
  inset:9px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 2px 8px rgba(17,24,39,.06);
  z-index:0;
}
.gen-progress-ring{ isolation:isolate; }
.gen-progress-ring::after{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:50%;
  border:2px solid transparent;
  border-top-color:rgba(26,115,232,.55);
  border-right-color:rgba(26,115,232,.18);
  z-index:2;
}
.gen-progress-ring{ text-indent:0; }
.gen-progress-ring > *{position:relative;z-index:3}
.gen-progress-ring{font-variant-numeric:tabular-nums;}
.gen-progress-ring{--dummy:0}
@keyframes marketplaceProgressSpin{to{transform:rotate(360deg)}}
.gen-progress-ring{ }
.gen-canvas-state .gen-progress-ring{margin-bottom:8px;}
.gen-canvas-state .gen-progress-ring{animation:marketplaceProgressSpin 1.05s linear infinite;}
/* keep percent text readable while ring rotates */
.gen-progress-ring{font-size:0;}
.gen-progress-ring::after{content:attr(data-label);display:flex;align-items:center;justify-content:center;color:#1a73e8;font-size:18px;font-weight:800;position:absolute;inset:9px;border:0;border-radius:50%;background:#fff;transform:rotate(calc(-1turn * 0));z-index:3;}
.social-dark .gen-progress-ring::before,.social-dark .gen-progress-ring::after{background:#111827;color:#93c5fd;}
.social-dark .gen-progress-ring{background:conic-gradient(#60a5fa calc(var(--gen-pct,0) * 1%), #374151 0);color:#93c5fd;}

/* Marketplace categories without icons */
.marketplace-category-current .marketplace-category-icon,
.marketplace-category-menu .marketplace-category-icon{display:none!important;}
.marketplace-category-current{gap:6px!important;}
.marketplace-category-menu button{gap:6px!important;}
/* Override progress ring: static percent text + rotating outer arc */
.gen-progress-ring{font-size:0!important;animation:none!important;position:relative!important;overflow:visible!important;}
.gen-progress-ring::before{content:""!important;position:absolute!important;inset:-3px!important;border-radius:50%!important;background:transparent!important;border:3px solid transparent!important;border-top-color:#1a73e8!important;border-right-color:rgba(26,115,232,.28)!important;box-shadow:none!important;animation:marketplaceProgressSpin .9s linear infinite!important;z-index:2!important;}
.gen-progress-ring::after{content:attr(data-label)!important;position:absolute!important;inset:9px!important;border-radius:50%!important;background:#fff!important;display:flex!important;align-items:center!important;justify-content:center!important;color:#1a73e8!important;font-size:18px!important;font-weight:800!important;z-index:3!important;border:0!important;transform:none!important;}
.social-dark .gen-progress-ring::after{background:#111827!important;color:#93c5fd!important;}
.social-dark .gen-progress-ring::before{border-top-color:#60a5fa!important;border-right-color:rgba(96,165,250,.3)!important;}


/* === Real fix: marketplace prompt grows with text, no hidden prompt lines === */
.marketplace-workspace .gen-preview-editor .marketplace-editor.gen-preview38-editor{
  display:flex!important;
  flex-direction:column!important;
  grid-template-rows:none!important;
  height:calc(100vh - 154px)!important;
  min-height:620px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  align-items:stretch!important;
}
.marketplace-workspace .marketplace-editor #marketPromptInput.gen-desc-input{
  flex:0 0 auto!important;
  height:auto;
  min-height:285px!important;
  max-height:none!important;
  overflow:hidden!important;
  resize:none!important;
  box-sizing:border-box!important;
  display:block!important;
}
.marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input{
  min-height:160px!important;
}
.marketplace-workspace .marketplace-editor .gen-desc-head [data-market-prompt-sample]{
  transform:translateX(1mm)!important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]{
  appearance:none!important;
  -webkit-appearance:none!important;
  box-sizing:border-box!important;
  width:12px!important;
  height:12px!important;
  min-width:12px!important;
  flex:0 0 12px!important;
  margin:0!important;
  border-radius:50%!important;
  position:relative!important;
  vertical-align:middle!important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]:checked::after{
  content:''!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:5px!important;
  height:5px!important;
  border-radius:50%!important;
  transform:translate(-50%,-50%)!important;
  margin:0!important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks label{
  align-items:center!important;
}


/* === Final targeted fixes: marketplace prompt autosize, sample button, centered video effect dot === */
.marketplace-workspace .gen-preview-editor .marketplace-editor.gen-preview38-editor{
  height:auto!important;
  min-height:calc(100vh - 154px)!important;
  max-height:none!important;
  overflow:visible!important;
}
.marketplace-workspace .marketplace-editor #marketPromptInput.gen-desc-input{
  height:auto!important;
  min-height:285px!important;
  max-height:none!important;
  overflow:hidden!important;
  resize:none!important;
  align-self:stretch!important;
}
.marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input{
  min-height:160px!important;
}
.marketplace-workspace .marketplace-editor .gen-desc-head [data-market-prompt-sample]{
  transform:translateX(1mm)!important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]{
  appearance:none!important;
  -webkit-appearance:none!important;
  display:inline-block!important;
  box-sizing:border-box!important;
  width:12px!important;
  height:12px!important;
  min-width:12px!important;
  flex:0 0 12px!important;
  margin:0!important;
  padding:0!important;
  border-radius:50%!important;
  position:relative!important;
  vertical-align:middle!important;
  background:#fff!important;
  line-height:0!important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]:checked::after{
  content:''!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:5px!important;
  height:5px!important;
  border-radius:50%!important;
  background:#2563eb!important;
  transform:translate(-50%,-50%)!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks label{
  display:flex!important;
  align-items:center!important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]{
  background:#111827!important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]:checked::after{
  background:#60a5fa!important;
}
/* === end final targeted fixes === */


/* === User correction: restore marketplace card sizing, restore video prompt scrollbar === */
.marketplace-workspace .gen-preview-editor .marketplace-editor.gen-preview38-editor{
  height:calc(100vh - 154px)!important;
  min-height:620px!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
.marketplace-workspace .marketplace-editor.mode-card #marketPromptInput.gen-desc-input{
  height:230px!important;
  min-height:230px!important;
  max-height:230px!important;
  overflow-y:auto!important;
  resize:vertical!important;
}
@media (max-height:760px){
  .marketplace-workspace .marketplace-editor.mode-card #marketPromptInput.gen-desc-input{
    height:190px!important;
    min-height:190px!important;
    max-height:190px!important;
  }
}
.marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input{
  height:160px!important;
  min-height:160px!important;
  max-height:160px!important;
  overflow-y:auto!important;
  resize:vertical!important;
  scrollbar-width:auto!important;
}
.marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input::-webkit-scrollbar{
  width:10px!important;
  height:10px!important;
}
/* === end user correction === */


/* === User correction v41: card mode no scroll, video mode keeps scroll, round effect dots === */
.marketplace-workspace .gen-preview-editor .marketplace-editor.gen-preview38-editor.mode-card,
.marketplace-workspace .marketplace-editor.gen-preview38-editor.mode-card{
  height:auto!important;
  min-height:calc(100vh - 154px)!important;
  max-height:none!important;
  overflow:visible!important;
  overflow-y:visible!important;
  overflow-x:visible!important;
}
.marketplace-workspace .gen-preview-editor .marketplace-editor.gen-preview38-editor.mode-video,
.marketplace-workspace .marketplace-editor.gen-preview38-editor.mode-video{
  height:calc(100vh - 154px)!important;
  min-height:620px!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
.marketplace-workspace .marketplace-editor.mode-card #marketPromptInput.gen-desc-input{
  height:auto!important;
  min-height:230px!important;
  max-height:none!important;
  overflow:hidden!important;
  overflow-y:hidden!important;
  resize:none!important;
  scrollbar-width:none!important;
}
.marketplace-workspace .marketplace-editor.mode-card #marketPromptInput.gen-desc-input::-webkit-scrollbar{
  display:none!important;
  width:0!important;
  height:0!important;
}
.marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input{
  height:160px!important;
  min-height:160px!important;
  max-height:160px!important;
  overflow-y:auto!important;
  resize:vertical!important;
  scrollbar-width:auto!important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]{
  appearance:none!important;
  -webkit-appearance:none!important;
  width:13px!important;
  height:13px!important;
  min-width:13px!important;
  flex:0 0 13px!important;
  box-sizing:border-box!important;
  margin:0!important;
  padding:0!important;
  border:1.5px solid #6b7280!important;
  border-radius:50%!important;
  background:#fff!important;
  position:relative!important;
  display:inline-block!important;
  vertical-align:middle!important;
  line-height:0!important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]:checked{
  border-color:#2563eb!important;
  background:#fff!important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]:checked::after{
  content:''!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:5px!important;
  height:5px!important;
  border-radius:50%!important;
  background:#2563eb!important;
  transform:translate(-50%,-50%)!important;
  margin:0!important;
  padding:0!important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks label{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]{
  background:#111827!important;
  border-color:#9ca3af!important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]:checked{
  border-color:#60a5fa!important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]:checked::after{
  background:#60a5fa!important;
}
/* === end user correction v41 === */


/* === Imported full Video Effects panel from social(43).zip === */
/* Video generation effects panel */
.video-effects-panel{margin-top:14px;border:1px solid rgba(130,130,130,.32);border-radius:16px;padding:14px;background:rgba(127,127,127,.045)}
.video-effects-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
.video-effects-title b{font-size:15px}
.video-effects-title small{max-width:440px;color:var(--social-muted,#777);font-size:12px;line-height:1.35;text-align:right}
.video-effect-group{padding:10px 0;border-top:1px solid rgba(130,130,130,.18)}
.video-effect-group-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.video-effect-group-head b{font-size:13px}
.video-effect-group-head small{font-size:11px;color:var(--social-muted,#777)}
.video-effect-chips{display:flex;flex-wrap:wrap;gap:8px}
.video-effect-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(130,130,130,.34);border-radius:999px;padding:7px 10px;font-size:12px;line-height:1;cursor:pointer;background:rgba(255,255,255,.04);user-select:none;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.video-effect-chip:hover{border-color:rgba(90,90,90,.55);transform:translateY(-1px)}
.video-effect-chip input{width:14px;height:14px;margin:0;accent-color:#111}
.video-effect-chip.is-selected{background:rgba(20,20,20,.08);border-color:rgba(40,40,40,.55);font-weight:700}
.video-effects-selected{margin-top:8px;padding-top:10px;border-top:1px solid rgba(130,130,130,.18);font-size:12px;color:var(--social-muted,#777);line-height:1.35}
body.social-dark .video-effects-panel{background:rgba(255,255,255,.04);border-color:rgba(160,160,160,.25)}
body.social-dark .video-effect-chip{background:rgba(255,255,255,.05);border-color:rgba(160,160,160,.25)}
body.social-dark .video-effect-chip input{accent-color:#fff}
body.social-dark .video-effect-chip.is-selected{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.42)}
@media (max-width:680px){.video-effects-title{display:block}.video-effects-title small{display:block;text-align:left;margin-top:4px}.video-effect-chip{font-size:11px;padding:7px 9px}}

/* === expanded video effects panel === */
.video-effect-presets{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 12px}
.video-effect-presets button{border:1px solid rgba(130,130,130,.34);background:rgba(255,255,255,.06);border-radius:999px;padding:7px 11px;font-size:12px;line-height:1;cursor:pointer;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.video-effect-presets button:hover{border-color:rgba(80,80,80,.55);transform:translateY(-1px)}
.video-intensity-panel{margin-top:12px;padding-top:12px;border-top:1px solid rgba(130,130,130,.18)}
.video-intensity-row{display:grid;grid-template-columns:minmax(120px,1fr) minmax(120px,220px) 44px;align-items:center;gap:10px;padding:7px 0;font-size:12px;color:inherit}
.video-intensity-row input[type="range"]{width:100%;accent-color:#111}
.video-intensity-row b{font-size:12px;text-align:right;color:var(--social-muted,#777)}
.video-upload-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
body.social-dark .video-effect-presets button{background:rgba(255,255,255,.05);border-color:rgba(160,160,160,.25);color:#f2f2f2}
body.social-dark .video-effect-presets button:hover{border-color:rgba(255,255,255,.42)}
body.social-dark .video-intensity-row input[type="range"]{accent-color:#fff}
@media (max-width:1100px){.video-upload-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:680px){.video-upload-grid{grid-template-columns:1fr}.video-intensity-row{grid-template-columns:1fr}.video-intensity-row b{text-align:left}}
/* === end expanded video effects panel === */

/* === video uploads + collapsible effects + inner scroll fix === */
.video-upload-zone input[type="file"]{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.video-upload-zone{
  position:relative;
}
.video-effects-title{
  width:100%;
  border:0;
  background:transparent;
  color:inherit;
  padding:0;
  margin:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
  text-align:left;
}
.video-effects-title span{display:grid;gap:3px;min-width:0}
.video-effects-title b{font-size:15px;line-height:1.2}
.video-effects-title small{color:var(--social-muted,#777);font-size:12px;line-height:1.25}
.video-effects-title i{font-style:normal;color:var(--social-muted,#777);font-size:12px;line-height:1;flex:0 0 auto}
.video-effects-body{display:none;margin-top:12px}
.video-effects-panel.is-open .video-effects-body{display:block}
.video-effects-panel:not(.is-open){padding:12px 14px}
.video-effects-panel:not(.is-open) .video-effects-selected{margin-top:8px;padding-top:8px}

body.social-video-mode{
  overflow:hidden !important;
}
body.social-video-mode .social-shell{
  height:100vh;
  overflow:hidden;
}
body.social-video-mode .social-main{
  height:100vh !important;
  overflow:hidden !important;
  display:flex;
  flex-direction:column;
  min-height:0;
}
body.social-video-mode .social-top{
  flex:0 0 auto;
}
body.social-video-mode #socialGrid{
  flex:1 1 auto;
  min-height:0;
  overflow:hidden !important;
  padding-bottom:0 !important;
}
body.social-video-mode .video-generation-workspace{
  height:100%;
  min-height:0;
  overflow:hidden;
}
body.social-video-mode .video-generation-card{
  max-height:calc(100vh - 98px);
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding-right:16px;
}
body.social-video-mode .video-preview-card{
  max-height:calc(100vh - 98px);
  overflow:hidden;
}
body.social-video-mode .social-load-more,
body.social-video-mode .social-popular{
  display:none !important;
}
body.social-dark .video-effects-title{color:#f2f2f2}
@media (max-width:980px){
  body.social-video-mode{overflow:auto !important;}
  body.social-video-mode .social-shell,
  body.social-video-mode .social-main,
  body.social-video-mode #socialGrid{height:auto !important;overflow:visible !important;}
  body.social-video-mode .video-generation-workspace{height:auto;overflow:visible;}
  body.social-video-mode .video-generation-card,
  body.social-video-mode .video-preview-card{max-height:none;overflow:visible;}
}
/* === end video uploads + collapsible effects + inner scroll fix === */

/* Marketplace card generator */
.marketplace-editor .marketplace-select-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.marketplace-editor .marketplace-select-grid label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#6b7280;font-weight:700}
.marketplace-editor .marketplace-select-grid select{height:38px;border:1px solid #d1d5db;border-radius:12px;background:#fff;color:#111827;padding:0 12px;font:inherit;outline:none}
.marketplace-specializations{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:10px 0 12px}
.marketplace-specializations button{border:1px solid #d1d5db;background:#fff;border-radius:12px;padding:9px 10px;text-align:left;font-weight:700;color:#374151;cursor:pointer;transition:.18s ease}
.marketplace-specializations button:hover{border-color:#9ca3af;transform:translateY(-1px)}
.marketplace-specializations button.active{background:#111827;color:#fff;border-color:#111827;box-shadow:0 8px 20px rgba(17,24,39,.16)}
.marketplace-controls .gen-aspect-select{pointer-events:none;opacity:.85}
.marketplace-hint{margin-top:10px;border:1px solid #d1d5db;border-radius:12px;padding:10px 12px;color:#6b7280;font-size:12px;line-height:1.35;background:#f9fafb}
.marketplace-workspace .gen-preview-stage .gen-canvas-state b::after{content:' маркетплейса'}
.social-dark .marketplace-editor .marketplace-select-grid select,.social-dark .marketplace-specializations button{background:#111827;color:#e5e7eb;border-color:#374151}
.social-dark .marketplace-specializations button.active{background:#e5e7eb;color:#111827;border-color:#e5e7eb}
.social-dark .marketplace-hint{background:#111827;border-color:#374151;color:#9ca3af}
@media (max-width:900px){.marketplace-editor .marketplace-select-grid,.marketplace-specializations{grid-template-columns:1fr}}

/* Marketplace category dropdown with SVG icons */
.marketplace-category-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:10px 0 12px;align-items:end}
.marketplace-category-dd{position:relative;min-width:0}
.marketplace-category-current{width:100%;height:42px;border:1px solid #d1d5db;border-radius:12px;background:#fff;color:#111827;padding:0 12px;display:flex;align-items:center;gap:9px;font:inherit;font-weight:800;cursor:pointer;transition:.18s ease;text-align:left}
.marketplace-category-current:hover{border-color:#9ca3af;box-shadow:0 8px 20px rgba(17,24,39,.08)}
.marketplace-category-current span:nth-child(2){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.marketplace-category-icon{width:24px;height:24px;border-radius:8px;background:#f3f4f6;color:#374151;display:inline-flex;align-items:center;justify-content:center;flex:0 0 24px}
.marketplace-category-arrow{margin-left:auto;transition:transform .18s ease;flex:0 0 16px;color:#6b7280}
.marketplace-category-dd.open .marketplace-category-arrow{transform:rotate(180deg)}
.marketplace-category-menu{position:absolute;z-index:50;left:0;right:0;top:calc(100% + 6px);padding:6px;border:1px solid #d1d5db;border-radius:14px;background:#fff;box-shadow:0 18px 45px rgba(17,24,39,.18);display:none;max-height:260px;overflow:auto}
.marketplace-category-dd.open .marketplace-category-menu{display:block}
.marketplace-category-menu button{width:100%;border:0;background:transparent;border-radius:10px;padding:8px 9px;display:flex;align-items:center;gap:9px;color:#374151;font-weight:800;cursor:pointer;text-align:left;transition:.16s ease}
.marketplace-category-menu button:hover{background:#f3f4f6;color:#111827}
.marketplace-category-menu button.active{background:#111827;color:#fff}
.marketplace-category-menu button.active .marketplace-category-icon{background:rgba(255,255,255,.16);color:#fff}
.marketplace-subcategory-label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#6b7280;font-weight:700;min-width:0}
.marketplace-subcategory-label select{height:42px;border:1px solid #d1d5db;border-radius:12px;background:#fff;color:#111827;padding:0 12px;font:inherit;outline:none;min-width:0}
.marketplace-specializations{display:none!important}
.social-dark .marketplace-category-current,.social-dark .marketplace-category-menu,.social-dark .marketplace-subcategory-label select{background:#111827;color:#e5e7eb;border-color:#374151}
.social-dark .marketplace-category-icon{background:#1f2937;color:#d1d5db}
.social-dark .marketplace-category-menu button{color:#e5e7eb}
.social-dark .marketplace-category-menu button:hover{background:#1f2937;color:#fff}
.social-dark .marketplace-category-menu button.active{background:#e5e7eb;color:#111827}
.social-dark .marketplace-category-menu button.active .marketplace-category-icon{background:rgba(17,24,39,.12);color:#111827}
@media (max-width:900px){.marketplace-category-row{grid-template-columns:1fr}}


/* Marketplace compact controls */
.marketplace-editor .marketplace-select-grid{gap:8px;margin:10px 0}
.marketplace-editor .marketplace-select-grid label{font-weight:500;font-size:11px;gap:5px}
.marketplace-editor .marketplace-select-grid select{height:34px;border-radius:10px;padding:0 9px;font-size:12px;font-weight:400}
.marketplace-category-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;margin:8px 0 10px}
.marketplace-category-field{display:flex;flex-direction:column;gap:5px;min-width:0}
.marketplace-field-label{font-size:11px;line-height:1.2;color:#6b7280;font-weight:500}
.marketplace-category-current{height:34px;border-radius:10px;padding:0 9px;gap:7px;font-size:12px;font-weight:400}
.marketplace-category-icon{width:18px;height:18px;flex-basis:18px;border-radius:6px}
.marketplace-category-icon svg{width:14px;height:14px}
.marketplace-category-arrow{width:14px;height:14px;flex-basis:14px}
.marketplace-category-menu{top:calc(100% + 5px);padding:5px;border-radius:12px;max-height:230px}
.marketplace-category-menu button{padding:7px 8px;gap:7px;font-size:12px;font-weight:400}
.marketplace-subcategory-label{gap:5px;font-size:11px;font-weight:500}
.marketplace-subcategory-label select{height:34px;border-radius:10px;padding:0 9px;font-size:12px;font-weight:400}
.marketplace-editor .gen-upload-zone{padding:9px 10px;min-height:74px}
.marketplace-editor .gen-upload-text b{font-size:12px;font-weight:600}
.marketplace-editor .gen-upload-text small{font-size:11px}
.marketplace-editor .gen-desc-controls{gap:8px}
.marketplace-editor .gen-desc-controls select,.marketplace-editor .gen-desc-controls button{height:34px;border-radius:10px;padding:0 9px;font-size:12px;font-weight:400}
.marketplace-editor .gen-generate-btn{min-height:38px;padding:9px 12px;font-size:13px}
.social-dark .marketplace-field-label{color:#9ca3af}
@media (max-width:900px){.marketplace-category-row{grid-template-columns:1fr}}

/* Marketplace compact dropdown fixes */
.marketplace-editor .marketplace-select-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
.marketplace-select-field{position:relative;display:flex;flex-direction:column;gap:5px;min-width:0}
.marketplace-select-current{font-weight:400;justify-content:flex-start}
.marketplace-select-current span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.marketplace-category-current{font-weight:400}
.marketplace-category-menu{top:auto!important;bottom:calc(100% + 5px)!important}
.marketplace-category-menu button{font-weight:400}
.marketplace-select-menu button span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.marketplace-subcategory-label{display:none!important}
.marketplace-controls{grid-template-columns:60px 72px minmax(0,1fr)!important;gap:3px!important;align-items:center}
.marketplace-controls .gen-own-images{min-width:0!important;width:72px!important;padding-left:8px!important;padding-right:8px!important;white-space:nowrap}
.marketplace-controls .gen-desc-generate{min-width:0!important;padding-left:9px!important;padding-right:9px!important;white-space:nowrap}
.marketplace-controls .gen-aspect-select{min-width:0!important;width:60px!important;padding-left:7px!important;padding-right:7px!important}
.social-dark .marketplace-select-field .marketplace-field-label{color:#9ca3af}
@media (max-width:900px){.marketplace-controls{grid-template-columns:60px 72px minmax(0,1fr)!important}.marketplace-editor .marketplace-select-grid{grid-template-columns:1fr}}


/* Marketplace dropdown/button fixes */
.marketplace-select-field.open .marketplace-category-menu{display:block!important}
.marketplace-select-field.open .marketplace-category-arrow{transform:rotate(180deg)}
.marketplace-select-field .marketplace-category-menu{top:auto!important;bottom:calc(100% + 5px)!important}
.marketplace-select-field .marketplace-category-menu button{font-weight:400;display:flex;align-items:center;gap:7px;width:100%;border:0;background:transparent;border-radius:10px;padding:7px 8px;color:#374151;cursor:pointer;text-align:left;transition:.16s ease;font-size:12px}
.marketplace-select-field .marketplace-category-menu button:hover{background:#f3f4f6;color:#111827}
.marketplace-select-field .marketplace-category-menu button.active{background:#111827;color:#fff}
.marketplace-editor .gen-upload-zones{margin-top:16px}
.marketplace-editor .gen-desc-controls.marketplace-controls{margin-top:14px!important;grid-template-columns:42px 58px minmax(0,1fr)!important;gap:10px!important;align-items:center}
.marketplace-editor .marketplace-clear-btn{width:42px!important;min-width:42px!important;padding:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
.marketplace-editor .marketplace-clear-btn svg{display:block;color:currentColor}
.marketplace-editor .marketplace-aspect-btn{width:58px!important;min-width:58px!important;text-align:center!important;justify-content:center!important}
.social-dark .marketplace-select-field .marketplace-category-menu button{color:#e5e7eb}
.social-dark .marketplace-select-field .marketplace-category-menu button:hover{background:#1f2937;color:#fff}
.social-dark .marketplace-select-field .marketplace-category-menu button.active{background:#e5e7eb;color:#111827}

/* Marketplace compact controls and closer upward dropdowns */
.marketplace-category-menu,
.marketplace-select-field .marketplace-category-menu{bottom:calc(100% + 2px)!important;top:auto!important}
.marketplace-editor .gen-desc-controls.marketplace-controls{grid-template-columns:42px minmax(122px,142px) minmax(0,1fr)!important;gap:9px!important;align-items:center;margin-top:18px!important}
.marketplace-select-compact{min-width:0;width:100%;display:block;position:relative}
.marketplace-select-compact .marketplace-category-current{height:34px;border-radius:10px;padding:0 8px;font-size:11.5px;font-weight:400;white-space:nowrap}
.marketplace-select-compact .marketplace-category-current span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.marketplace-select-compact .marketplace-category-menu{min-width:100%;max-height:190px}
.marketplace-editor .gen-upload-zones{margin-top:20px!important}
@media (max-width:900px){.marketplace-editor .gen-desc-controls.marketplace-controls{grid-template-columns:42px minmax(122px,142px) minmax(0,1fr)!important}}

/* Marketplace controls final alignment */
.marketplace-editor .gen-desc-controls.marketplace-controls{
  grid-template-columns:42px minmax(0,1fr) minmax(126px,142px)!important;
  gap:9px!important;
  align-items:center!important;
  margin-top:18px!important;
}
.marketplace-editor .marketplace-clear-btn{
  width:42px!important;
  min-width:42px!important;
  height:34px!important;
}
.marketplace-editor .gen-desc-controls.marketplace-controls .gen-desc-generate{
  min-width:0!important;
  width:100%!important;
  height:34px!important;
  padding-left:8px!important;
  padding-right:8px!important;
  white-space:nowrap!important;
}
.marketplace-editor .marketplace-select-compact{
  min-width:126px!important;
  width:100%!important;
}
.marketplace-editor .marketplace-select-compact .marketplace-category-current{
  height:34px!important;
  padding-left:8px!important;
  padding-right:7px!important;
  font-size:11px!important;
}
.marketplace-editor .marketplace-select-compact .marketplace-category-menu{
  min-width:132px!important;
  left:auto!important;
  right:0!important;
}
/* Move all custom marketplace dropdown panels closer to their buttons; keep category unchanged */
.marketplace-select-field .marketplace-category-menu{
  top:auto!important;
  bottom:36px!important;
}
.marketplace-category-dd .marketplace-category-menu{
  top:auto!important;
  bottom:calc(100% + 2px)!important;
}
.marketplace-select-menu button span{
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
@media (max-width:900px){
  .marketplace-editor .gen-desc-controls.marketplace-controls{
    grid-template-columns:42px minmax(0,1fr) minmax(126px,142px)!important;
  }
}

/* Marketplace ratio/static dropdown fixes */
.marketplace-aspect-static .marketplace-category-current{
  pointer-events:none!important;
  cursor:default!important;
  opacity:1!important;
  justify-content:center!important;
  text-align:center!important;
}
.marketplace-aspect-static .marketplace-category-current span:first-child{
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
}
.marketplace-select-menu,
.marketplace-category-menu{
  overflow-x:hidden!important;
}
.marketplace-select-menu button,
.marketplace-category-menu button{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  line-height:1.25!important;
}
.marketplace-select-menu button span,
.marketplace-category-menu button span:nth-child(2){
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}
.marketplace-select-field .marketplace-category-menu{
  bottom:calc(100% + 2px)!important;
}
.marketplace-category-dd .marketplace-category-menu{
  bottom:calc(100% + 2px)!important;
}

/* Final marketplace compact aspect and dropdown positioning */
.marketplace-editor .gen-desc-controls.marketplace-controls{
  grid-template-columns:42px minmax(0,1fr) 46px!important;
  gap:9px!important;
  align-items:center!important;
}
.marketplace-editor .marketplace-select-compact{
  min-width:46px!important;
  width:46px!important;
  max-width:46px!important;
}
.marketplace-editor .marketplace-select-compact .marketplace-category-current{
  width:46px!important;
  min-width:46px!important;
  padding-left:6px!important;
  padding-right:6px!important;
  justify-content:center!important;
  text-align:center!important;
}
.marketplace-editor .marketplace-select-compact .marketplace-category-current span:first-child{
  text-align:center!important;
}
/* Bring all marketplace dropdown panels closer to their trigger buttons except Category */
.marketplace-select-field:not(.marketplace-category-dd) .marketplace-category-menu{
  bottom:calc(100% - 3px)!important;
  top:auto!important;
}
.marketplace-category-dd .marketplace-category-menu{
  bottom:calc(100% + 2px)!important;
  top:auto!important;
}
.marketplace-select-menu,
.marketplace-category-menu{
  overflow-x:hidden!important;
}
.marketplace-select-menu button,
.marketplace-category-menu button,
.marketplace-select-menu button span,
.marketplace-category-menu button span{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  text-overflow:clip!important;
}
@media (max-width:900px){
  .marketplace-editor .gen-desc-controls.marketplace-controls{
    grid-template-columns:42px minmax(0,1fr) 46px!important;
  }
}

/* Final marketplace control placement and dropdown distance fix */
.marketplace-editor .gen-desc-controls.marketplace-controls{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin-top:18px!important;
  grid-template-columns:none!important;
  width:100%!important;
}
.marketplace-editor .marketplace-clear-btn{
  flex:0 0 42px!important;
  width:42px!important;
  min-width:42px!important;
  height:34px!important;
  padding:0!important;
}
.marketplace-editor .gen-desc-controls.marketplace-controls .gen-desc-generate{
  order:2!important;
  flex:0 0 auto!important;
  width:auto!important;
  min-width:112px!important;
  height:34px!important;
  padding:0 12px!important;
  white-space:nowrap!important;
}
.marketplace-editor .gen-desc-controls.marketplace-controls .marketplace-aspect-static{
  order:3!important;
  flex:0 0 44px!important;
  width:44px!important;
  min-width:44px!important;
  max-width:44px!important;
  margin:0!important;
}
.marketplace-editor .marketplace-aspect-static .marketplace-category-current{
  width:44px!important;
  min-width:44px!important;
  max-width:44px!important;
  height:34px!important;
  padding:0!important;
  justify-content:center!important;
  text-align:center!important;
  font-size:11px!important;
}
.marketplace-editor .marketplace-aspect-static .marketplace-category-current span:first-child{
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
/* Dropdowns with labels: keep opening upward, but place them directly near their button, not above the label */
.marketplace-select-field .marketplace-category-menu{
  top:auto!important;
  bottom:36px!important;
  transform:none!important;
}
.marketplace-category-dd .marketplace-category-menu{
  top:auto!important;
  bottom:calc(100% + 2px)!important;
  transform:none!important;
}

/* User final marketplace fixes */
.marketplace-editor .gen-desc-controls.marketplace-controls{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin-top:18px!important;
  width:100%!important;
}
.marketplace-editor .marketplace-clear-btn,
.marketplace-editor .marketplace-aspect-static .marketplace-category-current{
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  height:34px!important;
  border:1px solid #d1d5db!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#111827!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-shadow:none!important;
}
.marketplace-editor .marketplace-clear-btn img{
  width:17px!important;
  height:17px!important;
  display:block!important;
  object-fit:contain!important;
}
.marketplace-editor .gen-desc-controls.marketplace-controls .marketplace-aspect-static{
  order:2!important;
  flex:0 0 42px!important;
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  margin:0!important;
}
.marketplace-editor .gen-desc-controls.marketplace-controls .gen-desc-generate{
  order:3!important;
  flex:1 1 auto!important;
  min-width:0!important;
  height:34px!important;
  padding:0 10px!important;
  white-space:nowrap!important;
}
.marketplace-editor .marketplace-aspect-static .marketplace-category-current span:first-child{
  font-size:11px!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.marketplace-select-field .marketplace-category-menu{
  top:auto!important;
  bottom:34px!important;
  transform:none!important;
}
.marketplace-category-dd .marketplace-category-menu{
  top:auto!important;
  bottom:calc(100% + 2px)!important;
  transform:none!important;
}
.marketplace-select-menu,
.marketplace-category-menu{overflow-x:hidden!important;}
.marketplace-select-menu button,
.marketplace-category-menu button,
.marketplace-select-menu button span,
.marketplace-category-menu button span{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
  text-overflow:clip!important;
}
.social-dark .marketplace-editor .marketplace-clear-btn,
.social-dark .marketplace-editor .marketplace-aspect-static .marketplace-category-current{
  background:#111827!important;
  color:#e5e7eb!important;
  border-color:#374151!important;
}

/* Marketplace image/video switch */
.marketplace-mode-switch{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:12px 0 10px;padding:4px;border:1px solid #d1d5db;border-radius:14px;background:#f3f4f6}
.marketplace-mode-switch button{height:32px;border:0;border-radius:10px;background:transparent;color:#6b7280;font-size:12px;font-weight:600;cursor:pointer;transition:.18s ease}
.marketplace-mode-switch button.active{background:#111827;color:#fff;box-shadow:0 8px 18px rgba(17,24,39,.14)}
.marketplace-video-panel{display:flex;flex-direction:column;gap:10px;margin-top:8px}
.marketplace-video-upload-grid{display:grid;gap:8px}
.marketplace-video-upload-grid .video-upload-zone{min-height:64px;padding:9px 10px;border-radius:12px}
.marketplace-video-upload-grid .video-upload-zone img,
.marketplace-video-upload-grid .video-upload-zone video{max-height:70px;border-radius:10px}
.marketplace-video-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.marketplace-video-options label{display:flex;flex-direction:column;gap:5px;font-size:11px;color:#6b7280;font-weight:500;min-width:0}
.marketplace-video-options select{height:34px;border:1px solid #d1d5db;border-radius:10px;background:#fff;color:#111827;padding:0 9px;font-size:12px;font-weight:400;outline:none;min-width:0}
.marketplace-video-effects{margin:0;border-radius:12px;overflow:hidden}
.marketplace-video-effects .video-effects-title{padding:9px 10px;border-radius:12px}
.marketplace-video-effects .video-effects-body{max-height:250px;overflow:auto}
.marketplace-video-effects .video-effect-checks{gap:6px}
.marketplace-video-images{margin-top:0!important}
.social-dark .marketplace-mode-switch{background:#111827;border-color:#374151}
.social-dark .marketplace-mode-switch button{color:#9ca3af}
.social-dark .marketplace-mode-switch button.active{background:#e5e7eb;color:#111827}
.social-dark .marketplace-video-options select{background:#111827;color:#e5e7eb;border-color:#374151}
@media (max-width:900px){.marketplace-video-options{grid-template-columns:1fr}}

/* === Marketplace inner scroll like prompt scrollbar === */
.marketplace-workspace .gen-preview-editor{
  min-height:0 !important;
  overflow:hidden !important;
}
.marketplace-workspace .gen-preview-editor .marketplace-editor{
  height:100% !important;
  max-height:100% !important;
  min-height:0 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain !important;
  scrollbar-gutter:stable !important;
  padding-right:12px !important;
  scrollbar-width:thin !important;
  scrollbar-color:#b8bec8 transparent !important;
}
.marketplace-workspace .gen-preview-editor .marketplace-editor::-webkit-scrollbar{
  width:6px !important;
  height:6px !important;
}
.marketplace-workspace .gen-preview-editor .marketplace-editor::-webkit-scrollbar-track{
  background:transparent !important;
}
.marketplace-workspace .gen-preview-editor .marketplace-editor::-webkit-scrollbar-thumb{
  background:#b8bec8 !important;
  border-radius:999px !important;
}
.marketplace-workspace .gen-preview-editor .marketplace-editor::-webkit-scrollbar-thumb:hover{
  background:#9ca3af !important;
}
.marketplace-workspace .marketplace-editor .gen-desc-head,
.marketplace-workspace .marketplace-editor .gen-desc-controls,
.marketplace-workspace .marketplace-editor .marketplace-hint{
  flex:0 0 auto !important;
}
.marketplace-workspace .marketplace-editor .gen-desc-input{
  flex:0 0 auto !important;
  height:150px !important;
  min-height:150px !important;
  max-height:150px !important;
  overflow-y:auto !important;
  padding:14px 1px 12px !important;
  scrollbar-width:thin !important;
  scrollbar-color:#b8bec8 transparent !important;
}
.marketplace-workspace .marketplace-editor .gen-desc-input::-webkit-scrollbar{
  width:6px !important;
  height:6px !important;
}
.marketplace-workspace .marketplace-editor .gen-desc-input::-webkit-scrollbar-track{
  background:transparent !important;
}
.marketplace-workspace .marketplace-editor .gen-desc-input::-webkit-scrollbar-thumb{
  background:#b8bec8 !important;
  border-radius:999px !important;
}
.marketplace-workspace .marketplace-editor .gen-desc-input::-webkit-scrollbar-thumb:hover{
  background:#9ca3af !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-body{
  max-height:none !important;
  overflow-y:visible !important;
  overflow-x:hidden !important;
  scrollbar-width:thin !important;
  scrollbar-color:#b8bec8 transparent !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-body::-webkit-scrollbar{
  width:6px !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-body::-webkit-scrollbar-track{
  background:transparent !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-body::-webkit-scrollbar-thumb{
  background:#b8bec8 !important;
  border-radius:999px !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-body::-webkit-scrollbar-thumb:hover{
  background:#9ca3af !important;
}
body.social-page.social-dark .marketplace-workspace .gen-preview-editor .marketplace-editor,
body.social-page.social-dark .marketplace-workspace .marketplace-editor .gen-desc-input,
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-body{
  scrollbar-color:#4b5563 transparent !important;
}
body.social-page.social-dark .marketplace-workspace .gen-preview-editor .marketplace-editor::-webkit-scrollbar-thumb,
body.social-page.social-dark .marketplace-workspace .marketplace-editor .gen-desc-input::-webkit-scrollbar-thumb,
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-body::-webkit-scrollbar-thumb{
  background:#4b5563 !important;
}


/* Marketplace video effects compact layout */
.marketplace-workspace .marketplace-editor .marketplace-video-panel{
  gap:6px !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-upload-grid{
  gap:6px !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-options{
  gap:6px !important;
  margin:0 !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects{
  margin-top:2px !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-title{
  padding:7px 9px !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-body{
  margin-top:6px !important;
  padding-right:4px !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-group{
  padding:6px 0 !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-group-head{
  margin-bottom:5px !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-group-head b{
  font-size:11px !important;
  font-weight:600 !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-group-head small{
  font-size:10px !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:4px !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks label{
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
  min-height:22px !important;
  padding:2px 3px !important;
  font-size:11px !important;
  line-height:1.2 !important;
  font-weight:400 !important;
  cursor:pointer !important;
  border-radius:8px !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks label:hover{
  background:rgba(127,127,127,.08) !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"]{
  appearance:none !important;
  -webkit-appearance:none !important;
  width:13px !important;
  height:13px !important;
  min-width:13px !important;
  margin:0 !important;
  border:1px solid #aeb4be !important;
  border-radius:50% !important;
  background:#fff !important;
  position:relative !important;
  cursor:pointer !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"]:checked{
  border-color:#111827 !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"]:checked::after{
  content:'' !important;
  position:absolute !important;
  left:3px !important;
  top:3px !important;
  width:5px !important;
  height:5px !important;
  border-radius:50% !important;
  background:#111827 !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks span{
  font-size:11px !important;
  line-height:1.2 !important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"]{
  background:#111827 !important;
  border-color:#4b5563 !important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"]:checked{
  border-color:#e5e7eb !important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"]:checked::after{
  background:#e5e7eb !important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks label:hover{
  background:rgba(255,255,255,.07) !important;
}
/* === End imported full Video Effects panel === */

/* === v46 fix: perfectly centered modern round video effect selectors === */
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"],
.marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]{
  appearance:none !important;
  -webkit-appearance:none !important;
  position:relative !important;
  display:inline-grid !important;
  place-items:center !important;
  width:14px !important;
  height:14px !important;
  min-width:14px !important;
  flex:0 0 14px !important;
  margin:0 !important;
  padding:0 !important;
  border:1.5px solid #b8c0cc !important;
  border-radius:50% !important;
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%) !important;
  box-sizing:border-box !important;
  cursor:pointer !important;
  vertical-align:middle !important;
  line-height:0 !important;
  transform:none !important;
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"]:checked,
.marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]:checked{
  border-color:#111827 !important;
  background:#ffffff !important;
  box-shadow:0 0 0 3px rgba(17,24,39,.08) !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"]::before,
.marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]::before,
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"]::after,
.marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]::after{
  box-sizing:border-box !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"]:checked::after,
.marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]:checked::after{
  content:'' !important;
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  right:auto !important;
  bottom:auto !important;
  width:6px !important;
  height:6px !important;
  border:0 !important;
  border-radius:50% !important;
  background:#111827 !important;
  transform:translate(-50%,-50%) !important;
  margin:0 !important;
  padding:0 !important;
  box-shadow:none !important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"],
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]{
  background:linear-gradient(180deg,#1f2937 0%,#111827 100%) !important;
  border-color:#5b6472 !important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"]:checked,
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]:checked{
  border-color:#f3f4f6 !important;
  box-shadow:0 0 0 3px rgba(243,244,246,.10) !important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effect-checks input[type="checkbox"]:checked::after,
body.social-page.social-dark .marketplace-workspace .marketplace-editor .marketplace-video-effects input[data-video-effect-checkbox]:checked::after{
  background:#f3f4f6 !important;
}
/* === end v46 fix === */


/* === Fix: marketplace card prompt has its own scroll; video prompt uses panel scroll === */
.marketplace-workspace .marketplace-editor.mode-card .gen-desc-input#marketPromptInput{
  height:230px !important;
  min-height:230px !important;
  max-height:230px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  resize:none !important;
  scrollbar-width:thin !important;
  scrollbar-color:#b8bec8 transparent !important;
}
.marketplace-workspace .marketplace-editor.mode-card .gen-desc-input#marketPromptInput::-webkit-scrollbar{
  width:6px !important;
}
.marketplace-workspace .marketplace-editor.mode-card .gen-desc-input#marketPromptInput::-webkit-scrollbar-track{
  background:transparent !important;
}
.marketplace-workspace .marketplace-editor.mode-card .gen-desc-input#marketPromptInput::-webkit-scrollbar-thumb{
  background:#b8bec8 !important;
  border-radius:999px !important;
}
.marketplace-workspace .marketplace-editor.mode-card .gen-desc-input#marketPromptInput::-webkit-scrollbar-thumb:hover{
  background:#9ca3af !important;
}
.marketplace-workspace .marketplace-editor.mode-video .gen-desc-input#marketPromptInput{
  min-height:160px !important;
  max-height:none !important;
  overflow-y:hidden !important;
  overflow-x:hidden !important;
  resize:none !important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor.mode-card .gen-desc-input#marketPromptInput{
  scrollbar-color:#4b5563 transparent !important;
}
body.social-page.social-dark .marketplace-workspace .marketplace-editor.mode-card .gen-desc-input#marketPromptInput::-webkit-scrollbar-thumb{
  background:#4b5563 !important;
}

/* Fix: hide broken detail image in video preview so alt text like "Изображение" is not shown next to video */
.social-detail-panel-preview .social-detail-image img.is-hidden,
.social-detail-panel-preview .social-detail-image img[hidden],
#detailImg.is-hidden,
#detailImg[hidden]{
  display:none !important;
  visibility:hidden !important;
  width:0 !important;
  height:0 !important;
  max-width:0 !important;
  max-height:0 !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
}

/* compact marketplace spacing */
.marketplace-card .controls,.video-card .controls,.marketplace-panel .actions{gap:10px!important}.marketplace-panel .field{margin-bottom:10px!important}

/* v63: быстрый старт списков — видео в карточках показывается постером, mp4 грузится только при открытии */
.social-video-placeholder{display:block;width:100%;height:100%;min-height:120px;background:linear-gradient(135deg,#eef2f7,#dfe7f2);border-radius:inherit;}
.social-card-img.no-preview{background:linear-gradient(135deg,#eef2f7,#dfe7f2);}

/* === v67: Marketplace video sample icon + top-15 subscriptions cards === */
.marketplace-workspace .marketplace-editor.mode-video .gen-desc-head [data-market-prompt-sample]{
  transform:translateX(1mm) !important;
}
body.social-page .social-grid.is-top-users{
  display:block !important;
  columns:auto !important;
  column-width:auto !important;
  column-gap:0 !important;
  padding:18px 22px 30px !important;
  margin:0 !important;
}
.social-top-users-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(118px, 1fr));
  gap:22px 20px;
  align-items:start;
}
.social-top-user-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  text-align:center;
  min-width:0;
  padding:0 4px 4px;
}
.social-top-user-avatar{
  width:88px;
  height:88px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:hsl(var(--top-user-hue, 210), 72%, 48%);
  color:#fff;
  font-size:42px;
  line-height:1;
  font-weight:500;
  margin-bottom:9px;
  box-shadow:none;
}
.social-top-user-avatar.has-image{background:#e5e7eb;}
.social-top-user-avatar img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.social-top-user-name{
  max-width:118px;
  color:#111827;
  font-size:16px;
  line-height:1.12;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  margin-bottom:5px;
}
.social-top-user-followers{
  max-width:118px;
  color:#8b8f97;
  font-size:14px;
  line-height:1.12;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  margin-bottom:12px;
}
.social-top-user-subscribe{
  appearance:none;
  border:none;
  border-radius:999px;
  background:#151515;
  color:#fff;
  min-height:42px;
  padding:0 18px;
  font-size:14px;
  font-weight:800;
  cursor:pointer;
  box-shadow:none;
}
.social-top-user-subscribe:hover{background:transparent;}
body.social-page.social-dark .social-top-user-name{color:#f9fafb;}
body.social-page.social-dark .social-top-user-followers{color:#a1a1aa;}
body.social-page.social-dark .social-top-user-subscribe{background:#f9fafb;color:#111827;}
@media(max-width:520px){
  body.social-page .social-grid.is-top-users{padding:16px 14px 28px !important;}
  .social-top-users-grid{grid-template-columns:repeat(3, minmax(82px, 1fr));gap:18px 12px;}
  .social-top-user-avatar{width:72px;height:72px;font-size:34px;}
  .social-top-user-name{font-size:14px;max-width:92px;}
  .social-top-user-followers{font-size:12px;max-width:92px;}
  .social-top-user-subscribe{min-height:36px;padding:0 13px;font-size:12px;}
}
/* === end v67 === */

/* === v68: subscriptions active cards + compact one-row top users === */
body.social-page .social-grid.is-subscriptions-view{
  display:block !important;
  columns:auto !important;
  column-width:auto !important;
  column-gap:0 !important;
  padding:18px 22px 30px !important;
  margin:0 !important;
}
.social-subscriptions-active,
.social-top-users-section{
  display:block;
  width:100%;
}
.social-subscriptions-title,
.social-top-users-title{
  font-size:16px;
  line-height:1.2;
  font-weight:900;
  color:#111827;
  margin:0 0 12px;
}
.social-subscriptions-active-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,220px));
  gap:18px;
  align-items:start;
  justify-content:start;
  margin-bottom:24px;
}
.social-subscriptions-empty{
  margin-bottom:22px !important;
}
.social-top-users-section{
  border-top:1px solid #edf0f4;
  padding-top:16px;
  margin-top:4px;
}
.social-top-users-row{
  display:flex;
  flex-wrap:nowrap;
  align-items:flex-start;
  gap:14px;
  overflow-x:auto;
  overflow-y:hidden;
  padding:2px 2px 8px;
  scrollbar-width:thin;
}
.social-top-users-row .social-top-user-card{
  width:74px;
  min-width:74px;
  padding:0;
}
.social-top-users-row .social-top-user-avatar{
  width:52px;
  height:52px;
  font-size:25px;
  margin-bottom:6px;
}
.social-top-users-row .social-top-user-name{
  max-width:74px;
  font-size:12px;
  line-height:1.1;
  margin-bottom:3px;
}
.social-top-users-row .social-top-user-followers{
  max-width:74px;
  font-size:10px;
  line-height:1.05;
  margin-bottom:7px;
}
.social-top-users-row .social-top-user-subscribe{
  min-height:28px;
  padding:0 10px;
  font-size:10px;
  font-weight:800;
}
.social-top-users-row .social-top-user-card.is-subscribed .social-top-user-subscribe{
  background:#111;
  color:#fff;
}
body.social-page.social-dark .social-subscriptions-title,
body.social-page.social-dark .social-top-users-title{color:#f9fafb;}
body.social-page.social-dark .social-top-users-section{border-top-color:#303744;}
@media(max-width:520px){
  body.social-page .social-grid.is-subscriptions-view{padding:16px 14px 28px !important;}
  .social-subscriptions-active-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;}
  .social-top-users-row{gap:12px;}
}
/* === end v68 === */

/* === v69: clean subscriptions page, active subscriptions + top users only === */
body.social-page .social-grid.is-subscriptions-view{
  display:block !important;
  columns:auto !important;
  column-width:auto !important;
  column-gap:0 !important;
  padding:18px 22px 34px !important;
  margin:0 !important;
  background:#fff;
}
.social-subscriptions-active{
  width:100%;
  margin:0 0 22px;
}
.social-subscriptions-users-row{
  display:flex;
  align-items:flex-start;
  gap:28px;
  overflow-x:auto;
  overflow-y:hidden;
  padding:4px 2px 10px;
  scrollbar-width:thin;
}
.social-subscriptions-users-row .social-top-user-card{
  width:104px;
  min-width:104px;
  padding:0;
}
.social-subscriptions-users-row .social-top-user-avatar{
  width:76px;
  height:76px;
  font-size:36px;
  margin-bottom:8px;
}
.social-subscriptions-users-row .social-top-user-name{
  max-width:104px;
  font-size:14px;
  line-height:1.12;
  margin-bottom:4px;
}
.social-subscriptions-users-row .social-top-user-followers{
  max-width:104px;
  font-size:12px;
  line-height:1.08;
  margin-bottom:9px;
}
.social-subscriptions-users-row .social-top-user-subscribe{
  min-height:32px;
  padding:0 13px;
  font-size:11px;
}
.social-top-users-section{
  width:100%;
  border-top:1px solid #edf0f4;
  padding-top:16px;
  margin-top:8px;
}
.social-top-users-row{
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:flex-start;
  gap:18px;
  overflow-x:auto;
  overflow-y:hidden;
  padding:4px 2px 10px;
  scrollbar-width:thin;
}
.social-top-users-row .social-top-user-card{
  width:72px;
  min-width:72px;
  padding:0;
}
.social-top-users-row .social-top-user-avatar{
  width:50px;
  height:50px;
  font-size:24px;
  margin-bottom:6px;
}
.social-top-users-row .social-top-user-name{
  max-width:72px;
  font-size:11px;
  line-height:1.08;
  margin-bottom:3px;
}
.social-top-users-row .social-top-user-followers{
  max-width:72px;
  font-size:9px;
  line-height:1.05;
  margin-bottom:7px;
}
.social-top-users-row .social-top-user-subscribe{
  min-height:27px;
  padding:0 9px;
  font-size:9px;
}
.social-top-user-subscribe{white-space:nowrap;}
.social-top-user-card.is-subscribed .social-top-user-subscribe{background:#111;color:#fff;}
body.social-page.social-dark .social-grid.is-subscriptions-view{background:transparent;}
@media(max-width:700px){
  body.social-page .social-grid.is-subscriptions-view{padding:16px 14px 28px !important;}
  .social-subscriptions-users-row{gap:20px;}
  .social-top-users-row{gap:14px;}
}
/* === end v69 === */


/* === social79: subscriptions page hard layout from clean base === */
body.social-page #socialPopular,
body.social-page #socialPopularRow{display:none!important;}
body.social-page .social-main > #socialGrid.is-subscriptions-view{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  grid-template-columns:none!important;
  columns:auto!important;
  column-width:auto!important;
  column-gap:0!important;
  width:100%!important;
  max-width:none!important;
  min-height:calc(100vh - 72px)!important;
  margin:0!important;
  padding:22px 24px 60px!important;
  overflow:visible!important;
  background:#fff!important;
}
body.social-page #socialGrid.is-subscriptions-view > .social-card,
body.social-page #socialGrid.is-subscriptions-view > .social-generation-row{display:none!important;}
body.social-page #socialGrid.is-subscriptions-view > .social-subscriptions-active,
body.social-page #socialGrid.is-subscriptions-view > .social-top-users-section{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  flex:0 0 auto!important;
  clear:both!important;
  float:none!important;
  position:static!important;
  margin-left:0!important;
  margin-right:0!important;
}
body.social-page #socialGrid.is-subscriptions-view > .social-subscriptions-active{margin:0 0 34px!important;padding:0!important;}
body.social-page #socialGrid.is-subscriptions-view > .social-top-users-section{margin:0!important;padding:18px 0 0!important;border-top:1px solid #edf0f4!important;}
body.social-page #socialGrid.is-subscriptions-view .social-subscriptions-title,
body.social-page #socialGrid.is-subscriptions-view .social-top-users-title{
  display:block!important;width:100%!important;margin:0 0 16px!important;padding:0!important;
  font-size:19px!important;line-height:1.15!important;font-weight:900!important;color:#111827!important;text-align:left!important;
}
body.social-page #socialGrid.is-subscriptions-view .social-subscriptions-users-row,
body.social-page #socialGrid.is-subscriptions-view .social-top-users-row{
  display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:flex-start!important;justify-content:flex-start!important;
  width:100%!important;max-width:none!important;min-width:0!important;margin:0!important;padding:0!important;
  overflow:visible!important;overflow-x:visible!important;scrollbar-width:none!important;
}
body.social-page #socialGrid.is-subscriptions-view .social-subscriptions-users-row::-webkit-scrollbar,
body.social-page #socialGrid.is-subscriptions-view .social-top-users-row::-webkit-scrollbar{display:none!important;}
body.social-page #socialGrid.is-subscriptions-view .social-subscriptions-users-row{gap:30px 38px!important;}
body.social-page #socialGrid.is-subscriptions-view .social-top-users-row{gap:18px 24px!important;}
body.social-page #socialGrid.is-subscriptions-view .social-top-user-card{
  display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;
  border:0!important;background:transparent!important;box-shadow:none!important;text-align:center!important;padding:0!important;margin:0!important;cursor:pointer!important;
}
body.social-page #socialGrid.is-subscriptions-view .social-subscriptions-users-row .social-top-user-card{width:108px!important;min-width:108px!important;}
body.social-page #socialGrid.is-subscriptions-view .social-top-users-row .social-top-user-card{width:82px!important;min-width:82px!important;}
body.social-page #socialGrid.is-subscriptions-view .social-top-user-avatar{
  display:flex!important;align-items:center!important;justify-content:center!important;border-radius:50%!important;overflow:hidden!important;
  color:#fff!important;background:hsl(var(--top-user-hue,205) 78% 48%)!important;font-weight:900!important;line-height:1!important;
}
body.social-page #socialGrid.is-subscriptions-view .social-subscriptions-users-row .social-top-user-avatar{width:78px!important;height:78px!important;font-size:38px!important;margin:0 0 8px!important;}
body.social-page #socialGrid.is-subscriptions-view .social-top-users-row .social-top-user-avatar{width:56px!important;height:56px!important;font-size:26px!important;margin:0 0 6px!important;}
body.social-page #socialGrid.is-subscriptions-view .social-top-user-avatar img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;}
body.social-page #socialGrid.is-subscriptions-view .social-top-user-name{display:block!important;font-weight:900!important;color:#111!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;text-align:center!important;}
body.social-page #socialGrid.is-subscriptions-view .social-subscriptions-users-row .social-top-user-name{max-width:108px!important;font-size:14px!important;line-height:1.12!important;margin:0 0 4px!important;}
body.social-page #socialGrid.is-subscriptions-view .social-top-users-row .social-top-user-name{max-width:82px!important;font-size:11px!important;line-height:1.08!important;margin:0 0 3px!important;}
body.social-page #socialGrid.is-subscriptions-view .social-top-user-followers{display:block!important;color:#6b7280!important;white-space:nowrap!important;text-align:center!important;overflow:hidden!important;text-overflow:ellipsis!important;}
body.social-page #socialGrid.is-subscriptions-view .social-subscriptions-users-row .social-top-user-followers{max-width:108px!important;font-size:12px!important;line-height:1.08!important;margin:0 0 9px!important;}
body.social-page #socialGrid.is-subscriptions-view .social-top-users-row .social-top-user-followers{max-width:82px!important;font-size:9px!important;line-height:1.05!important;margin:0 0 7px!important;}
body.social-page #socialGrid.is-subscriptions-view .social-top-user-subscribe{display:inline-flex!important;align-items:center!important;justify-content:center!important;border:0!important;border-radius:999px!important;background:#050505!important;color:#fff!important;font-weight:900!important;line-height:1!important;white-space:nowrap!important;cursor:pointer!important;}
body.social-page #socialGrid.is-subscriptions-view .social-subscriptions-users-row .social-top-user-subscribe{min-height:32px!important;padding:0 14px!important;font-size:11px!important;}
body.social-page #socialGrid.is-subscriptions-view .social-top-users-row .social-top-user-subscribe{min-height:27px!important;padding:0 9px!important;font-size:9px!important;}
body.social-page #socialGrid.is-subscriptions-view .social-subscriptions-empty{width:100%!important;margin:0!important;padding:14px 0 20px!important;color:#6b7280!important;background:transparent!important;box-shadow:none!important;border:0!important;}
body.social-page.social-dark .social-main > #socialGrid.is-subscriptions-view{background:#000!important;}
body.social-page.social-dark #socialGrid.is-subscriptions-view .social-subscriptions-title,
body.social-page.social-dark #socialGrid.is-subscriptions-view .social-top-users-title,
body.social-page.social-dark #socialGrid.is-subscriptions-view .social-top-user-name{color:#f9fafb!important;}
body.social-page.social-dark #socialGrid.is-subscriptions-view > .social-top-users-section{border-top-color:#303744!important;}
@media(max-width:700px){body.social-page .social-main > #socialGrid.is-subscriptions-view{padding:16px 14px 34px!important;}body.social-page #socialGrid.is-subscriptions-view .social-subscriptions-users-row{gap:22px!important;}body.social-page #socialGrid.is-subscriptions-view .social-top-users-row{gap:14px!important;}}
/* === end social79 === */

/* === social80: subscriptions page only — remove Top-15 completely === */
body.social-page #socialGrid.is-subscriptions-view > .social-top-users-section,
body.social-page #socialGrid.is-subscriptions-view .social-top-users-section,
body.social-page #socialGrid.is-subscriptions-view .social-top-users-title,
body.social-page #socialGrid.is-subscriptions-view .social-top-users-row{
  display:none!important;
}
body.social-page .social-main > #socialGrid.is-subscriptions-view{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  padding:18px 24px 44px!important;
  column-count:initial!important;
  columns:initial!important;
  overflow:visible!important;
}
body.social-page #socialGrid.is-subscriptions-view > .social-subscriptions-active{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}
body.social-page #socialGrid.is-subscriptions-view .social-subscriptions-users-row{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:22px 34px!important;
  width:100%!important;
  max-width:none!important;
  overflow:visible!important;
}


/* === social81: My subscriptions = only subscribed authors' cards, no extra circles/sections === */
body.social-page #socialGrid.is-subscriptions-cards-view{
  display:block!important;
  column-width:var(--my-logo-card-column-width)!important;
  column-gap:var(--my-logo-card-column-gap)!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  background:transparent!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-card,
body.social-page #socialGrid.is-subscriptions-cards-view > .social-grid-card{
  display:inline-block!important;
  width:100%!important;
  break-inside:avoid!important;
  margin:0 0 var(--my-logo-card-row-gap)!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view .social-subscriptions-active,
body.social-page #socialGrid.is-subscriptions-cards-view .social-top-users-section,
body.social-page #socialGrid.is-subscriptions-cards-view .social-subscriptions-users-row,
body.social-page #socialGrid.is-subscriptions-cards-view .social-top-users-row,
body.social-page #socialGrid.is-subscriptions-cards-view .social-top-user-card,
body.social-page #socialGrid.is-subscriptions-cards-view .social-subscriptions-title,
body.social-page #socialGrid.is-subscriptions-cards-view .social-top-users-title{
  display:none!important;
}

/* === social82: remove gray background under cards in My subscriptions === */
body.social-page:has(#socialGrid.is-subscriptions-cards-view),
body.social-page:has(#socialGrid.is-subscriptions-cards-view) .social-shell,
body.social-page:has(#socialGrid.is-subscriptions-cards-view) .social-main,
body.social-page:has(#socialGrid.is-subscriptions-cards-view) .social-content,
body.social-page:has(#socialGrid.is-subscriptions-cards-view) #socialGrid,
body.social-page #socialGrid.is-subscriptions-cards-view{
  background:#fff!important;
  background-image:none!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-card,
body.social-page #socialGrid.is-subscriptions-cards-view > .social-grid-card,
body.social-page #socialGrid.is-subscriptions-cards-view .social-card-actions,
body.social-page #socialGrid.is-subscriptions-cards-view .social-grid-actions,
body.social-page #socialGrid.is-subscriptions-cards-view .social-grid-footer{
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  border-color:transparent!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view .social-card-img,
body.social-page #socialGrid.is-subscriptions-cards-view .social-grid-media{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view .social-card-img.no-preview,
body.social-page #socialGrid.is-subscriptions-cards-view .social-video-placeholder{
  background:#fff!important;
  background-image:none!important;
}
body.social-page.social-dark:has(#socialGrid.is-subscriptions-cards-view),
body.social-page.social-dark:has(#socialGrid.is-subscriptions-cards-view) .social-shell,
body.social-page.social-dark:has(#socialGrid.is-subscriptions-cards-view) .social-main,
body.social-page.social-dark:has(#socialGrid.is-subscriptions-cards-view) .social-content,
body.social-page.social-dark:has(#socialGrid.is-subscriptions-cards-view) #socialGrid,
body.social-page.social-dark #socialGrid.is-subscriptions-cards-view{
  background:#000!important;
  background-image:none!important;
}

/* === social83: Top-15 at the very bottom of subscribed publication cards === */
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users{
  display:block!important;
  column-span:all!important;
  -webkit-column-span:all!important;
  width:100%!important;
  max-width:none!important;
  clear:both!important;
  margin:34px 0 0!important;
  padding:22px 0 0!important;
  border-top:1px solid #edf0f4!important;
  background:transparent!important;
  box-shadow:none!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-users-title{
  display:block!important;
  margin:0 0 16px!important;
  padding:0!important;
  color:#111827!important;
  font-size:19px!important;
  line-height:1.15!important;
  font-weight:900!important;
  text-align:left!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-users-row{
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:wrap!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:18px 24px!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
  overflow-x:visible!important;
  scrollbar-width:none!important;
  background:transparent!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-users-row::-webkit-scrollbar{display:none!important;}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:82px!important;
  min-width:82px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  text-align:center!important;
  cursor:pointer!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-avatar{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:56px!important;
  height:56px!important;
  margin:0 0 6px!important;
  border-radius:50%!important;
  overflow:hidden!important;
  color:#fff!important;
  background:hsl(var(--top-user-hue,205) 78% 48%)!important;
  font-size:26px!important;
  font-weight:900!important;
  line-height:1!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-avatar img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-name{
  display:block!important;
  max-width:82px!important;
  margin:0 0 3px!important;
  color:#111!important;
  font-size:11px!important;
  line-height:1.08!important;
  font-weight:900!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:center!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-followers{
  display:block!important;
  max-width:82px!important;
  margin:0 0 7px!important;
  color:#6b7280!important;
  font-size:9px!important;
  line-height:1.05!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:center!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-subscribe{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:27px!important;
  padding:0 9px!important;
  border:0!important;
  border-radius:999px!important;
  background:#050505!important;
  color:#fff!important;
  font-size:9px!important;
  font-weight:900!important;
  line-height:1!important;
  white-space:nowrap!important;
  cursor:pointer!important;
}
body.social-page.social-dark #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users{border-top-color:#303744!important;}
body.social-page.social-dark #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-users-title,
body.social-page.social-dark #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-name{color:#f9fafb!important;}
@media(max-width:700px){body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-users-row{gap:14px!important;}}
/* === end social83 === */


/* === social97 / step 10: CSS-изоляция по зонам ===
   Эти правила не меняют дизайн. Они создают безопасные границы для будущих правок:
   стили генераторов, ленты и подписок теперь можно писать через body.social-zone-* или
   [data-social-zone="..."] и не задевать остальные вкладки. */
.social-main[data-social-zone]{
  isolation:isolate;
}
.social-zone-generate #socialGrid,
.social-zone-video #socialGrid,
.social-zone-marketplace #socialGrid,
.social-zone-library #socialGrid{
  background:transparent;
}
.social-zone-generate #socialGenerator[data-social-zone-owner="generate"],
.social-zone-video #socialGrid[data-social-zone-owner="video"],
.social-zone-marketplace #socialGrid[data-social-zone-owner="marketplace"],
.social-zone-feed #socialGrid[data-social-zone-owner="feed"],
.social-zone-subscriptions #socialGrid[data-social-zone-owner="subscriptions"],
.social-zone-notifications #socialGrid[data-social-zone-owner="notifications"]{
  box-sizing:border-box;
}
.social-zone-subscriptions #socialGrid{
  --social-local-card-bg:transparent;
}
.social-zone-video #socialGrid,
.social-zone-marketplace #socialGrid,
.social-zone-generate #socialGenerator{
  --social-local-card-bg:#fff;
}


/* cross26.SVG for social modal close buttons */
.social-auth-close,.social-close,.detail-title-modal-close,.social-image-lightbox-close{font-size:0!important;line-height:0!important;color:transparent!important;background:#f9fafb url("../icons/ui/cross26.SVG") center/100% 100% no-repeat!important;border:0!important;box-shadow:none!important;overflow:hidden!important;}
.social-auth-close::before,.social-close::before,.detail-title-modal-close::before,.social-image-lightbox-close::before{content:""!important;}
.social-auth-close:hover,.social-close:hover,.detail-title-modal-close:hover,.social-image-lightbox-close:hover{background:#f9fafb url("../icons/ui/cross26.SVG") center/100% 100% no-repeat!important;filter:none!important;}

/* === FIX: cross26 must stay square, not clipped by round social SVG masks === */
body.social-page button.social-close,
body.social-page button.social-detail-close,
body.social-page button.social-auth-close,
body.social-page button.detail-title-modal-close,
body.social-page button.social-image-lightbox-close,
body.social-page .social-detail-close,
body.social-page .social-close,
body.social-page .social-auth-close,
body.social-page .detail-title-modal-close,
body.social-page .social-image-lightbox-close{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  min-height:38px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  overflow:visible!important;
  clip-path:none!important;
  -webkit-clip-path:none!important;
  mask:none!important;
  -webkit-mask:none!important;
  background-color:transparent!important;
  background-image:url("../icons/ui/cross26.SVG")!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:100% 100%!important;
  box-shadow:none!important;
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  text-indent:-9999px!important;
  opacity:1!important;
  filter:none!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  cursor:pointer!important;
  transition:filter .16s ease!important;
}
body.social-page button.social-close::before,
body.social-page button.social-detail-close::before,
body.social-page button.social-auth-close::before,
body.social-page button.detail-title-modal-close::before,
body.social-page button.social-image-lightbox-close::before,
body.social-page button.social-close::after,
body.social-page button.social-detail-close::after,
body.social-page button.social-auth-close::after,
body.social-page button.detail-title-modal-close::after,
body.social-page button.social-image-lightbox-close::after{
  content:none!important;
  display:none!important;
}
body.social-page button.social-close:hover,
body.social-page button.social-detail-close:hover,
body.social-page button.social-auth-close:hover,
body.social-page button.detail-title-modal-close:hover,
body.social-page button.social-image-lightbox-close:hover{
  background-color:transparent!important;
  background-image:url("../icons/ui/cross26.SVG")!important;
  filter:brightness(.91)!important;
}
body.social-page img[src*="cross26"],
body.social-page svg[class*="cross26"],
body.social-page [style*="cross26.SVG"]{
  border-radius:0!important;
  overflow:visible!important;
  clip-path:none!important;
  -webkit-clip-path:none!important;
  mask:none!important;
  -webkit-mask:none!important;
  object-fit:contain!important;
}



/* Prompt fields use native browser caret via JS autofocus. */


/* Fix: native blinking caret for empty prompt fields */
#marketPromptInput,
#generationPromptInput,
#videoPromptInput{
  caret-color:#111827 !important;
  -webkit-user-select:text !important;
  user-select:text !important;
}
#marketPromptInput:focus,
#generationPromptInput:focus,
#videoPromptInput:focus{
  caret-color:#111827 !important;
}
body.social-page.social-dark #marketPromptInput,
body.social-page.social-dark #generationPromptInput,
body.social-page.social-dark #videoPromptInput,
body.social-page.social-dark #marketPromptInput:focus,
body.social-page.social-dark #generationPromptInput:focus,
body.social-page.social-dark #videoPromptInput:focus{
  caret-color:#ffffff !important;
}

/* Model menu tooltips: pale yellow panel like constructor hints */
.gen-dd-menu[data-gen-menu="model"]{
  overflow: visible !important;
  z-index: 99999 !important;
}
.gen-dd-menu[data-gen-menu="model"] button[data-model-tip]{
  position: relative !important;
  overflow: visible !important;
}
.gen-dd-menu[data-gen-menu="model"] button[data-model-tip]::after{
  content: attr(data-model-tip);
  position: absolute !important;
  left: calc(100% + 10px) !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 315px !important;
  max-width: min(315px, 72vw) !important;
  padding: 12px 14px !important;
  border: 1px solid #e6d36a !important;
  border-radius: 12px !important;
  background: #fff9c4 !important;
  color: #111 !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.16) !important;
  font-size: 13px !important;
  line-height: 1.38 !important;
  font-weight: 500 !important;
  text-align: left !important;
  white-space: pre-line !important;
  pointer-events: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity .16s ease, visibility .16s ease !important;
  z-index: 100000 !important;
}
.gen-dd-menu[data-gen-menu="model"] button[data-model-tip]::before{
  content: "";
  position: absolute !important;
  left: calc(100% + 3px) !important;
  top: 50% !important;
  transform: translateY(-50%) rotate(45deg) !important;
  width: 12px !important;
  height: 12px !important;
  background: #fff9c4 !important;
  border-left: 1px solid #e6d36a !important;
  border-bottom: 1px solid #e6d36a !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity .16s ease, visibility .16s ease !important;
  z-index: 100001 !important;
}
.gen-dd-menu[data-gen-menu="model"] button[data-model-tip]:hover::after,
.gen-dd-menu[data-gen-menu="model"] button[data-model-tip]:focus-visible::after,
.gen-dd-menu[data-gen-menu="model"] button[data-model-tip]:hover::before,
.gen-dd-menu[data-gen-menu="model"] button[data-model-tip]:focus-visible::before{
  opacity: 1 !important;
  visibility: visible !important;
}
@media (max-width: 720px){
  .gen-dd-menu[data-gen-menu="model"] button[data-model-tip]::after{
    left: auto !important;
    right: 0 !important;
    top: auto !important;
    bottom: calc(100% + 8px) !important;
    transform: none !important;
    width: 280px !important;
  }
  .gen-dd-menu[data-gen-menu="model"] button[data-model-tip]::before{
    display: none !important;
  }
}

/* Real body-level tooltip for generation model menu */
.gen-dd-menu[data-gen-menu="model"] button[data-model-tip]::before,
.gen-dd-menu[data-gen-menu="model"] button[data-model-tip]::after{
  display:none !important;
}
.model-hover-tip{
  position: fixed !important;
  z-index: 2147483647 !important;
  width: 315px !important;
  max-width: calc(100vw - 20px) !important;
  padding: 12px 14px !important;
  border: 1px solid #e6d36a !important;
  border-radius: 12px !important;
  background: #fff9c4 !important;
  color: #111 !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.16) !important;
  font-size: 13px !important;
  line-height: 1.38 !important;
  font-weight: 500 !important;
  text-align: left !important;
  white-space: pre-line !important;
  pointer-events: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: opacity .16s ease, visibility .16s ease !important;
}
.model-hover-tip.show{
  opacity: 1 !important;
  visibility: visible !important;
}

/* === Top-15 users: gray rating note + current user-card size, panels unchanged === */
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-users-note{
  display:block!important;
  width:100%!important;
  margin:0 0 18px!important;
  padding:0!important;
  color:#6b7280!important;
  font-size:14px!important;
  line-height:1.45!important;
  font-weight:400!important;
  text-align:left!important;
}
body.social-page.social-dark #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-users-note{
  color:#9ca3af!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-users-row{
  gap:24px 32px!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-card{
  width:111px!important;
  min-width:111px!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-avatar{
  width:76px!important;
  height:76px!important;
  margin-bottom:8px!important;
  font-size:35px!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-name{
  max-width:111px!important;
  font-size:15px!important;
  line-height:1.1!important;
  margin-bottom:4px!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-followers{
  max-width:111px!important;
  font-size:12px!important;
  line-height:1.08!important;
  margin-bottom:10px!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-subscribe{
  min-height:37px!important;
  padding:0 13px!important;
  font-size:12px!important;
}
@media(max-width:700px){
  body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-users-row{gap:20px 23px!important;}
  body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-card{width:104px!important;min-width:104px!important;}
  body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-avatar{width:70px!important;height:70px!important;font-size:32px!important;}
  body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-name{max-width:104px!important;font-size:14px!important;}
  body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-followers{max-width:104px!important;font-size:11px!important;}
  body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-subscribe{min-height:35px!important;font-size:11px!important;}
}
/* === end Top-15 users fix === */


.social-top-user-card{
transition:transform .18s ease, box-shadow .18s ease!important;
will-change:transform;
}
.social-top-user-card:hover{
transform:translateY(-5px);
}

/* === Rating explanation text: safe block under Top-15 users === */
.social-rating-howto{
  margin:18px 0 0;
  color:#4b5563;
  font-size:14px;
  line-height:1.55;
  font-weight:400;
}
.social-rating-howto p{
  margin:0 0 12px;
  font-weight:400;
}
.social-rating-howto p:last-child{
  margin-bottom:0;
}
.social-rating-howto strong{
  font-weight:800;
  color:#111827;
}
.social-rating-howto-title{
  color:#111827;
  font-size:16px;
  line-height:1.3;
}


/* === Rating explanation preview layout with robot image === */
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-users-note{
  max-width:760px!important;
  line-height:1.45!important;
}
.social-rating-howto.social-rating-howto-preview{
  margin:52px 0 0!important;
  display:flex!important;
  align-items:flex-start!important;
  gap:52px!important;
  color:#4b5563!important;
  font-size:18px!important;
  line-height:1.48!important;
  font-weight:400!important;
  max-width:1180px!important;
}
.social-rating-howto-preview .social-rating-howto-image-wrap{
  flex:0 0 280px!important;
  display:flex!important;
  justify-content:center!important;
  align-items:flex-start!important;
}
.social-rating-howto-preview .social-rating-howto-image{
  width:280px!important;
  max-width:100%!important;
  height:auto!important;
  display:block!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.social-rating-howto-preview .social-rating-howto-text{
  flex:1 1 auto!important;
  min-width:0!important;
  max-width:820px!important;
}
.social-rating-howto-preview .social-rating-howto-title{
  margin:0 0 22px!important;
  color:#111827!important;
  font-size:32px!important;
  line-height:1.2!important;
  font-weight:800!important;
}
.social-rating-howto-preview p{
  margin:0 0 18px!important;
  font-weight:400!important;
}
.social-rating-howto-preview strong{
  font-weight:800!important;
  color:#111827!important;
}
@media(max-width:900px){
  .social-rating-howto.social-rating-howto-preview{
    gap:28px!important;
    font-size:16px!important;
  }
  .social-rating-howto-preview .social-rating-howto-image-wrap{
    flex-basis:210px!important;
  }
  .social-rating-howto-preview .social-rating-howto-image{
    width:210px!important;
  }
  .social-rating-howto-preview .social-rating-howto-title{
    font-size:26px!important;
  }
}
@media(max-width:700px){
  .social-rating-howto.social-rating-howto-preview{
    margin-top:34px!important;
    flex-direction:column!important;
    gap:18px!important;
    font-size:15px!important;
  }
  .social-rating-howto-preview .social-rating-howto-image-wrap{
    flex-basis:auto!important;
    width:100%!important;
    justify-content:flex-start!important;
  }
  .social-rating-howto-preview .social-rating-howto-image{
    width:190px!important;
  }
  .social-rating-howto-preview .social-rating-howto-title{
    font-size:24px!important;
  }
}

/* === Final layout: centered rating explanation, compact robot, compact/lower Top-15 cards === */
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-users-row{
  margin-top:38px!important;
  gap:22px 29px!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-card{
  width:100px!important;
  min-width:100px!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-avatar{
  width:68px!important;
  height:68px!important;
  margin-bottom:7px!important;
  font-size:32px!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-name{
  max-width:100px!important;
  font-size:14px!important;
  line-height:1.1!important;
  margin-bottom:4px!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-followers{
  max-width:100px!important;
  font-size:11px!important;
  line-height:1.08!important;
  margin-bottom:9px!important;
}
body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-subscribe{
  min-height:33px!important;
  padding:0 12px!important;
  font-size:11px!important;
}
.social-rating-howto.social-rating-howto-preview{
  margin:90px auto 0!important;
  justify-content:center!important;
  align-items:flex-start!important;
  max-width:1050px!important;
  width:fit-content!important;
  font-size:16px!important;
  line-height:1.45!important;
  gap:46px!important;
}
.social-rating-howto-preview .social-rating-howto-image-wrap{
  flex:0 0 252px!important;
}
.social-rating-howto-preview .social-rating-howto-image{
  width:252px!important;
}
.social-rating-howto-preview .social-rating-howto-text{
  max-width:760px!important;
}
.social-rating-howto-preview .social-rating-howto-title{
  font-size:29px!important;
  margin-bottom:18px!important;
}
.social-rating-howto-preview p{
  margin-bottom:13px!important;
}
.social-rating-more[hidden]{display:none!important;}
.social-rating-more-btn{
  appearance:none!important;
  -webkit-appearance:none!important;
  border:0!important;
  background:transparent!important;
  padding:0!important;
  margin-top:2px!important;
  color:#0b63ce!important;
  font:inherit!important;
  font-size:15px!important;
  font-weight:700!important;
  cursor:pointer!important;
  text-align:left!important;
}
.social-rating-more-btn:hover{text-decoration:underline!important;}
@media(max-width:900px){
  .social-rating-howto.social-rating-howto-preview{
    width:100%!important;
    margin-top:62px!important;
    gap:24px!important;
    font-size:15px!important;
  }
  .social-rating-howto-preview .social-rating-howto-image-wrap{flex-basis:189px!important;}
  .social-rating-howto-preview .social-rating-howto-image{width:189px!important;}
  .social-rating-howto-preview .social-rating-howto-title{font-size:24px!important;}
}
@media(max-width:700px){
  body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-users-row{margin-top:28px!important;gap:18px 20px!important;}
  body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-card{width:94px!important;min-width:94px!important;}
  body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-avatar{width:63px!important;height:63px!important;font-size:29px!important;}
  body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-name{max-width:94px!important;font-size:13px!important;}
  body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-followers{max-width:94px!important;font-size:10px!important;}
  body.social-page #socialGrid.is-subscriptions-cards-view > .social-top-users-section.social-bottom-top-users .social-top-user-subscribe{min-height:31px!important;font-size:10px!important;}
  .social-rating-howto.social-rating-howto-preview{
    width:100%!important;
    margin-top:58px!important;
    align-items:center!important;
    text-align:left!important;
    font-size:14px!important;
  }
  .social-rating-howto-preview .social-rating-howto-image-wrap{justify-content:center!important;}
  .social-rating-howto-preview .social-rating-howto-image{width:171px!important;}
}
/* === end final layout === */

/* === PXPress final layer/modal/avatar fixes === */
body.social-page .social-top{
  z-index:2147483600 !important;
  position:sticky !important;
  isolation:isolate !important;
}
body.social-page #socialGrid.is-grid .social-card.menu-open,
body.social-page .social-card.menu-open{
  z-index:10 !important;
}
body.social-page #socialGrid.is-grid .social-menu-wrap,
body.social-page #socialGrid.is-grid .social-menu{
  z-index:11 !important;
}
body.social-page .social-detail,
body.social-page #socialDetail{
  z-index:2147483000 !important;
  padding-top:86px !important;
}
body.social-page .social-toast{z-index:2147483601 !important;}

body.social-page .social-detail-title,
body.social-page .detail-title-text{
  line-height:1.24 !important;
  min-height:0 !important;
  overflow:visible !important;
  white-space:normal !important;
  text-overflow:clip !important;
  word-break:normal !important;
  overflow-wrap:break-word !important;
  padding-bottom:3px !important;
}
body.social-page .social-detail-title{
  align-items:flex-start !important;
}

body.social-page .social-detail-panel-preview,
body.social-page .social-detail-left,
body.social-page .social-detail-bottom-actions,
body.social-page .social-detail-menu-wrap{
  overflow:visible !important;
}
body.social-page .social-detail-menu-wrap{
  position:relative !important;
  z-index:2147483300 !important;
}
body.social-page .social-detail-menu-wrap .social-detail-menu,
body.social-page #detailMenu{
  z-index:2147483301 !important;
  position:absolute !important;
  left:0 !important;
  right:auto !important;
  top:42px !important;
  bottom:auto !important;
  min-width:210px !important;
}

body.social-page .social-comments-wrap{
  overflow:hidden !important;
  max-height:calc(100vh - 430px) !important;
}
body.social-page .social-comments-preview,
body.social-page #detailComments{
  overflow-y:auto !important;
  overflow-x:hidden !important;
  max-height:100% !important;
  height:100% !important;
  scrollbar-width:thin !important;
  scrollbar-color:#aeb6c3 transparent !important;
}
body.social-page #detailComments::-webkit-scrollbar{
  width:8px !important;
  display:block !important;
}
body.social-page #detailComments::-webkit-scrollbar-thumb{
  background:#aeb6c3 !important;
  border-radius:999px !important;
}
body.social-page .social-reply-form input,
body.social-page #detailComments .social-reply-form input{
  padding-left:16px !important;
  text-indent:0 !important;
}

body.social-page .social-avatar,
body.social-page .social-detail-avatar,
body.social-page .social-comment-avatar,
body.social-page .social-user-avatar{
  background:#e5e7eb !important;
  object-fit:cover !important;
}


/* === Final modal cleanup: remove title ellipsis and keep chat inside modal === */
body.social-page .detail-title-more,
body.social-page #detailTitleMoreBtn,
body.social-page .detail-title-modal{
  display:none !important;
}
body.social-page .social-detail-title{
  padding-right:0 !important;
  overflow:visible !important;
  text-overflow:clip !important;
  white-space:normal !important;
  line-height:1.22 !important;
  word-break:normal !important;
  overflow-wrap:break-word !important;
}
body.social-page .social-detail-panel-preview{
  overflow:hidden !important;
  align-items:stretch !important;
}
body.social-page .social-detail-side-preview{
  min-height:0 !important;
  max-height:calc(100vh - 72px) !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
  gap:14px !important;
  padding-top:28px !important;
  padding-bottom:28px !important;
}
body.social-page .social-detail-side-preview .social-detail-section{
  min-height:0 !important;
  flex:0 0 auto !important;
}
body.social-page .social-detail-side-preview .social-detail-section:has(#detailComments){
  flex:1 1 auto !important;
  min-height:180px !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  padding-bottom:14px !important;
}
body.social-page .social-comments-wrap{
  position:relative !important;
  flex:1 1 auto !important;
  min-height:120px !important;
  max-height:100% !important;
  overflow:hidden !important;
  padding-bottom:18px !important;
  box-sizing:border-box !important;
}
body.social-page .social-comments-preview,
body.social-page #detailComments{
  height:100% !important;
  max-height:100% !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:12px !important;
  padding-bottom:18px !important;
  box-sizing:border-box !important;
  overscroll-behavior:contain !important;
}
body.social-page .social-comment-composer input,
body.social-page .social-reply-form input{
  padding-left:16px !important;
  padding-right:14px !important;
}
@media(max-width:900px){
  body.social-page .social-detail-panel-preview{overflow:auto !important;align-items:start !important;}
  body.social-page .social-detail-side-preview{max-height:none !important;overflow:visible !important;}
  body.social-page .social-detail-side-preview .social-detail-section:has(#detailComments){min-height:240px !important;}
}

/* === PXPress final chat overflow fix: messages never overlap, native scrollbar === */
body.social-page .social-detail-side-preview .social-detail-section:has(#detailComments){
  flex:1 1 auto !important;
  min-height:220px !important;
  max-height:100% !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  padding-bottom:20px !important;
  box-sizing:border-box !important;
}
body.social-page .social-detail-side-preview .social-comments-head,
body.social-page .social-detail-side-preview .social-comment-composer,
body.social-page .social-detail-side-preview .social-comment-send-row{
  flex:0 0 auto !important;
}
body.social-page .social-comments-wrap{
  flex:1 1 auto !important;
  min-height:150px !important;
  max-height:clamp(220px, 34vh, 420px) !important;
  height:auto !important;
  overflow:hidden !important;
  margin:0 19px 0 0 !important;
  padding:0 0 18px 0 !important;
  box-sizing:border-box !important;
  position:relative !important;
}
body.social-page #detailComments,
body.social-page .social-comments-preview{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:18px !important;
  width:100% !important;
  height:100% !important;
  max-height:100% !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding:12px 16px 24px 12px !important;
  margin:0 !important;
  box-sizing:border-box !important;
  scrollbar-width:thin !important;
  scrollbar-color:#aeb6c3 transparent !important;
  overscroll-behavior:contain !important;
}
body.social-page #detailComments::-webkit-scrollbar,
body.social-page .social-comments-preview::-webkit-scrollbar{
  width:8px !important;
  height:8px !important;
  display:block !important;
}
body.social-page #detailComments::-webkit-scrollbar-track,
body.social-page .social-comments-preview::-webkit-scrollbar-track{
  background:transparent !important;
}
body.social-page #detailComments::-webkit-scrollbar-thumb,
body.social-page .social-comments-preview::-webkit-scrollbar-thumb{
  background:#aeb6c3 !important;
  border-radius:999px !important;
}
body.social-page #detailComments .social-comment,
body.social-page #detailComments .social-comment-preview,
body.social-page #detailComments .social-comment-reply{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  flex:0 0 auto !important;
  display:grid !important;
  grid-template-columns:34px minmax(0,1fr) !important;
  column-gap:12px !important;
  row-gap:0 !important;
  width:100% !important;
  max-width:100% !important;
  min-height:auto !important;
  height:auto !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
  transform:none !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}
body.social-page #detailComments .social-comment.social-comment-reply,
body.social-page #detailComments .social-replies .social-comment.social-comment-reply{
  width:calc(100% - 34px) !important;
  max-width:calc(100% - 34px) !important;
  margin-left:34px !important;
}
body.social-page #detailComments .social-comment-content,
body.social-page #detailComments .social-comment-line,
body.social-page #detailComments .social-comment-actions,
body.social-page #detailComments .social-reply-holder,
body.social-page #detailComments .social-reply-form{
  min-width:0 !important;
  max-width:100% !important;
  height:auto !important;
  position:relative !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}
body.social-page #detailComments .social-comment-preview p,
body.social-page #detailComments .social-comment-reply p{
  display:block !important;
  margin:4px 0 8px !important;
  line-height:1.45 !important;
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
body.social-page .social-comments-scroll-dot{display:none !important;}
@media(max-width:900px){
  body.social-page .social-comments-wrap{
    max-height:42vh !important;
    min-height:220px !important;
    margin-right:0 !important;
  }
}

/* PXPress v23: modal title, right column spacing, real chat scroll, upward detail menu */
.social-detail-side-preview{
  display:flex !important;
  flex-direction:column !important;
  align-self:stretch !important;
  min-height:0 !important;
  max-height:calc(100vh - 56px) !important;
  overflow:hidden !important;
  padding-top:0 !important;
  padding-bottom:18px !important;
  box-sizing:border-box !important;
}
.social-detail-title,
#detailName{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  line-height:1.22 !important;
  max-height:1.22em !important;
  min-height:1.22em !important;
  margin:0 0 6px !important;
  padding-right:0 !important;
  box-sizing:border-box !important;
}
.detail-title-text{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  line-height:1.22 !important;
  max-height:1.22em !important;
}
.detail-title-more,
.detail-title-toggle,
.detail-title-modal{
  display:none !important;
}
.social-detail-author-row{
  margin:0 0 8px !important;
  flex:0 0 auto !important;
}
.social-detail-side-preview > .social-detail-section{
  flex:0 0 auto !important;
  margin:0 0 10px !important;
  min-height:0 !important;
}
.social-detail-side-preview > .social-detail-section:first-of-type{
  margin-bottom:10px !important;
}
.social-detail-section h3{
  margin-bottom:6px !important;
}
.social-prompt.social-prompt-preview,
#detailSystemPrompt{
  max-height:82px !important;
  min-height:42px !important;
  padding:10px 12px !important;
  line-height:1.35 !important;
}
.social-detail-side-preview > .social-detail-section:nth-of-type(2){
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
  min-height:0 !important;
  margin-bottom:0 !important;
  overflow:hidden !important;
}
.social-comments-head{
  flex:0 0 auto !important;
  margin:0 0 8px !important;
}
.social-comment-composer{
  flex:0 0 auto !important;
  margin-bottom:8px !important;
}
.social-comment-send-row{
  flex:0 0 auto !important;
  margin:0 0 10px !important;
}
.social-comments-wrap{
  flex:1 1 auto !important;
  min-height:130px !important;
  max-height:none !important;
  overflow:hidden !important;
  padding:0 12px 16px 0 !important;
  margin:0 !important;
  box-sizing:border-box !important;
}
.social-comments-preview{
  display:flex !important;
  flex-direction:column !important;
  gap:14px !important;
  height:100% !important;
  max-height:100% !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding:0 8px 16px 0 !important;
  scrollbar-width:thin !important;
  scrollbar-color:#c4c9d1 transparent !important;
}
.social-comments-preview::-webkit-scrollbar{
  width:8px !important;
  height:8px !important;
  display:block !important;
}
.social-comments-preview::-webkit-scrollbar-thumb{
  background:#c4c9d1 !important;
  border-radius:999px !important;
}
.social-comments-preview::-webkit-scrollbar-track{
  background:transparent !important;
}
.social-comment-preview,
.social-comment-reply{
  flex:0 0 auto !important;
  align-items:flex-start !important;
  overflow:visible !important;
}
.social-comments-scroll-dot{
  display:none !important;
}
.social-detail-menu-wrap{
  position:relative !important;
  z-index:50 !important;
}
.social-detail-menu-wrap .social-detail-menu,
.social-detail-menu-wrap .social-menu{
  position:absolute !important;
  left:50% !important;
  right:auto !important;
  top:auto !important;
  bottom:calc(100% + 10px) !important;
  transform:translateX(-50%) !important;
  min-width:220px !important;
  z-index:12000 !important;
}
.social-detail-menu-wrap.open .social-detail-menu,
.social-detail-menu-wrap.open .social-menu{
  display:grid !important;
}
@media(max-width:900px){
  .social-detail-side-preview{max-height:none !important;overflow:visible !important;padding-bottom:14px !important;}
  .social-detail-side-preview > .social-detail-section:nth-of-type(2){max-height:52vh !important;}
  .social-detail-menu-wrap .social-detail-menu,
  .social-detail-menu-wrap .social-menu{left:auto !important;right:0 !important;transform:none !important;bottom:calc(100% + 8px) !important;top:auto !important;}
}

/* === PXPress: fixed grey backing plate under modal generated image === */
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image{
  background:#d9d9d9 !important;
  border-radius:0 !important;
  overflow:hidden !important;
  box-shadow:none !important;
}
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image img,
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image video{
  background:transparent !important;
  border-radius:0 !important;
  object-fit:contain !important;
}
body.social-page.social-dark .social-detail-panel-preview .social-detail-left .social-detail-image{
  background:#d9d9d9 !important;
}


/* align gray plate to info block */
.modal-image-footer,
.image-meta-bar,
.logo-image-footer{
  width: calc(100% - 110px) !important;
  max-width: calc(100% - 110px) !important;
  margin-right:auto !important;
}

/* === PXPress fix: trim grey image plate from LEFT to align with lower text info block === */
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image{
  width:calc(100% - 32px) !important;
  max-width:calc(100% - 32px) !important;
  margin-left:32px !important;
  margin-right:0 !important;
  align-self:flex-end !important;
}
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-tech-info,
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-under-meta,
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-bottom-actions{
  width:calc(100% - 32px) !important;
  max-width:calc(100% - 32px) !important;
  margin-left:32px !important;
  margin-right:0 !important;
  align-self:flex-end !important;
}
@media(max-width:900px){
  body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image,
  body.social-page .social-detail-panel-preview .social-detail-left .social-detail-tech-info,
  body.social-page .social-detail-panel-preview .social-detail-left .social-detail-under-meta,
  body.social-page .social-detail-panel-preview .social-detail-left .social-detail-bottom-actions{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    align-self:stretch !important;
  }
}


/* === PXPress final fix: no grey brackets in chat replies + centered media in square grey plate === */
body.social-page #detailComments .social-comment,
body.social-page #detailComments .social-comment-preview,
body.social-page #detailComments .social-comment-reply,
body.social-page #detailComments .social-replies,
body.social-page #detailComments .social-reply-holder{
  border-left:0 !important;
  border-right:0 !important;
  box-shadow:none !important;
  background-image:none !important;
}
body.social-page #detailComments .social-comment::before,
body.social-page #detailComments .social-comment::after,
body.social-page #detailComments .social-comment-preview::before,
body.social-page #detailComments .social-comment-preview::after,
body.social-page #detailComments .social-comment-reply::before,
body.social-page #detailComments .social-comment-reply::after,
body.social-page #detailComments .social-replies::before,
body.social-page #detailComments .social-replies::after,
body.social-page #detailComments .social-reply-holder::before,
body.social-page #detailComments .social-reply-holder::after{
  content:none !important;
  display:none !important;
  width:0 !important;
  height:0 !important;
  border:0 !important;
  background:none !important;
}
body.social-page #detailComments .social-comment.social-comment-reply,
body.social-page #detailComments .social-replies .social-comment.social-comment-reply,
body.social-page #detailComments .social-replies .social-replies .social-comment.social-comment-reply{
  margin-left:0 !important;
  padding-left:0 !important;
  width:100% !important;
  max-width:100% !important;
}
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#d9d9d9 !important;
  border-radius:0 !important;
  overflow:hidden !important;
  padding:0 !important;
  box-shadow:none !important;
}
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image img,
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image canvas{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  margin:auto !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  filter:none !important;
}


/* === PXPress correction: keep reply indentation, remove grey branch marks, and do not show hidden video over image posts === */
body.social-page #detailComments .social-comment.social-comment-reply,
body.social-page #detailComments .social-replies .social-comment.social-comment-reply,
body.social-page #detailComments .social-replies .social-replies .social-comment.social-comment-reply{
  margin-left:34px !important;
  width:calc(100% - 34px) !important;
  max-width:calc(100% - 34px) !important;
  padding-left:0 !important;
  box-sizing:border-box !important;
}
body.social-page #detailComments .social-comment.social-comment-reply::before,
body.social-page #detailComments .social-replies::before,
body.social-page #detailComments .social-reply-holder::before,
body.social-page #detailComments .social-comment.social-comment-reply::after,
body.social-page #detailComments .social-replies::after,
body.social-page #detailComments .social-reply-holder::after{
  content:none !important;
  display:none !important;
  border:0 !important;
  background:none !important;
  box-shadow:none !important;
}
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#d9d9d9 !important;
  border-radius:0 !important;
  overflow:hidden !important;
}
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image img{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  margin:auto !important;
  border-radius:0 !important;
}
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image video#detailVideo:not([src]),
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image video#detailVideo[style*="display:none"],
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image video#detailVideo[style*="display: none"]{
  display:none !important;
}
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image video#detailVideo[src]{
  width:auto;
  height:auto;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  margin:auto !important;
  border-radius:0 !important;
  background:#d9d9d9 !important;
}

/* === PXPress final visual polish: modal radius, reply form, image centering, chat border === */
body.social-page .social-detail-panel-preview,
body.social-page .social-detail-panel{
  border-radius:14px !important;
}
body.social-page .social-detail-close,
body.social-page .social-close{
  border-radius:8px !important;
}

/* Reply composer in chat: transparent panel with thin grey outline; blue Reply button */
body.social-page #detailComments .social-reply-form,
body.social-page .social-reply-form{
  background:transparent !important;
  border:1px solid #d1d5db !important;
  border-radius:12px !important;
  padding:10px 12px !important;
  box-shadow:none !important;
  display:flex !important;
  gap:10px !important;
  align-items:center !important;
  width:100% !important;
  box-sizing:border-box !important;
}
body.social-page #detailComments .social-reply-form input,
body.social-page #detailComments .social-reply-form textarea,
body.social-page .social-reply-form input,
body.social-page .social-reply-form textarea{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  outline:none !important;
  padding-left:8px !important;
}
body.social-page #detailComments .social-reply-form button,
body.social-page .social-reply-form button{
  border:0 !important;
  border-radius:999px !important;
  background:#eaf2ff !important;
  color:#1558c7 !important;
  font-weight:700 !important;
  padding:10px 18px !important;
  min-height:38px !important;
  cursor:pointer !important;
  box-shadow:none !important;
}
body.social-page #detailComments .social-reply-form button:hover,
body.social-page .social-reply-form button:hover{
  background:#dbeafe !important;
  color:#0b66d8 !important;
}

/* Generated media in modal: straight corners and exact centering inside grey plate */
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#d9d9d9 !important;
  border-radius:0 !important;
  overflow:hidden !important;
  padding:0 !important;
  position:relative !important;
}
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image img,
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image video,
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image canvas{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  object-position:center center !important;
  margin:auto !important;
  border-radius:0 !important;
  overflow:hidden !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image *{
  border-radius:0 !important;
}

/* Thin grey outline around chat area; internal scroll remains inside modal */
body.social-page .social-comments-wrap{
  border:1px solid #d1d5db !important;
  border-radius:14px !important;
  padding:12px 14px !important;
  background:#fff !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}
body.social-page .social-comments-preview,
body.social-page #detailComments{
  border:0 !important;
  background:transparent !important;
  max-height:300px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:10px !important;
  box-sizing:border-box !important;
}
body.social-page .social-comments-preview::-webkit-scrollbar,
body.social-page #detailComments::-webkit-scrollbar{
  width:8px !important;
  display:block !important;
}
body.social-page .social-comments-preview::-webkit-scrollbar-thumb,
body.social-page #detailComments::-webkit-scrollbar-thumb{
  background:#c4c9d1 !important;
  border-radius:999px !important;
}
body.social-page .social-comments-preview::-webkit-scrollbar-track,
body.social-page #detailComments::-webkit-scrollbar-track{
  background:transparent !important;
}

/* === social120 real targeted fixes: reply, chat border, media corners === */
body.social-page #detailComments .social-reply-form,
body.social-page .social-comments-preview .social-reply-form,
body.social-page .social-reply-form{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  background:transparent !important;
  border:0 !important;
  border-radius:999px !important;
  padding:6px 0 !important;
  margin-top:10px !important;
}
body.social-page #detailComments .social-reply-form input,
body.social-page .social-comments-preview .social-reply-form input,
body.social-page .social-reply-form input,
body.social-page input[placeholder="Написать ответ"]{
  border:1px solid #d1d5db !important;
  border-radius:999px !important;
  background:#fff !important;
  min-height:38px !important;
  padding:0 16px !important;
  outline:none !important;
  box-shadow:none !important;
}
body.social-page #detailComments .social-reply-form button,
body.social-page .social-comments-preview .social-reply-form button,
body.social-page .social-reply-form button,
body.social-page [data-reply-send]{
  font-weight:400 !important;
  background:#eaf2ff !important;
  color:#1558c7 !important;
  border:0 !important;
  border-radius:999px !important;
  min-height:38px !important;
  padding:0 16px !important;
  box-shadow:none !important;
}
body.social-page .social-comments-wrap{
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
  padding:0 !important;
  overflow:visible !important;
}
body.social-page .social-detail-panel-preview .social-detail-image,
body.social-page .social-detail-panel-preview .social-detail-image *,
body.social-page .social-detail-panel-preview .social-detail-image img,
body.social-page .social-detail-panel-preview .social-detail-image video,
body.social-page .social-detail-panel-preview #detailImage,
body.social-page .social-detail-panel-preview #detailVideo{
  border-radius:0 !important;
  clip-path:none !important;
  overflow:visible !important;
}
body.social-page .social-detail-panel-preview .social-detail-image{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
body.social-page .social-detail-panel-preview .social-detail-image img,
body.social-page .social-detail-panel-preview .social-detail-image video,
body.social-page .social-detail-panel-preview #detailImage,
body.social-page .social-detail-panel-preview #detailVideo{
  object-fit:contain !important;
  object-position:center center !important;
  margin:auto !important;
  align-self:center !important;
  justify-self:center !important;
}

/* === social121 menu shadows, upward post menu, prompt scrollbar === */
body.social-page .social-sort-menu{
  box-shadow:0 14px 34px rgba(15,23,42,.16) !important;
  border:1px solid rgba(229,231,235,.95) !important;
}

body.social-page .social-grid-footer .social-menu,
body.social-page .social-card-actions .social-menu,
body.social-page .social-grid-actions .social-menu{
  top:auto !important;
  bottom:40px !important;
  box-shadow:0 8px 22px rgba(15,23,42,.12) !important;
  border:1px solid rgba(229,231,235,.95) !important;
}

body.social-page .social-prompt,
body.social-page .social-prompt-preview,
body.social-page #detailSystemPrompt{
  scrollbar-width:thin !important;
  scrollbar-color:#c4c9d1 transparent !important;
}
body.social-page .social-prompt::-webkit-scrollbar,
body.social-page .social-prompt-preview::-webkit-scrollbar,
body.social-page #detailSystemPrompt::-webkit-scrollbar{
  width:8px !important;
  display:block !important;
}
body.social-page .social-prompt::-webkit-scrollbar-thumb,
body.social-page .social-prompt-preview::-webkit-scrollbar-thumb,
body.social-page #detailSystemPrompt::-webkit-scrollbar-thumb{
  background:#c4c9d1 !important;
  border-radius:999px !important;
}
body.social-page .social-prompt::-webkit-scrollbar-track,
body.social-page .social-prompt-preview::-webkit-scrollbar-track,
body.social-page #detailSystemPrompt::-webkit-scrollbar-track{
  background:transparent !important;
}


/* === PXPress fix: sort dropdown shadow, detail menu opens upward, prompt scrollbar like chat === */
body.social-page .social-sort-menu{
  box-shadow:0 14px 34px rgba(15,23,42,.16),0 4px 10px rgba(15,23,42,.08) !important;
  border:1px solid rgba(15,23,42,.08) !important;
  background:#fff !important;
  z-index:2147482000 !important;
}

body.social-page .social-detail-bottom-actions,
body.social-page #detailMenuWrap,
body.social-page .social-detail-menu-wrap{
  overflow:visible !important;
}
body.social-page #detailMenuWrap{
  position:relative !important;
  z-index:2147483000 !important;
}
body.social-page #detailMenu,
body.social-page #detailMenuWrap .social-menu,
body.social-page #detailMenuWrap .social-detail-menu{
  position:absolute !important;
  top:auto !important;
  bottom:calc(100% + 10px) !important;
  left:50% !important;
  right:auto !important;
  transform:translateX(-50%) !important;
  display:none;
  min-width:220px !important;
  z-index:2147483001 !important;
  box-shadow:0 10px 22px rgba(15,23,42,.12),0 2px 7px rgba(15,23,42,.07) !important;
}
body.social-page #detailMenuWrap.open #detailMenu,
body.social-page #detailMenuWrap.open .social-menu,
body.social-page #detailMenuWrap.open .social-detail-menu{
  display:grid !important;
}

body.social-page #detailSystemPrompt,
body.social-page .social-prompt.social-prompt-preview{
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:thin !important;
  scrollbar-color:#c4c9d1 transparent !important;
}
body.social-page #detailSystemPrompt::-webkit-scrollbar,
body.social-page .social-prompt.social-prompt-preview::-webkit-scrollbar{
  width:8px !important;
  height:8px !important;
  display:block !important;
}
body.social-page #detailSystemPrompt::-webkit-scrollbar-thumb,
body.social-page .social-prompt.social-prompt-preview::-webkit-scrollbar-thumb{
  background:#c4c9d1 !important;
  border-radius:999px !important;
}
body.social-page #detailSystemPrompt::-webkit-scrollbar-track,
body.social-page .social-prompt.social-prompt-preview::-webkit-scrollbar-track{
  background:transparent !important;
}


/* === social125: real modal media corner fix ===
   The visible rounded corners were caused by the modal media frame / late media rules,
   not only by the <img>. Keep the grey backing plate, but stop every media wrapper
   from clipping or rounding the actual image/video. */
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image,
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-media-frame,
body.social-page .social-detail-panel-preview [data-detail-media-frame]{
  background:#d9d9d9 !important;
  border-radius:0 !important;
  overflow:visible !important;
  clip-path:none !important;
}
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-image *,
body.social-page .social-detail-panel-preview .social-detail-left .social-detail-media-frame *,
body.social-page .social-detail-panel-preview [data-detail-media-frame] *,
body.social-page .social-detail-panel-preview #detailImg,
body.social-page .social-detail-panel-preview #detailVideo,
body.social-page .social-detail-panel-preview .social-detail-image img,
body.social-page .social-detail-panel-preview .social-detail-image video{
  border-radius:0 !important;
  overflow:visible !important;
  clip-path:none !important;
}
body.social-page .social-detail-panel-preview #detailImg,
body.social-page .social-detail-panel-preview #detailVideo,
body.social-page .social-detail-panel-preview .social-detail-image img,
body.social-page .social-detail-panel-preview .social-detail-image video{
  display:block !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:transparent !important;
}
body.social-page .social-detail-image video#detailVideo{
  border-radius:0 !important;
}
body.social-page.social-dark .social-detail-panel-preview .social-detail-left .social-detail-image,
body.social-page.social-dark .social-detail-panel-preview .social-detail-left .social-detail-media-frame,
body.social-page.social-dark .social-detail-panel-preview [data-detail-media-frame]{
  background:#d9d9d9 !important;
}

/* === social126: opaque post menu + smart upward opening near viewport bottom === */
body.social-page .social-card,
body.social-page .social-grid-card,
body.social-page .social-grid-footer,
body.social-page .social-grid-actions,
body.social-page .social-card-actions,
body.social-page .social-menu-wrap{
  overflow:visible !important;
}

body.social-page .social-card.menu-open,
body.social-page #socialGrid.is-grid .social-card.menu-open,
body.social-page .social-generation-row.menu-open{
  position:relative !important;
  z-index:2147482000 !important;
  overflow:visible !important;
}

body.social-page .social-menu-wrap.open{
  position:relative !important;
  z-index:2147482001 !important;
  isolation:isolate !important;
}

body.social-page .social-menu-wrap.open > .social-menu{
  display:grid !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  background:#ffffff !important;
  background-color:#ffffff !important;
  color:#111827 !important;
  border:1px solid rgba(229,231,235,.98) !important;
  box-shadow:0 18px 42px rgba(15,23,42,.20),0 4px 12px rgba(15,23,42,.10) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  z-index:2147482002 !important;
}

body.social-page.social-dark .social-menu-wrap.open > .social-menu{
  background:#111827 !important;
  background-color:#111827 !important;
  color:#e5e7eb !important;
  border-color:#303744 !important;
  box-shadow:0 18px 42px rgba(0,0,0,.42),0 4px 12px rgba(0,0,0,.28) !important;
}

body.social-page.social-dark .social-menu-wrap.open > .social-menu button,
body.social-page.social-dark .social-menu-wrap.open > .social-menu .social-menu-item{
  color:#e5e7eb !important;
  background:transparent !important;
}

body.social-page.social-dark .social-menu-wrap.open > .social-menu button:hover,
body.social-page.social-dark .social-menu-wrap.open > .social-menu .social-menu-item:hover{
  background:#1f2937 !important;
}


/* === social126: share publication modal with image preview === */
.social-share-modal{
  position:fixed;
  inset:0;
  z-index:99999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
}
.social-share-modal.open{display:flex;}
.social-share-backdrop{position:absolute;inset:0;background:rgba(15,18,26,.34);backdrop-filter:blur(8px);}
.social-share-card{
  position:relative;
  width:min(520px,calc(100vw - 28px));
  max-height:calc(100vh - 28px);
  overflow:auto;
  background:#fff !important;
  color:#151923;
  border:1px solid rgba(130,86,255,.28);
  border-radius:14px;
  box-shadow:0 18px 60px rgba(23,15,50,.28),0 0 0 1px rgba(255,255,255,.7) inset;
  padding:16px;
}
.social-share-card h3{margin:0 36px 14px 0;font-size:17px;font-weight:800;line-height:1.25;color:#151923;}
.social-share-close{position:absolute;right:12px;top:10px;width:28px;height:28px;border:0;background:transparent;color:#6b7280;font-size:24px;line-height:1;cursor:pointer;border-radius:8px;}
.social-share-close:hover{background:#f1f3f8;color:#111827;}
.social-share-preview{display:grid;grid-template-columns:112px 1fr;gap:13px;align-items:center;border:1px solid #e3e6ef;border-radius:10px;padding:10px;background:#fff;}
.social-share-thumb{width:112px;height:112px;border-radius:8px;overflow:hidden;background:#f5f6fa;display:flex;align-items:center;justify-content:center;}
.social-share-thumb img{width:100%;height:100%;object-fit:cover;display:block;border-radius:0 !important;}
.social-share-info{min-width:0;display:flex;flex-direction:column;gap:5px;}
.social-share-info b{font-size:14px;line-height:1.25;color:#171923;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.social-share-info span{font-size:13px;color:#6b7280;}
.social-share-info p{margin:0;font-size:13px;line-height:1.35;color:#374151;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.social-share-label{margin:13px 0 8px;color:#6b7280;font-size:13px;font-weight:700;}
.social-share-services{display:flex;gap:14px;align-items:stretch;justify-content:flex-start;flex-wrap:wrap;}
.social-share-service{width:82px;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;gap:6px;color:#1f2937;cursor:pointer;padding:4px 2px;border-radius:10px;}
.social-share-service:hover{background:#f5f3ff;}
.social-share-service span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:14px;box-shadow:0 5px 15px rgba(0,0,0,.12);}
.social-share-service.vk span{background:#2787f5;}
.social-share-service.tg span{background:#28a8e9;}
.social-share-service.ok span{background:#ee8208;}
.social-share-service small{font-size:11px;color:#374151;white-space:nowrap;}
.social-share-copy-row{display:grid;grid-template-columns:1fr auto;gap:8px;}
.social-share-copy-row input{height:38px;border:1px solid #e1e5ee;border-radius:8px;padding:0 11px;font-size:13px;color:#374151;background:#fff;min-width:0;}
.social-share-copy-row button,.social-share-native{height:38px;border:0;border-radius:8px;background:linear-gradient(135deg,#8b5cf6,#a855f7);color:#fff;font-weight:800;padding:0 14px;cursor:pointer;}
.social-share-native{width:100%;margin-top:10px;background:#f4efff;color:#7c3aed;border:1px solid rgba(124,58,237,.18);}
.social-share-cancel{width:100%;height:34px;margin-top:10px;border:1px solid #e5e7eb;border-radius:8px;background:#f8fafc;color:#374151;cursor:pointer;}
@media(max-width:520px){.social-share-card{padding:13px}.social-share-preview{grid-template-columns:84px 1fr}.social-share-thumb{width:84px;height:84px}.social-share-services{gap:6px}.social-share-service{width:76px}.social-share-copy-row{grid-template-columns:1fr}.social-share-copy-row button{width:100%;}}

/* social126-share-real-platform-fix */
.social-share-note{
  margin:8px 0 10px;
  font-size:12px;
  line-height:1.35;
  color:#64748b;
}
.social-share-native.secondary{
  margin-top:8px;
  background:#f8fafc !important;
  color:#334155 !important;
  border:1px solid #e2e8f0 !important;
  box-shadow:none !important;
}


/* social127 custom share icons */
.social-share-service span{
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}
.social-share-service span img{
  width:40px !important;
  height:40px !important;
  display:block !important;
  object-fit:contain !important;
}
.social-share-service.vk span,
.social-share-service.tg span,
.social-share-service.ok span{
  background:transparent !important;
}

/* === PXPress FIX: "Мои публикации" must use the exact same card scale as "Все логотипы" ===
   The section is only a data filter; card layout, masonry width, gaps and footer size stay identical. */
body.social-page[data-social-mode="my_publications"] #socialGrid.is-grid,
body.social-page.social-my-gallery-active[data-social-mode="my_publications"] #socialGrid.is-grid{
  display:block !important;
  columns:var(--my-logo-card-column-width) !important;
  column-width:var(--my-logo-card-column-width) !important;
  column-gap:var(--my-logo-card-column-gap) !important;
  width:100% !important;
  max-width:none !important;
}
body.social-page[data-social-mode="my_publications"] #socialGrid.is-grid > .social-card,
body.social-page[data-social-mode="my_publications"] #socialGrid.is-grid > .social-grid-card{
  display:inline-block !important;
  width:100% !important;
  max-width:none !important;
  margin:0 0 var(--my-logo-card-row-gap) 0 !important;
  break-inside:avoid !important;
  page-break-inside:avoid !important;
  vertical-align:top !important;
}
body.social-page[data-social-mode="my_publications"] #socialGrid.is-grid .social-card-actions,
body.social-page[data-social-mode="my_publications"] #socialGrid.is-grid .social-grid-actions,
body.social-page[data-social-mode="my_publications"] #socialGrid.is-grid .social-grid-footer{
  height:var(--my-logo-card-footer-height) !important;
  min-height:var(--my-logo-card-footer-height) !important;
}

/* === social128: share/detail modal overlay and share panel cleanup === */
body.social-page .social-detail,
body.social-page .social-detail.open{
  background:rgba(15,23,42,.42) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
body.social-page .social-share-modal{
  z-index:2147483647 !important;
}
body.social-page .social-share-backdrop{
  background:rgba(15,23,42,.42) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
body.social-page .social-share-close{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:0 !important;
}
body.social-page .social-share-close img{
  width:18px !important;
  height:18px !important;
  display:block !important;
  object-fit:contain !important;
  pointer-events:none !important;
}
body.social-page .social-share-copy-row button[data-share-copy]{
  background:#eaf6ff !important;
  color:#1d4ed8 !important;
  border:1px solid #2563eb !important;
  box-shadow:none !important;
  font-weight:400 !important;
}
body.social-page .social-share-copy-row button[data-share-copy]:hover{
  background:#dff0ff !important;
}

/* === social129: share modal close equals chat close + icon hover only jump === */
body.social-page .social-share-close,
body.social-page button.social-share-close{
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  min-height:38px !important;
  right:14px !important;
  top:12px !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background-color:transparent !important;
  background-image:url("../icons/ui/cross26.SVG") !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:100% 100% !important;
  box-shadow:none !important;
  font-size:0 !important;
  line-height:0 !important;
  color:transparent !important;
  text-indent:-9999px !important;
  overflow:visible !important;
  cursor:pointer !important;
  filter:none !important;
}
body.social-page .social-share-close:hover,
body.social-page button.social-share-close:hover{
  background-color:transparent !important;
  background-image:url("../icons/ui/cross26.SVG") !important;
  filter:brightness(.91) !important;
  transform:none !important;
}
body.social-page .social-share-close img{
  display:none !important;
}
body.social-page .social-share-service,
body.social-page .social-share-service:hover,
body.social-page .social-share-service:focus,
body.social-page .social-share-service:active{
  background:transparent !important;
  box-shadow:none !important;
  outline:none !important;
}
body.social-page .social-share-service{
  transition:transform .16s ease, opacity .16s ease !important;
}
body.social-page .social-share-service:hover{
  transform:translateY(-3px) !important;
}
body.social-page .social-share-service:hover span{
  box-shadow:0 5px 15px rgba(0,0,0,.12) !important;
}

/* === social-auth-constructor-parity-v1 ===
   Социальная сеть использует такую же панель входа/регистрации,
   как конструктор визиток: шапка, аватар, поля, глаз пароля,
   чекбокс запоминания и серверный auth.php. */
body.social-page .social-auth-modal{
  display:none!important;
  position:fixed!important;
  inset:0!important;
  z-index:12000!important;
  align-items:center!important;
  justify-content:center!important;
  padding:20px!important;
  background:rgba(17,24,39,.48)!important;
}
body.social-page .social-auth-modal.open{display:flex!important;}
body.social-page .social-auth-panel.modal-card{
  width:min(420px, calc(100vw - 32px))!important;
  max-height:calc(100vh - 32px)!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid #e5e7eb!important;
  border-radius:22px!important;
  box-shadow:0 26px 80px rgba(0,0,0,.28)!important;
  padding:0!important;
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
}
body.social-page .social-auth-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  padding:16px 18px!important;
  border-bottom:1px solid #e5e7eb!important;
  margin:0!important;
  flex:0 0 auto!important;
}
body.social-page .social-auth-head h2{
  margin:0!important;
  text-align:left!important;
  font-size:24px!important;
  line-height:1.2!important;
  font-weight:700!important;
  color:#111827!important;
}
body.social-page .social-auth-panel .auth-form,
body.social-page .social-auth-form{
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
  padding:18px 5mm 20px!important;
  overflow:auto!important;
  box-sizing:border-box!important;
}
body.social-page .auth-avatar-wrap{
  width:86px!important;
  height:86px!important;
  margin:0 auto 8px!important;
  position:relative!important;
  display:block!important;
}
body.social-page .auth-avatar-preview{
  width:86px!important;
  height:86px!important;
  border-radius:50%!important;
  object-fit:cover!important;
  display:block!important;
  background:#eef2f7!important;
  border:1px solid #e5e7eb!important;
}
body.social-page .auth-avatar-camera{
  position:absolute!important;
  right:-2px!important;
  bottom:-2px!important;
  width:32px!important;
  height:32px!important;
  border-radius:50%!important;
  background:#fff!important;
  border:1px solid #d1d5db!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer!important;
  box-shadow:0 8px 20px rgba(15,23,42,.16)!important;
  overflow:hidden!important;
}
body.social-page .auth-avatar-camera input{display:none!important;}
body.social-page .auth-camera-icon{width:18px!important;height:18px!important;display:block!important;}
body.social-page .social-auth-form input:not([type="checkbox"]){
  width:calc(100% - 10mm)!important;
  margin-left:5mm!important;
  margin-right:5mm!important;
  box-sizing:border-box!important;
  border:1px solid #d1d5db!important;
  border-radius:13px!important;
  min-height:42px!important;
  padding:0 13px!important;
  outline:none!important;
  background:#fff!important;
  color:#111827!important;
  font-size:14px!important;
}
body.social-page .social-auth-form input:not([type="checkbox"]):focus{
  border-color:#93c5fd!important;
  box-shadow:0 0 0 3px rgba(26,115,232,.14)!important;
}
body.social-page .social-auth-password-wrap{
  position:relative!important;
  width:calc(100% - 10mm)!important;
  margin-left:5mm!important;
  margin-right:5mm!important;
  box-sizing:border-box!important;
}
body.social-page .social-auth-password-wrap input{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding-left:13px!important;
  padding-right:48px!important;
}
body.social-page .auth-password-eye{
  position:absolute!important;
  right:7px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  min-height:34px!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  box-shadow:none!important;
  cursor:pointer!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
}
body.social-page .auth-password-eye:hover{background:#f3f4f6!important;}
body.social-page .auth-password-eye img{width:20px!important;height:20px!important;display:block!important;pointer-events:none!important;}
body.social-page .remember-row{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin:0 5mm!important;
  font-size:13px!important;
  color:#4b5563!important;
  line-height:1.35!important;
}
body.social-page .remember-row input{width:auto!important;margin:0!important;}
body.social-page .social-auth-submit,
body.social-page .social-auth-form .insert-qr-btn{
  width:calc(100% - 10mm)!important;
  margin-left:5mm!important;
  margin-right:5mm!important;
  min-height:42px!important;
  border-radius:13px!important;
  border:0!important;
  background:#111827!important;
  color:#fff!important;
  font-weight:800!important;
  font-size:14px!important;
  cursor:pointer!important;
  box-sizing:border-box!important;
}
body.social-page .social-vk-auth-btn{background:#0077ff!important;}
body.social-page .social-auth-error,
body.social-page .auth-note{
  min-height:18px!important;
  margin:0 5mm!important;
  color:#6b7280!important;
  font-size:13px!important;
  line-height:1.35!important;
  text-align:left!important;
}
body.social-page .social-auth-error.is-error{color:#dc2626!important;text-align:center!important;}
body.social-page .social-auth-error.is-success{color:#047857!important;text-align:center!important;}
body.social-page .social-auth-close{
  flex:0 0 auto!important;
  width:38px!important;
  height:38px!important;
  border-radius:10px!important;
  background:#f9fafb url("../icons/ui/cross26.SVG") center/100% 100% no-repeat!important;
  border:1px solid #d1d5db!important;
  box-shadow:none!important;
  font-size:0!important;
  line-height:0!important;
  color:transparent!important;
  cursor:pointer!important;
}
body.social-page .social-auth-close:hover{background:#f9fafb url("../icons/ui/cross26.SVG") center/100% 100% no-repeat!important;}
body.social-page.social-dark .social-auth-panel.modal-card{background:#111827!important;border-color:#334155!important;}
body.social-page.social-dark .social-auth-head{border-color:#334155!important;}
body.social-page.social-dark .social-auth-head h2{color:#f8fafc!important;}
body.social-page.social-dark .social-auth-form input:not([type="checkbox"]){background:#0f172a!important;color:#f8fafc!important;border-color:#334155!important;}
body.social-page.social-dark .remember-row,body.social-page.social-dark .auth-note{color:#cbd5e1!important;}

/* === social133: exact constructor auth component metrics ===
   Social auth keeps its own IDs for JS, but uses the same layout metrics as
   the business-card constructor auth modal: panel, inputs, password wrapper,
   submit button, remember row, avatar and close button. */
body.social-page .social-auth-modal.auth-modal{
  display:none!important;
  position:fixed!important;
  inset:0!important;
  z-index:5000!important;
  align-items:center!important;
  justify-content:center!important;
  padding:18px!important;
  background:rgba(17,24,39,.48)!important;
}
body.social-page .social-auth-modal.auth-modal.open{display:flex!important;}
body.social-page .social-auth-panel.modal-card{
  width:380px!important;
  max-width:calc(100vw - 22px)!important;
  padding:10px 8px 20px!important;
  border-radius:18px!important;
  box-shadow:0 18px 50px rgba(0,0,0,.18)!important;
  background:#fff!important;
  box-sizing:border-box!important;
}
body.social-page .social-auth-head.modal-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  padding:0 4px 4px 12px!important;
  margin:0!important;
  border:0!important;
}
body.social-page .social-auth-head.modal-head h2{
  margin:0!important;
  font-size:19px!important;
  line-height:1.2!important;
  font-weight:700!important;
  color:#2b2b2b!important;
  text-align:left!important;
}
body.social-page .social-auth-close.toolbtn{
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  min-height:40px!important;
  border:1px solid #dfe3e8!important;
  border-radius:10px!important;
  background:#f8f9fb url("../icons/ui/cross26.SVG") center/100% 100% no-repeat!important;
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  font-weight:300!important;
  box-shadow:none!important;
  cursor:pointer!important;
  overflow:hidden!important;
}
body.social-page .social-auth-close.toolbtn:hover{
  background:#f8f9fb url("../icons/ui/cross26.SVG") center/100% 100% no-repeat!important;
  filter:none!important;
}
body.social-page .social-auth-form.auth-form{
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
  padding:0!important;
  margin:0!important;
  box-sizing:border-box!important;
}
body.social-page .social-auth-form .auth-avatar-wrap{
  width:110px!important;
  height:120px!important;
  position:relative!important;
  margin:0 auto 4px!important;
}
body.social-page .social-auth-form .auth-avatar-preview{
  display:block!important;
  width:100px!important;
  height:100px!important;
  margin:0 auto!important;
  border-radius:50%!important;
  object-fit:cover!important;
  background:#e5e5e5!important;
}
body.social-page .social-auth-form .auth-avatar-camera{
  position:absolute!important;
  right:8px!important;
  bottom:18px!important;
  width:34px!important;
  height:34px!important;
  border-radius:50%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:#4aa3ff!important;
  color:#fff!important;
  border:3px solid #fff!important;
  box-shadow:0 1px 4px rgba(0,0,0,.14)!important;
  cursor:pointer!important;
  font-size:16px!important;
  box-sizing:border-box!important;
}
body.social-page .social-auth-form .auth-camera-icon{width:18px!important;height:18px!important;display:block!important;object-fit:contain!important;}
body.social-page .social-auth-form input:not([type="checkbox"]):not([type="file"]){
  width:100%!important;
  height:34px!important;
  min-height:34px!important;
  padding:6px 8px!important;
  box-sizing:border-box!important;
  border:1px solid #dfe1e5!important;
  border-radius:7px!important;
  background:#fff!important;
  color:#202124!important;
  font-size:14px!important;
  line-height:20px!important;
  outline:none!important;
  box-shadow:none!important;
  margin:0!important;
}
body.social-page .social-auth-form input:not([type="checkbox"]):not([type="file"]):focus{
  border-color:#1a73e8!important;
  box-shadow:0 0 0 2px rgba(26,115,232,.25)!important;
}
body.social-page .social-auth-form .auth-password-wrap{
  position:relative!important;
  display:block!important;
  width:100%!important;
  margin:0!important;
  box-sizing:border-box!important;
}
body.social-page .social-auth-form .auth-password-wrap input{
  width:100%!important;
  max-width:none!important;
  height:34px!important;
  min-height:34px!important;
  margin:0!important;
  padding:6px 48px 6px 8px!important;
  box-sizing:border-box!important;
}
body.social-page .social-auth-form .auth-password-eye{
  position:absolute!important;
  right:7px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  min-height:34px!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  color:#4b5563!important;
  cursor:pointer!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:18px!important;
  line-height:1!important;
  padding:0!important;
  box-shadow:none!important;
}
body.social-page .social-auth-form .auth-password-eye:hover{background:#f3f4f6!important;box-shadow:none!important;}
body.social-page .social-auth-form .auth-password-eye img{width:20px!important;height:20px!important;display:block!important;pointer-events:none!important;}
body.social-page .social-auth-form .remember-row{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  height:34px!important;
  margin:0 0 6px 6px!important;
  color:#000!important;
  font-size:14px!important;
  line-height:1.2!important;
}
body.social-page .social-auth-form .remember-row input{
  width:13px!important;
  height:13px!important;
  min-width:13px!important;
  min-height:13px!important;
  margin:0!important;
}
body.social-page .social-auth-form #socialAuthSubmit.insert-qr-btn,
body.social-page .social-auth-form #socialVkLoginBtn.insert-qr-btn{
  width:100%!important;
  height:37px!important;
  min-height:37px!important;
  margin:0!important;
  padding:0 12px!important;
  border-radius:7px!important;
  border:1px solid #dfe1e5!important;
  background:#f8f9fa!important;
  color:#222!important;
  font-size:12px!important;
  line-height:37px!important;
  font-weight:700!important;
  box-shadow:none!important;
  cursor:pointer!important;
  box-sizing:border-box!important;
}
body.social-page .social-auth-form #socialVkLoginBtn.insert-qr-btn{
  margin-top:2px!important;
  background:#0077ff!important;
  color:#fff!important;
}
body.social-page .social-auth-form .auth-note,
body.social-page .social-auth-form .social-auth-error{
  display:none!important;
}
body.social-page .social-auth-modal[data-mode="login"] .auth-avatar-wrap{display:none!important;}
body.social-page.social-dark .social-auth-panel.modal-card{background:#fff!important;border-color:transparent!important;}
body.social-page.social-dark .social-auth-head.modal-head h2{color:#2b2b2b!important;}
body.social-page.social-dark .social-auth-form input:not([type="checkbox"]):not([type="file"]){background:#fff!important;color:#202124!important;border-color:#dfe1e5!important;}
body.social-page.social-dark .social-auth-form .remember-row{color:#000!important;}

/* === social-auth-constructor-exact-v2 ===
   Финальное выравнивание регистрации соцсети под окно конструктора:
   без внутренней прокрутки, короче поля, такие же высоты полей/кнопки и видимая тех. строка. */
body.social-page .social-auth-modal.auth-modal{
  align-items:center!important;
  justify-content:center!important;
  padding:18px!important;
  background:rgba(17,24,39,.48)!important;
}
body.social-page .social-auth-panel.modal-card{
  width:380px!important;
  max-width:calc(100vw - 22px)!important;
  height:auto!important;
  max-height:none!important;
  overflow:visible!important;
  padding:10px 8px 20px!important;
  border-radius:18px!important;
  border:0!important;
  box-shadow:0 18px 50px rgba(0,0,0,.18)!important;
  background:#fff!important;
  display:block!important;
}
body.social-page .social-auth-head.modal-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  padding:0 4px 4px 12px!important;
  margin:0!important;
  border:0!important;
}
body.social-page .social-auth-head h2{
  margin:0!important;
  text-align:left!important;
  font-size:19px!important;
  line-height:1.2!important;
  font-weight:700!important;
  color:#2b2b2b!important;
}
body.social-page .social-auth-form.auth-form{
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  max-height:none!important;
  box-sizing:border-box!important;
}
body.social-page .social-auth-form .auth-avatar-wrap{
  width:110px!important;
  height:120px!important;
  position:relative!important;
  margin:0 auto 4px!important;
  display:block!important;
}
body.social-page .social-auth-form .auth-avatar-preview{
  display:block!important;
  width:100px!important;
  height:100px!important;
  margin:0 auto!important;
  border-radius:50%!important;
  object-fit:cover!important;
  background:#e5e5e5!important;
  border:0!important;
}
body.social-page .social-auth-form .auth-avatar-camera{
  position:absolute!important;
  right:8px!important;
  bottom:18px!important;
  width:34px!important;
  height:34px!important;
  border-radius:50%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:#4aa3ff!important;
  border:3px solid #fff!important;
  box-shadow:0 1px 4px rgba(0,0,0,.14)!important;
}
body.social-page .social-auth-form .auth-camera-icon{width:18px!important;height:18px!important;}
body.social-page .social-auth-form input:not([type="checkbox"]):not([type="file"]){
  width:calc(100% - 10mm)!important;
  height:34px!important;
  min-height:34px!important;
  margin-left:5mm!important;
  margin-right:5mm!important;
  padding:6px 8px!important;
  box-sizing:border-box!important;
  border:1px solid #dfe1e5!important;
  border-radius:7px!important;
  background:#fff!important;
  color:#202124!important;
  font-size:14px!important;
  outline:none!important;
  box-shadow:none!important;
}
body.social-page .social-auth-form input:not([type="checkbox"]):not([type="file"]):focus{
  border-color:#1a73e8!important;
  box-shadow:0 0 0 2px rgba(26,115,232,.25)!important;
}
body.social-page .social-auth-password-wrap{
  position:relative!important;
  width:calc(100% - 10mm)!important;
  height:34px!important;
  min-height:34px!important;
  margin-left:5mm!important;
  margin-right:5mm!important;
  box-sizing:border-box!important;
}
body.social-page .social-auth-password-wrap input#socialAuthPassword{
  width:100%!important;
  height:34px!important;
  min-height:34px!important;
  margin:0!important;
  padding-left:8px!important;
  padding-right:44px!important;
}
body.social-page .social-auth-form .auth-password-eye{
  position:absolute!important;
  right:4px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:30px!important;
  height:30px!important;
  min-width:30px!important;
  min-height:30px!important;
  border:0!important;
  border-radius:9px!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:0!important;
}
body.social-page .social-auth-form .auth-password-eye img{width:18px!important;height:18px!important;}
body.social-page .social-auth-form .remember-row{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  height:34px!important;
  margin:0 0 6px 5mm!important;
  color:#000!important;
  font-size:14px!important;
  line-height:1.2!important;
}
body.social-page .social-auth-form .remember-row input{
  width:13px!important;
  height:13px!important;
  min-height:13px!important;
  margin:0!important;
}
body.social-page .social-auth-form #socialAuthSubmit.insert-qr-btn,
body.social-page .social-auth-form .social-auth-submit.insert-qr-btn{
  width:calc(100% - 10mm)!important;
  height:37px!important;
  min-height:37px!important;
  margin-left:5mm!important;
  margin-right:5mm!important;
  border-radius:7px!important;
  border:1px solid #dfe1e5!important;
  background:#f8f9fa!important;
  color:#222!important;
  font-size:12px!important;
  font-weight:700!important;
  box-shadow:none!important;
}
body.social-page .social-auth-form .social-vk-auth-btn{margin-top:2px!important;background:#0077ff!important;color:#fff!important;}
body.social-page .social-auth-form .auth-note,
body.social-page .social-auth-form .social-auth-error{
  display:block!important;
  min-height:0!important;
  margin:2px 5mm 0!important;
  color:#6b7280!important;
  font-size:12px!important;
  line-height:1.25!important;
  text-align:left!important;
}
body.social-page .social-auth-modal[data-mode="login"] .auth-avatar-wrap{display:none!important;}
body.social-page .social-auth-modal[data-mode="login"] .social-auth-form{gap:8px!important;}

/* === social-auth-password-close-final-v3 ===
   1) Password row is forced to the exact same horizontal box as ordinary inputs.
   2) Registration close button uses the same cross button geometry as user publication modal. */
body.social-page .social-auth-form{
  --social-auth-field-side:5mm;
  --social-auth-field-width:calc(100% - (var(--social-auth-field-side) * 2));
}
body.social-page .social-auth-form > input#socialAuthName,
body.social-page .social-auth-form > input#socialAuthEmail,
body.social-page .social-auth-form > .social-auth-password-wrap,
body.social-page .social-auth-form > #socialAuthSubmit,
body.social-page .social-auth-form > #socialVkLoginBtn{
  width:var(--social-auth-field-width)!important;
  max-width:var(--social-auth-field-width)!important;
  margin-left:var(--social-auth-field-side)!important;
  margin-right:var(--social-auth-field-side)!important;
  box-sizing:border-box!important;
}
body.social-page .social-auth-form > .social-auth-password-wrap{
  display:block!important;
  position:relative!important;
  height:34px!important;
  min-height:34px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  overflow:visible!important;
}
body.social-page .social-auth-form > .social-auth-password-wrap > input#socialAuthPassword{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:34px!important;
  min-height:34px!important;
  margin:0!important;
  padding:6px 44px 6px 8px!important;
  box-sizing:border-box!important;
  border:1px solid #dfe1e5!important;
  border-radius:7px!important;
  background:#fff!important;
  color:#202124!important;
  font-size:14px!important;
  line-height:20px!important;
  box-shadow:none!important;
}
body.social-page .social-auth-form > .social-auth-password-wrap > .auth-password-eye{
  right:4px!important;
}
body.social-page .social-auth-close.toolbtn,
body.social-page button.social-auth-close,
body.social-page .social-auth-head .social-auth-close{
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  min-height:40px!important;
  flex:0 0 40px!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:8px!important;
  background-color:transparent!important;
  background-image:url("../icons/ui/cross26.SVG")!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:100% 100%!important;
  box-shadow:none!important;
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  text-indent:-9999px!important;
  overflow:visible!important;
  clip-path:none!important;
  -webkit-clip-path:none!important;
  mask:none!important;
  -webkit-mask:none!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}
body.social-page .social-auth-close.toolbtn:hover,
body.social-page button.social-auth-close:hover,
body.social-page .social-auth-head .social-auth-close:hover{
  background-color:transparent!important;
  background-image:url("../icons/ui/cross26.SVG")!important;
  filter:brightness(.91)!important;
}
body.social-page .social-auth-close.toolbtn::before,
body.social-page .social-auth-close.toolbtn::after,
body.social-page button.social-auth-close::before,
body.social-page button.social-auth-close::after{
  content:none!important;
  display:none!important;
}


/* footerfix-2026: sidebar footer replaces old publication hint */
.social-footer-note{margin-top:auto;padding:12px 10px 10px;text-align:center;color:#64748b;font-size:12px;line-height:1.35;border-top:1px solid rgba(148,163,184,.22)}
.social-footer-note-title{font-size:13px;font-weight:700;color:#334155;line-height:1.25;margin-bottom:4px}
.social-footer-note-copy{font-size:11px;font-weight:400;color:#94a3b8;line-height:1.35}
body.social-page.social-dark .social-footer-note{border-top-color:rgba(148,163,184,.22)}
body.social-page.social-dark .social-footer-note-title{color:#e5e7eb}
body.social-page.social-dark .social-footer-note-copy{color:#94a3b8}

/* social133: generated cards replace the old generation canvas */
.gen-results-stage{
  width:100%;
  min-width:0;
  display:block;
}
.gen-results-stage .gen-results-grid{
  width:100%;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  align-content:start;
  gap:16px;
}
.gen-results-stage .social-card{
  display: flex;
  flex-direction: column;

  width:100%;
  min-width:0;
}
.gen-result-card{
  min-height:280px;
  border-radius:22px;
  background:#f3f4f6;
  border:1px solid #e5e7eb;
  box-shadow:0 12px 32px rgba(17,24,39,.06);
  overflow:hidden;
}
.gen-result-queue-card{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#6b7280;
}
.gen-result-queue-body,
.gen-result-empty-body{
  min-height:280px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:28px 18px;
}
.gen-result-queue-title,
.gen-result-empty-body b{
  color:#111827;
  font-size:16px;
  font-weight:700;
  line-height:1.25;
}
.gen-result-queue-subtitle,
.gen-result-empty-body small{
  color:#6b7280;
  font-size:13px;
  line-height:1.35;
  max-width:210px;
}
.gen-result-queue-card .gen-progress-ring{
  width:78px!important;
  height:78px!important;
  margin-bottom:8px!important;
}
body.social-page.social-dark .gen-result-card{
  background:#111827;
  border-color:#303744;
  box-shadow:none;
}
body.social-page.social-dark .gen-result-queue-title,
body.social-page.social-dark .gen-result-empty-body b{
  color:#f9fafb;
}
body.social-page.social-dark .gen-result-queue-subtitle,
body.social-page.social-dark .gen-result-empty-body small{
  color:#cbd5e1;
}
@media (max-width:900px){
  .gen-results-stage .gen-results-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));}
}
.video-preview-box.is-video-queue{background:#f3f4f6!important;border-color:#e5e7eb!important;display:flex!important;align-items:center!important;justify-content:center!important;}
.video-preview-box .video-queue-body{min-height:320px;}
body.social-page.social-dark .video-preview-box.is-video-queue{background:#111827!important;border-color:#303744!important;}


/* social135: marketplace generation has no central preview/stub; queue/results live in the right cards grid */
body.social-page .marketplace-workspace.marketplace-workspace-no-stage{
  grid-template-columns:320px minmax(0,1fr)!important;
  gap:28px!important;
}
body.social-page .marketplace-workspace.marketplace-workspace-no-stage .gen-preview-gallery{
  min-width:0!important;
  width:100%!important;
}
body.social-page .marketplace-workspace.marketplace-workspace-no-stage .gen-gallery-grid.is-logo-cards{
  display:grid!important;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr))!important;
  align-content:start!important;
}
body.social-page .marketplace-workspace.marketplace-workspace-no-stage .gen-preview-stage,
body.social-page .marketplace-workspace.marketplace-workspace-no-stage .gen-results-stage,
body.social-page .marketplace-workspace.marketplace-workspace-no-stage .gen-result-empty-card{
  display:none!important;
}
@media(max-width:1100px){
  body.social-page .marketplace-workspace.marketplace-workspace-no-stage{grid-template-columns:300px minmax(0,1fr)!important;}
}
@media(max-width:760px){
  body.social-page .marketplace-workspace.marketplace-workspace-no-stage{grid-template-columns:1fr!important;}
}

/* social136: generation tab has only result cards grid, no central generator block */
body.social-page .social-grid.is-generation-results-grid{
  display:block!important;
  width:100%!important;
}
body.social-page .generation-results-tabs{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin:0 0 16px!important;
}
body.social-page .generation-results-only-grid{
  width:100%!important;
  display:grid!important;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr))!important;
  gap:16px!important;
  align-content:start!important;
}
body.social-page .generation-results-only-grid .social-card,
body.social-page .generation-results-only-grid .gen-result-card{
  width:100%!important;
  min-width:0!important;
}
body.social-page .is-generation-results-grid .social-empty,
body.social-page .is-generation-results-grid .gen-result-empty-card,
body.social-page .is-generation-results-grid .social-generation-empty{
  display:none!important;
}
@media (max-width:900px){
  body.social-page .generation-results-only-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))!important;}
}

/* Generation logo: parameters panel + results grid only, no central preview block */
.gen-preview-workspace.gen-generation-results-layout{
  grid-template-columns:320px minmax(0,1fr) !important;
}
.gen-generation-results-layout .gen-generation-results-panel{
  grid-column:auto !important;
  height:calc(100vh - 132px) !important;
  min-height:620px !important;
}
.gen-generation-results-layout .generation-results-only-grid{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr)) !important;
  gap:16px !important;
  align-content:start !important;
}
.gen-generation-results-layout .gen-preview-stage,
.gen-generation-results-layout .gen-result-empty-card{
  display:none !important;
}
@media (max-width: 980px){
  .gen-preview-workspace.gen-generation-results-layout{
    grid-template-columns:1fr !important;
  }
  .gen-generation-results-layout .gen-generation-results-panel{
    height:auto !important;
    min-height:0 !important;
  }
}

/* fix: logo generation uses the same two-column layout as marketplace cards */
body.social-page .generation-logo-workspace.marketplace-workspace-no-stage{
  grid-template-columns:320px minmax(0,1fr)!important;
  gap:28px!important;
}
body.social-page .generation-logo-workspace .gen-preview-editor{
  min-height:0!important;
  overflow:hidden!important;
}
body.social-page .generation-logo-workspace .logo-generation-editor{
  height:100%!important;
  max-height:100%!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  gap:10px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
  padding-right:12px!important;
}
body.social-page .generation-logo-workspace .gen-preview-gallery{
  min-width:0!important;
  width:100%!important;
}
body.social-page .generation-logo-workspace .gen-gallery-grid.is-logo-cards{
  display:grid!important;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr))!important;
  gap:20px!important;
  align-content:start!important;
}
body.social-page .generation-logo-workspace .gen-preview-stage,
body.social-page .generation-logo-workspace .gen-results-stage,
body.social-page .generation-logo-workspace .gen-result-empty-card{
  display:none!important;
}
@media(max-width:1100px){
  body.social-page .generation-logo-workspace.marketplace-workspace-no-stage{grid-template-columns:300px minmax(0,1fr)!important;}
}
@media(max-width:760px){
  body.social-page .generation-logo-workspace.marketplace-workspace-no-stage{grid-template-columns:1fr!important;}
}


/* logo generation panel restored from original archive */
body.social-page .generation-logo-workspace .gen-preview-editor{
  overflow:visible!important;
}
body.social-page .generation-logo-workspace .social-generation-editor.gen-preview38-editor{
  height:auto!important;
  max-height:none!important;
  min-height:0!important;
  overflow:visible!important;
  display:block!important;
  padding-right:0!important;
}

/* === Fix: logo generation panel full height and safe bottom spacing === */
body.social-page .generation-logo-workspace.marketplace-workspace-no-stage{
  height:calc(100vh - 78px) !important;
  min-height:0 !important;
  align-items:stretch !important;
  padding-bottom:28px !important;
  box-sizing:border-box !important;
}

body.social-page .generation-logo-workspace .gen-preview-editor{
  height:100% !important;
  min-height:0 !important;
  max-height:100% !important;
  overflow:hidden !important;
  display:flex !important;
}

body.social-page .generation-logo-workspace .social-generation-editor.gen-preview38-editor{
  width:100% !important;
  height:100% !important;
  max-height:100% !important;
  min-height:0 !important;
  display:flex !important;
  flex-direction:column !important;
  box-sizing:border-box !important;
  padding-bottom:24px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-gutter:stable !important;
}

body.social-page .generation-logo-workspace .gen-desc-input{
  flex:1 1 auto !important;
  min-height:120px !important;
}

body.social-page .generation-logo-workspace .gen-upload-zones,
body.social-page .generation-logo-workspace .gen-desc-controls,
body.social-page .generation-logo-workspace .gen-bg-toggle-wrap{
  flex:0 0 auto !important;
}

body.social-page .generation-logo-workspace .gen-bg-toggle-wrap{
  margin-bottom:0 !important;
}

@media(max-width:760px){
  body.social-page .generation-logo-workspace.marketplace-workspace-no-stage{
    height:auto !important;
    min-height:0 !important;
    padding-bottom:22px !important;
  }
  body.social-page .generation-logo-workspace .gen-preview-editor,
  body.social-page .generation-logo-workspace .social-generation-editor.gen-preview38-editor{
    height:auto !important;
    max-height:none !important;
  }
}

/* === Patch: logo generation panel bottom spacing === */
.gen-preview38-editor{
  grid-template-rows:auto minmax(0,1fr) auto auto auto !important;
  align-content:stretch !important;
  padding-bottom:10px !important;
}

.gen-preview38-editor .gen-upload-zones{
  margin:0 0 8px !important;
  align-self:end !important;
}

.gen-preview38-editor .gen-desc-controls{
  margin:0 !important;
}

.gen-preview38-editor .gen-bg-toggle-wrap{
  margin:4px 0 0 !important;
  align-self:start !important;
}

/* === Real fix: logo generation panel bottom gap ===
   The previous panel had a large empty area below the background toggle because
   the textarea was capped by max-height:260px. Let it fill the free space so
   the upload/buttons/toggle block moves to the bottom, like preview 81. */
body.social-page .generation-logo-workspace .social-generation-editor.gen-preview38-editor{
  display:flex !important;
  flex-direction:column !important;
}

body.social-page .generation-logo-workspace .social-generation-editor.gen-preview38-editor .gen-desc-input{
  flex:1 1 auto !important;
  height:auto !important;
  max-height:none !important;
  min-height:120px !important;
}

body.social-page .generation-logo-workspace .social-generation-editor.gen-preview38-editor .gen-upload-zones,
body.social-page .generation-logo-workspace .social-generation-editor.gen-preview38-editor .gen-desc-controls,
body.social-page .generation-logo-workspace .social-generation-editor.gen-preview38-editor .gen-bg-toggle-wrap{
  flex:0 0 auto !important;
}

body.social-page .generation-logo-workspace .social-generation-editor.gen-preview38-editor .gen-upload-zones{
  margin:0 0 8px !important;
}

body.social-page .generation-logo-workspace .social-generation-editor.gen-preview38-editor .gen-bg-toggle-wrap{
  margin:6px 0 0 !important;
  transform:none !important;
}


/* imported working layout */
.social-generation-layout{
  grid-column:1/-1;
  width:100%;
  display:grid;
  grid-template-columns:320px minmax(0,1fr);
  gap:26px;
  align-items:start;
  padding:8px 18px 26px;
}
/* FINAL BUTTON FIX */
.social-generator-card{
  display:flex !important;
  flex-direction:column !important;
}

.social-generator-actions{
  margin-top:auto !important;
}

/* === REAL FIX 2026-07-06: logo generation description panel ===
   Active DOM is not .social-generator-card.
   Active DOM:
   .generation-logo-workspace > .gen-preview-editor > .social-generation-description.gen-preview38-editor
   The bottom block is: .gen-upload-zones + .gen-desc-controls + .gen-bg-toggle-wrap
*/
body.social-page .generation-logo-workspace.marketplace-workspace-no-stage{
  min-height:calc(100vh - 78px) !important;
  align-items:stretch !important;
}

body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor{
  display:flex !important;
  flex-direction:column !important;
  align-self:stretch !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
}

body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor > .social-generation-description.gen-preview38-editor{
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
  width:100% !important;
  min-height:calc(100vh - 126px) !important;
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
  box-sizing:border-box !important;
}

body.social-page .generation-logo-workspace .social-generation-description.gen-preview38-editor .gen-desc-head{
  flex:0 0 auto !important;
}

body.social-page .generation-logo-workspace .social-generation-description.gen-preview38-editor .gen-desc-input{
  flex:0 0 auto !important;
  height:260px !important;
  min-height:260px !important;
  max-height:260px !important;
  resize:none !important;
  overflow-y:auto !important;
}

body.social-page .generation-logo-workspace .social-generation-description.gen-preview38-editor .gen-upload-zones{
  margin-top:auto !important;
  margin-bottom:14px !important;
  flex:0 0 auto !important;
}

body.social-page .generation-logo-workspace .social-generation-description.gen-preview38-editor .gen-desc-controls{
  margin-top:0 !important;
  flex:0 0 auto !important;
}

body.social-page .generation-logo-workspace .social-generation-description.gen-preview38-editor .gen-bg-toggle-wrap{
  margin-top:12px !important;
  transform:none !important;
  flex:0 0 auto !important;
}

@media(max-width:760px){
  body.social-page .generation-logo-workspace.marketplace-workspace-no-stage,
  body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor,
  body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor > .social-generation-description.gen-preview38-editor{
    min-height:0 !important;
    height:auto !important;
  }
  body.social-page .generation-logo-workspace .social-generation-description.gen-preview38-editor .gen-upload-zones{
    margin-top:18px !important;
  }
}


body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor{
  justify-self:stretch !important;
  align-self:stretch !important;
  width:100% !important;
  min-width:0 !important;
  margin-left:0 !important;
  margin-right:0 !important;
  display:flex !important;
  flex-direction:column !important;
  box-sizing:border-box !important;
}

body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor > .social-generation-description.gen-preview38-editor{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  align-self:stretch !important;
  justify-self:stretch !important;
  width:100% !important;
  min-width:0 !important;
  margin-left:0 !important;
  margin-right:0 !important;
  box-sizing:border-box !important;
}

body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor > .social-generation-description.gen-preview38-editor .gen-desc-head{
  flex:0 0 auto !important;
  align-self:stretch !important;
}

body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor > .social-generation-description.gen-preview38-editor .gen-desc-input{
  flex:1 1 auto !important;
  height:auto !important;
  min-height:260px !important;
  max-height:none !important;
  width:100% !important;
  align-self:stretch !important;
  box-sizing:border-box !important;
  resize:none !important;
  overflow-y:auto !important;
}

body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor > .social-generation-description.gen-preview38-editor .gen-upload-zones{
  margin-top:auto !important;
  margin-bottom:14px !important;
  align-self:stretch !important;
  justify-self:stretch !important;
  width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor > .social-generation-description.gen-preview38-editor .gen-desc-controls{
  margin-top:0 !important;
  align-self:stretch !important;
  justify-self:stretch !important;
  width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor > .social-generation-description.gen-preview38-editor .gen-bg-toggle-wrap{
  margin-top:12px !important;
  align-self:flex-start !important;
  justify-self:start !important;
  transform:none !important;
}

@media(max-width:760px){
  body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor > .social-generation-description.gen-preview38-editor .gen-desc-input{
    flex:0 0 auto !important;
    min-height:180px !important;
  }
  body.social-page .generation-logo-workspace.marketplace-workspace-no-stage > .gen-preview-editor > .social-generation-description.gen-preview38-editor .gen-upload-zones{
    margin-top:18px !important;
  }
}


/* ===== TABS SPACING FIX ===== */
body.social-page .generation-logo-workspace .gen-gallery-tabs,
body.social-page .generation-logo-workspace .generation-results-tabs{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:24px !important;
  margin-bottom:24px !important;
}

body.social-page .generation-logo-workspace .gen-gallery-tabs button,
body.social-page .generation-logo-workspace .generation-results-tabs button{
  margin:0 !important;
}


/* === TEMP CLEAN SCROLL RESET === */
html.social-page,
body.social-page {
  overflow: hidden !important;
}

body.social-page .social-main,
body.social-page #socialGrid,
body.social-page .gen-gallery-grid,
body.social-page .gen-preview-workspace,
body.social-page .marketplace-workspace,
body.social-page .marketplace-editor,
body.social-page .video-effects-body {
  overflow: visible !important;
  overflow-y: visible !important;
  overflow-x: visible !important;
  scrollbar-width: none !important;
}

body.social-page *::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}


/* === NEW UNIFIED SOCIAL SCROLL === */
html.social-page,
body.social-page {
  overflow: hidden !important;
  height: 100vh !important;
}

body.social-page .social-main,
body.social-page #socialGrid,
body.social-page .gen-gallery-grid,
body.social-page .gen-preview-workspace,
body.social-page .marketplace-workspace {
  overflow: visible !important;
  overflow-y: visible !important;
  overflow-x: visible !important;
}

/* only one scroll owner */
body.social-page .social-main {
  height: calc(100vh - 0px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* remove nested scrolling */
body.social-page .gen-gallery-grid,
body.social-page .gen-gallery-grid.is-logo-cards,
body.social-page .gen-gallery-grid.is-prompts {
  overflow: visible !important;
  max-height: none !important;
}


/* UNIFIED SCROLL FIX v2: allow main social scroll in generator and marketplace */
body.social-page:has(.gen-preview-workspace) .social-main,
body.social-page:has(.marketplace-workspace) .social-main,
body.social-page:has(.gen-preview-workspace) #socialGrid,
body.social-page:has(.marketplace-workspace) #socialGrid {
  overflow: visible !important;
  overflow-y: visible !important;
  height: auto !important;
  max-height: none !important;
}

body.social-page:has(.gen-preview-workspace) .gen-preview-workspace,
body.social-page:has(.marketplace-workspace) .marketplace-workspace,
body.social-page:has(.gen-preview-workspace) .gen-gallery-grid,
body.social-page:has(.marketplace-workspace) .gen-gallery-grid {
  overflow: visible !important;
  overflow-y: visible !important;
  height: auto !important;
  max-height: none !important;
}


/* v149 unified scroll fix: generator and marketplace use parent scroll */
.social-main:has(.gen-preview-workspace),
.social-main:has(.marketplace-workspace) {
  overflow: visible !important;
  height: auto !important;
}

.gen-preview-workspace,
.marketplace-workspace {
  overflow: visible !important;
  height: auto !important;
  min-height: calc(100vh - 78px);
}

.gen-gallery-grid {
  overflow: visible !important;
  height: auto !important;
}

.gen-preview-gallery {
  overflow: visible !important;
  height: auto !important;
}

/* v10: allow unified page scroll in generator and marketplace */
body.social-page:has(.social-generation-layout) .social-main,
body.social-page:has(.marketplace-workspace) .social-main {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}
body.social-page:has(.social-generation-layout) .social-grid,
body.social-page:has(.marketplace-workspace) .social-grid {
  overflow: visible !important;
  height: auto !important;
}
body.social-page:has(.social-generation-layout) .gen-preview-workspace,
body.social-page:has(.marketplace-workspace) .gen-preview-workspace,
body.social-page:has(.social-generation-layout) .gen-preview-gallery,
body.social-page:has(.marketplace-workspace) .gen-preview-gallery,
body.social-page:has(.social-generation-layout) .marketplace-workspace,
body.social-page:has(.marketplace-workspace) .marketplace-workspace {
  overflow: visible !important;
  height: auto !important;
  max-height: none !important;
}


/* scroll fix v1: allow generation and marketplace to use parent scroll */
body.social-page .social-main:has(.gen-preview-workspace),
body.social-page .social-main:has(.marketplace-workspace){
  overflow: visible !important;
}
body.social-page .gen-preview-workspace,
body.social-page .marketplace-workspace{
  height: auto !important;
  min-height: calc(100vh - 78px);
  overflow: visible !important;
}
body.social-page .gen-gallery-grid{
  overflow: visible !important;
}


/* FINAL SCROLL TEST OVERRIDE */
body.social-page .social-main:has(.gen-preview-workspace),
body.social-page .social-main:has(.marketplace-card-workspace),
body.social-page .social-main:has(.marketplace-workspace){
  height:auto !important;
  min-height:100vh !important;
  overflow:visible !important;
}

body.social-page .gen-preview-workspace,
body.social-page .marketplace-card-workspace,
body.social-page .marketplace-workspace{
  height:auto !important;
  min-height:100vh !important;
  overflow:visible !important;
  position:relative !important;
}

body.social-page .gen-gallery-grid,
body.social-page .marketplace-grid,
body.social-page .marketplace-gallery{
  overflow:visible !important;
  max-height:none !important;
}


/* v159 targeted: make generator and marketplace use the same scroll owner as logo lists */
body.social-page:has(.gen-preview-workspace) .social-main,
body.social-page:has(.marketplace-workspace) .social-main,
body.social-page:has(.marketplace-card-workspace) .social-main{
  height:100vh !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}

body.social-page:has(.gen-preview-workspace) #socialGrid,
body.social-page:has(.marketplace-workspace) #socialGrid,
body.social-page:has(.marketplace-card-workspace) #socialGrid{
  overflow:visible !important;
  height:auto !important;
}

body.social-page:has(.gen-preview-workspace) .gen-preview-workspace,
body.social-page:has(.marketplace-workspace) .marketplace-workspace,
body.social-page:has(.marketplace-card-workspace) .marketplace-card-workspace{
  overflow:visible !important;
  height:auto !important;
}


/* === unified scrollbar visual only === */
#socialGrid.is-grid{
  scrollbar-width:thin;
  scrollbar-color:#b8bec8 transparent;
}
#socialGrid.is-grid::-webkit-scrollbar{
  width:8px;
  height:8px;
}
#socialGrid.is-grid::-webkit-scrollbar-track{
  background:transparent;
}
#socialGrid.is-grid::-webkit-scrollbar-thumb{
  background:#b8bec8;
  border-radius:999px;
}
#socialGrid.is-grid::-webkit-scrollbar-thumb:hover{
  background:#9da5b1;
}


/* === FINAL unified scrollbar visible === */
body.social-page #socialGrid.is-grid {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-width: thin !important;
  scrollbar-color: #b8bec8 transparent !important;
}

body.social-page #socialGrid.is-grid::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
  display: block !important;
}

body.social-page #socialGrid.is-grid::-webkit-scrollbar-thumb {
  background: #b8bec8 !important;
  border-radius: 999px !important;
}

body.social-page #socialGrid.is-grid::-webkit-scrollbar-track {
  background: transparent !important;
}

/* FINAL scrollbar visibility restore */
body.social-page,
html.social-page {
  scrollbar-width: auto !important;
}

body.social-page *::-webkit-scrollbar {
  width: initial !important;
  height: initial !important;
  display: initial !important;
}

body.social-page .social-main,
body.social-page #socialGrid {
  scrollbar-width: auto !important;
}


/* v172 scrollbar visual correction: use custom page thumb, hide native bars */
html.social-page, body.social-page {
  scrollbar-width: none !important;
}
html.social-page::-webkit-scrollbar,
body.social-page::-webkit-scrollbar,
body.social-page .social-main::-webkit-scrollbar,
body.social-page #socialGrid.is-grid::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
}
#unifiedScrollTrack{
  width:6px !important;
  right:5px !important;
  background:rgba(120,120,120,.12) !important;
}
#unifiedScrollThumb{
  width:6px !important;
  min-height:42px !important;
  background:#8a8a8a !important;
}


/* scrollbar thumb drag fix */
#unifiedScrollTrack{
  pointer-events:none !important;
}
#unifiedScrollThumb{
  pointer-events:auto !important;
  cursor:grab !important;
  touch-action:none;
}
#unifiedScrollThumb:active{
  cursor:grabbing !important;
}


/* === PXPress FINAL: generation logo cards use My Logos masonry logic ===
   Single authoritative block for "Генерация логотипа" card layout.
   Keeps ChatGPT-style scroll unchanged and removes old flex/grid/vertical overrides.
*/
body.social-page .generation-logo-workspace [data-dynamic-card-zone] .gen-gallery-grid.is-logo-cards{
  display:block !important;
  columns:auto !important;
  column-count:auto !important;
  column-width:var(--gen-logo-card-column-width, 180px) !important;
  column-gap:var(--logo-card-column-gap, 5px) !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  align-content:start !important;
  padding:0 4px 24px 0 !important;
}

body.social-page .generation-logo-workspace [data-dynamic-card-zone] .gen-gallery-grid.is-logo-cards > .social-card,
body.social-page .generation-logo-workspace [data-dynamic-card-zone] .gen-gallery-grid.is-logo-cards > .social-masonry-card,
body.social-page .generation-logo-workspace [data-dynamic-card-zone] .gen-gallery-grid.is-logo-cards > .social-grid-card,
body.social-page .generation-logo-workspace [data-dynamic-card-zone] .gen-gallery-grid.is-logo-cards > .gen-preview-card{
  display:inline-block !important;
  width:100% !important;
  max-width:none !important;
  margin:0 0 20px 0 !important;
  padding:0 !important;
  box-sizing:border-box !important;
  break-inside:avoid !important;
  page-break-inside:avoid !important;
  vertical-align:top !important;
}



/* === PXPress FINAL OVERRIDE: Generation logo card vertical gap = 20px === */
body.social-page .generation-logo-workspace [data-dynamic-card-zone] .gen-gallery-grid.is-logo-cards > .gen-preview-card,
body.social-page .generation-logo-workspace [data-dynamic-card-zone] .gen-gallery-grid.is-logo-cards > .social-card,
body.social-page .generation-logo-workspace [data-dynamic-card-zone] .gen-gallery-grid.is-logo-cards > .social-grid-card,
body.social-page .generation-logo-workspace [data-dynamic-card-zone] .gen-gallery-grid.is-logo-cards > .social-masonry-card,
body.social-page .generation-logo-workspace .gen-gallery-grid.is-logo-cards > .gen-preview-card,
body.social-page .generation-logo-workspace .gen-gallery-grid.is-logo-cards > .social-card,
body.social-page .generation-logo-workspace .gen-gallery-grid.is-logo-cards > .social-grid-card,
body.social-page .generation-logo-workspace .gen-gallery-grid.is-logo-cards > .social-masonry-card{
  margin-top:0 !important;
  margin-right:0 !important;
  margin-bottom:20px !important;
  margin-left:0 !important;
}


:root{--gen-logo-card-row-gap:20px;}


/* FINAL: generation cards vertical gap */
body.social-page .generation-logo-workspace .gen-gallery-grid.is-logo-cards > * {
  margin-bottom: var(--gen-logo-card-row-gap) !important;
}


/* FINAL: generation logo vertical card gap controlled separately */
body.social-page .gen-gallery-grid.is-logo-cards > .social-card{
  margin:0 0 var(--gen-logo-card-row-gap, 20px) 0 !important;
}

/* === PXPress FINAL: Marketplace mode switch position ===
   Keep the Card / Video card switch immediately below the title/counter
   and above the marketplace prompt field. */
body.social-page .marketplace-workspace .marketplace-editor .gen-desc-head{
  order:1 !important;
}
body.social-page .marketplace-workspace .marketplace-editor .marketplace-mode-switch{
  order:2 !important;
  flex:0 0 auto !important;
  margin-top:2px !important;
  margin-bottom:8px !important;
}
body.social-page .marketplace-workspace .marketplace-editor #marketPromptInput.gen-desc-input{
  order:3 !important;
}
body.social-page .marketplace-workspace .marketplace-editor .marketplace-select-grid{
  order:4 !important;
}
body.social-page .marketplace-workspace .marketplace-editor .marketplace-category-row{
  order:5 !important;
}
body.social-page .marketplace-workspace .marketplace-editor .marketplace-video-panel,
body.social-page .marketplace-workspace .marketplace-editor > .gen-upload-zones{
  order:6 !important;
}
body.social-page .marketplace-workspace .marketplace-editor .gen-desc-controls.marketplace-controls{
  order:7 !important;
}
body.social-page .marketplace-workspace .marketplace-editor .marketplace-hint{
  order:8 !important;
}

/* === PXPress FINAL FIX: marketplace switch must stay directly above prompt === */
body.social-page .marketplace-workspace .marketplace-editor .marketplace-prompt-stack{
  order:2 !important;
  flex:0 0 auto !important;
  display:flex !important;
  flex-direction:column !important;
  gap:0 !important;
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
}
body.social-page .marketplace-workspace .marketplace-editor .marketplace-prompt-stack .marketplace-mode-switch{
  order:1 !important;
  flex:0 0 auto !important;
  width:100% !important;
  margin:2px 0 8px 0 !important;
  position:static !important;
  transform:none !important;
}
body.social-page .marketplace-workspace .marketplace-editor .marketplace-prompt-stack #marketPromptInput.gen-desc-input{
  order:2 !important;
  flex:0 0 auto !important;
  width:100% !important;
  margin:0 !important;
  position:static !important;
  transform:none !important;
}
body.social-page .marketplace-workspace .marketplace-editor > .gen-desc-head{order:1 !important;}
body.social-page .marketplace-workspace .marketplace-editor > .marketplace-select-grid{order:3 !important;}
body.social-page .marketplace-workspace .marketplace-editor > .marketplace-category-row{order:4 !important;}
body.social-page .marketplace-workspace .marketplace-editor > .marketplace-video-panel,
body.social-page .marketplace-workspace .marketplace-editor > .gen-upload-zones{order:5 !important;}
body.social-page .marketplace-workspace .marketplace-editor > .gen-desc-controls.marketplace-controls{order:6 !important;}
body.social-page .marketplace-workspace .marketplace-editor > .marketplace-hint{order:7 !important;}

/* === PXPress FIX 203: scroll only the highlighted cards area in generator/marketplace ===
   Base: social203_generation_my_logos_same. Do not limit card count; only move scroll ownership
   from the page to the right gallery body below the tabs. */
body.social-page.social-zone-generate,
body.social-page.social-zone-marketplace{
  height:100vh !important;
  min-height:100vh !important;
  overflow:hidden !important;
}
body.social-page.social-zone-generate .social-shell,
body.social-page.social-zone-marketplace .social-shell{
  height:100vh !important;
  min-height:0 !important;
  overflow:hidden !important;
}
body.social-page.social-zone-generate .social-sidebar,
body.social-page.social-zone-marketplace .social-sidebar{
  height:100vh !important;
  overflow:hidden !important;
}
body.social-page.social-zone-generate .social-main,
body.social-page.social-zone-marketplace .social-main{
  height:100vh !important;
  min-height:0 !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
}
body.social-page.social-zone-generate .social-top,
body.social-page.social-zone-marketplace .social-top{
  flex:0 0 auto !important;
}
body.social-page.social-zone-generate #socialGrid,
body.social-page.social-zone-marketplace #socialGrid{
  flex:1 1 auto !important;
  min-height:0 !important;
  height:auto !important;
  overflow:hidden !important;
  display:block !important;
}
body.social-page.social-zone-generate #socialGrid > .generation-logo-workspace,
body.social-page.social-zone-marketplace #socialGrid > .generation-logo-workspace,
body.social-page.social-zone-generate #socialGrid > .gen-preview-workspace,
body.social-page.social-zone-marketplace #socialGrid > .gen-preview-workspace,
body.social-page.social-zone-generate #socialGrid > .marketplace-workspace,
body.social-page.social-zone-marketplace #socialGrid > .marketplace-workspace{
  height:100% !important;
  min-height:0 !important;
  max-height:100% !important;
  overflow:hidden !important;
}
body.social-page.social-zone-generate .generation-logo-workspace .gen-preview-editor,
body.social-page.social-zone-marketplace .generation-logo-workspace .gen-preview-editor,
body.social-page.social-zone-generate .marketplace-workspace .gen-preview-editor,
body.social-page.social-zone-marketplace .marketplace-workspace .gen-preview-editor{
  height:100% !important;
  min-height:0 !important;
  max-height:100% !important;
  overflow:hidden !important;
}
body.social-page.social-zone-generate .generation-logo-workspace .gen-preview-gallery,
body.social-page.social-zone-marketplace .generation-logo-workspace .gen-preview-gallery,
body.social-page.social-zone-generate .marketplace-workspace .gen-preview-gallery,
body.social-page.social-zone-marketplace .marketplace-workspace .gen-preview-gallery{
  height:100% !important;
  min-height:0 !important;
  max-height:100% !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
}
body.social-page.social-zone-generate .generation-logo-workspace .gen-gallery-tabs,
body.social-page.social-zone-marketplace .generation-logo-workspace .gen-gallery-tabs,
body.social-page.social-zone-generate .generation-logo-workspace .generation-results-tabs,
body.social-page.social-zone-marketplace .generation-logo-workspace .generation-results-tabs{
  flex:0 0 auto !important;
}
body.social-page.social-zone-generate .generation-logo-workspace [data-dynamic-card-zone],
body.social-page.social-zone-marketplace .generation-logo-workspace [data-dynamic-card-zone],
body.social-page.social-zone-generate .marketplace-workspace [data-dynamic-card-zone],
body.social-page.social-zone-marketplace .marketplace-workspace [data-dynamic-card-zone]{
  flex:1 1 auto !important;
  min-height:0 !important;
  height:auto !important;
  max-height:none !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain !important;
  scrollbar-width:thin !important;
  scrollbar-color:rgba(120,120,120,.55) transparent !important;
  padding-right:8px !important;
}
body.social-page.social-zone-generate .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar,
body.social-page.social-zone-marketplace .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar,
body.social-page.social-zone-generate .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar,
body.social-page.social-zone-marketplace .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar{
  width:8px !important;
  height:8px !important;
  display:block !important;
}
body.social-page.social-zone-generate .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar-track,
body.social-page.social-zone-marketplace .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar-track,
body.social-page.social-zone-generate .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar-track,
body.social-page.social-zone-marketplace .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar-track{background:transparent !important;}
body.social-page.social-zone-generate .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar-thumb,
body.social-page.social-zone-marketplace .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar-thumb,
body.social-page.social-zone-generate .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar-thumb,
body.social-page.social-zone-marketplace .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar-thumb{background:rgba(120,120,120,.55) !important;border-radius:999px !important;}
body.social-page.social-zone-generate .generation-logo-workspace [data-dynamic-card-zone] .gen-gallery-grid,
body.social-page.social-zone-marketplace .generation-logo-workspace [data-dynamic-card-zone] .gen-gallery-grid,
body.social-page.social-zone-generate .marketplace-workspace [data-dynamic-card-zone] .gen-gallery-grid,
body.social-page.social-zone-marketplace .marketplace-workspace [data-dynamic-card-zone] .gen-gallery-grid{
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow:visible !important;
  overflow-y:visible !important;
}
@media(max-width:760px){
  body.social-page.social-zone-generate,
  body.social-page.social-zone-marketplace,
  body.social-page.social-zone-generate .social-shell,
  body.social-page.social-zone-marketplace .social-shell,
  body.social-page.social-zone-generate .social-main,
  body.social-page.social-zone-marketplace .social-main{
    height:auto !important;
    overflow:visible !important;
  }
  body.social-page.social-zone-generate #socialGrid,
  body.social-page.social-zone-marketplace #socialGrid,
  body.social-page.social-zone-generate #socialGrid > .generation-logo-workspace,
  body.social-page.social-zone-marketplace #socialGrid > .generation-logo-workspace{
    height:auto !important;
    overflow:visible !important;
  }
}


/* === PXPress scrollbar visual correction 204 ===
   Keep card-area scroll. Make it look closer to native browser scrollbar
   and keep it flush to the right edge of the gallery area. */
body.social-page.social-zone-generate .generation-logo-workspace [data-dynamic-card-zone],
body.social-page.social-zone-marketplace .generation-logo-workspace [data-dynamic-card-zone],
body.social-page.social-zone-generate .marketplace-workspace [data-dynamic-card-zone],
body.social-page.social-zone-marketplace .marketplace-workspace [data-dynamic-card-zone]{
  padding-right:0 !important;
  scrollbar-width:auto !important;
  scrollbar-color:#b8bec8 transparent !important;
}
body.social-page.social-zone-generate .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar,
body.social-page.social-zone-marketplace .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar,
body.social-page.social-zone-generate .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar,
body.social-page.social-zone-marketplace .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar{
  width:14px !important;
}
body.social-page.social-zone-generate .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar-track,
body.social-page.social-zone-marketplace .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar-track,
body.social-page.social-zone-generate .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar-track,
body.social-page.social-zone-marketplace .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar-track{
  background:transparent !important;
}
body.social-page.social-zone-generate .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar-thumb,
body.social-page.social-zone-marketplace .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar-thumb,
body.social-page.social-zone-generate .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar-thumb,
body.social-page.social-zone-marketplace .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar-thumb{
  background:#b8bec8 !important;
  border-radius:8px !important;
  border:3px solid transparent !important;
  background-clip:content-box !important;
}

/* prompt chips fit fix */
.gen-prompt-chips{
  width:100%;
  max-width:100%;
  overflow:visible;
  gap:6px !important;
  row-gap:6px !important;
}
.gen-prompt-chips button{
  height:30px;
  padding:0 12px;
  max-width:100%;
  white-space:nowrap;
}
.gen-desc-input{
  box-sizing:border-box;
}


/* Prompt examples: allow full content */
.gen-gallery-grid.is-prompts .gen-prompt-example-title{
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
}

.gen-gallery-grid.is-prompts .gen-prompt-example-text{
  display:block !important;
  -webkit-line-clamp:unset !important;
  line-clamp:unset !important;
  -webkit-box-orient:initial !important;
  overflow:visible !important;
  white-space:normal !important;
}


/* PROMPT CARDS FIX - minimal */
.gen-gallery-grid.is-prompts .gen-prompt-example{
  min-height: unset !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  display: grid !important;
  grid-template-columns: 120px minmax(0,1fr) !important;
  align-items: start !important;
}

.gen-gallery-grid.is-prompts .gen-prompt-example-title{
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

.gen-gallery-grid.is-prompts .gen-prompt-example-text{
  display: block !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
  -webkit-box-orient: initial !important;
  overflow: visible !important;
  white-space: normal !important;
}

/* Prompt cards bottom corner rounding */
.gen-preview-card.gen-prompt-example {
  border-radius: 16px;
  overflow: hidden;
}

/* === CLEAN FIX 2026-07-07: left generation panel corners ===
   Single final rule for the real left generator panel.
   Keeps layout intact and only restores visible rounded corners. */
body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor{
  border-radius:18px !important;
  overflow:hidden !important;
  background:#f7f7f8 !important;
  box-sizing:border-box !important;
}

body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor > *{
  max-width:100%;
  box-sizing:border-box;
}

/* === FINAL FIX 2026-07-08: compact left generator panel ===
   Reduce the whole left editor panel so its bottom rounded corners fit on screen.
   Targets only the left generator/marketplace editor panel. */
body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor{
  flex:0 0 auto !important;
  height:auto !important;
  min-height:0 !important;
  max-height:calc(100vh - 150px) !important;
  padding:18px 18px 16px !important;
  border-radius:18px !important;
  overflow:hidden !important;
}

body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor .gen-desc-input{
  height:210px !important;
  min-height:210px !important;
  max-height:210px !important;
}

body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor.marketplace-editor .gen-desc-input,
body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor .marketplace-prompt-input{
  height:150px !important;
  min-height:150px !important;
  max-height:150px !important;
}

body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor .gen-upload-zones{
  margin-top:12px !important;
  margin-bottom:10px !important;
  gap:8px !important;
}

body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor .gen-upload-zone{
  min-height:68px !important;
  padding:8px 10px !important;
}

body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor .gen-desc-controls,
body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor .marketplace-select-grid,
body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor .marketplace-category-row{
  margin-top:8px !important;
  margin-bottom:8px !important;
  gap:8px !important;
}

body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor .gen-bg-toggle-wrap,
body.social-page .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor .marketplace-hint{
  margin-top:8px !important;
}

/* === FINAL ADAPTIVE LEFT PANELS 2026-07-08 ===
   Logo generation and marketplace left panels fit the viewport height
   and keep 10px visible space below so bottom rounded corners are visible. */
body.social-page.social-zone-generate .generation-logo-workspace > .gen-preview-editor,
body.social-page.social-zone-marketplace .generation-logo-workspace > .gen-preview-editor{
  height:calc(100vh - 128px) !important;
  min-height:0 !important;
  max-height:calc(100vh - 128px) !important;
  overflow:hidden !important;
  align-self:start !important;
}

body.social-page.social-zone-generate .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor,
body.social-page.social-zone-marketplace .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor{
  width:304px !important;
  height:100% !important;
  min-height:0 !important;
  max-height:100% !important;
  box-sizing:border-box !important;
  border-radius:18px !important;
  overflow:hidden !important;
  padding:18px 18px 16px !important;
}

body.social-page.social-zone-generate .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor{
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) auto auto auto !important;
  gap:10px !important;
}

body.social-page.social-zone-generate .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor .gen-desc-input{
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  resize:none !important;
}

body.social-page.social-zone-generate .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor .gen-upload-zones{
  margin:0 !important;
  gap:8px !important;
}

body.social-page.social-zone-generate .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor .gen-upload-zone{
  min-height:72px !important;
  padding:8px 10px !important;
}

body.social-page.social-zone-marketplace .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor.marketplace-editor,
body.social-page.social-zone-marketplace .marketplace-workspace .gen-preview-editor .marketplace-editor.gen-preview38-editor{
  height:100% !important;
  min-height:0 !important;
  max-height:100% !important;
  box-sizing:border-box !important;
  border-radius:18px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}

@media(max-width:760px){
  body.social-page.social-zone-generate .generation-logo-workspace > .gen-preview-editor,
  body.social-page.social-zone-marketplace .generation-logo-workspace > .gen-preview-editor{
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }
}
/* === end final adaptive left panels === */


/* === Video tab unified layout with generator pages === */
.video-generation-workspace{
  width:100%;
  max-width:100%;
  gap:16px;
  align-items:stretch;
}

.video-generation-card,
.video-preview-card{
  border-radius:18px;
  padding:16px;
  box-sizing:border-box;
  min-height:0;
}

.video-generation-card{
  height:calc(100vh - 170px);
  max-height:calc(100vh - 170px);
  overflow:auto;
}

.video-preview-card{
  height:calc(100vh - 170px);
  max-height:calc(100vh - 170px);
  overflow:auto;
}

.video-prompt-input{
  min-height:120px;
}


/* === Stage 1: video generation uses the common left/right generator shell === */
body.social-page .generation-logo-workspace.video-generation-shell.marketplace-workspace-no-stage{
  grid-template-columns:320px minmax(0,1fr) !important;
  gap:28px !important;
  height:calc(100vh - 78px) !important;
  min-height:0 !important;
  align-items:stretch !important;
  padding-bottom:28px !important;
  box-sizing:border-box !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .gen-preview-editor{
  height:100% !important;
  min-height:0 !important;
  max-height:100% !important;
  overflow:hidden !important;
  display:flex !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card{
  width:100% !important;
  height:100% !important;
  max-height:100% !important;
  min-height:0 !important;
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-gutter:stable !important;
  border-radius:18px !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .gen-preview-gallery{
  min-width:0 !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
}

body.social-page .generation-logo-workspace.video-generation-shell [data-dynamic-card-zone]{
  min-height:0 !important;
  overflow:auto !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-preview-card{
  width:100% !important;
  box-sizing:border-box !important;
  border-radius:18px !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-prompt-input{
  flex:0 0 auto !important;
  min-height:150px !important;
  max-height:220px !important;
}

@media(max-width:1100px){
  body.social-page .generation-logo-workspace.video-generation-shell.marketplace-workspace-no-stage{
    grid-template-columns:300px minmax(0,1fr) !important;
  }
}

@media(max-width:760px){
  body.social-page .generation-logo-workspace.video-generation-shell.marketplace-workspace-no-stage{
    grid-template-columns:1fr !important;
    height:auto !important;
    padding-bottom:22px !important;
  }
  body.social-page .generation-logo-workspace.video-generation-shell .gen-preview-editor,
  body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card{
    height:auto !important;
    max-height:none !important;
  }
}


/* === Restore marketplace video card after adaptive stage === */
body.social-page.social-zone-marketplace .marketplace-editor.gen-preview38-editor{
  height:auto !important;
  max-height:none !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}

body.social-page.social-zone-marketplace .marketplace-editor.gen-preview38-editor .gen-preview-editor,
body.social-page.social-zone-marketplace .marketplace-editor.gen-preview38-editor [data-dynamic-card-zone]{
  min-height:0 !important;
  overflow:visible !important;
}

/* === Stage 5: final video visual adaptation (scoped only to video tab) === */
body.social-page .generation-logo-workspace.video-generation-shell.marketplace-workspace-no-stage{
  height:calc(100vh - 88px) !important;
  padding-bottom:10px !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .gen-preview-editor{
  overflow:visible !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card{
  border-radius:18px !important;
  height:100% !important;
  max-height:100% !important;
  padding-bottom:16px !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-preview-card{
  height:100% !important;
  max-height:100% !important;
  overflow:hidden !important;
}

body.social-page .generation-logo-workspace.video-generation-shell [data-dynamic-card-zone]{
  overflow:auto !important;
}

/* === end Stage 5 === */

/* === Video generation gallery tabs: My videos / All videos === */
.video-generation-shell .video-gallery-grid{
  align-content:start;
}
.video-generation-shell .video-current-card .social-grid-footer{
  justify-content:space-between;
  gap:8px;
  padding-inline:8px;
}
.video-generation-shell .video-current-title{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  color:var(--social-muted,#777);
}
.video-generation-shell .video-current-download{
  flex:0 0 auto;
  border:0;
  background:transparent;
  color:inherit;
  font-size:12px;
  font-weight:700;
  text-decoration:none;
}
.video-generation-shell .video-current-download:hover{text-decoration:underline}
/* === end video generation gallery tabs === */

/* === Stage 5.2: video prompt panel like logo generator === */
body.social-video-mode .video-generation-card{
  border:none !important;
  box-shadow:none !important;
  background:transparent !important;
  padding:0 !important;
}
body.social-video-mode .video-prompt-panel{
  width:100%;
  border:none !important;
  box-shadow:none !important;
  border-radius:14px !important;
  background:rgba(229,231,235,.55) !important;
  padding:16px 12px 14px !important;
  color:#111827;
  display:grid;
  gap:12px;
}
body.social-video-mode .video-prompt-head{
  margin:0 !important;
  color:#111827 !important;
}
body.social-video-mode .video-prompt-input{
  width:100% !important;
  min-height:150px !important;
  max-height:260px !important;
  resize:none !important;
  border:none !important;
  outline:none !important;
  box-shadow:none !important;
  background:transparent !important;
  color:#111827 !important;
  padding:12px 8px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-width:thin !important;
  scrollbar-color:#b8bec8 transparent !important;
}
body.social-video-mode .video-prompt-input:focus{
  border:none !important;
  box-shadow:none !important;
}
body.social-video-mode .video-prompt-input::-webkit-scrollbar,
body.social-video-mode .video-generation-card::-webkit-scrollbar{
  width:6px !important;
  height:6px !important;
}
body.social-video-mode .video-prompt-input::-webkit-scrollbar-track,
body.social-video-mode .video-generation-card::-webkit-scrollbar-track{
  background:transparent !important;
}
body.social-video-mode .video-prompt-input::-webkit-scrollbar-thumb,
body.social-video-mode .video-generation-card::-webkit-scrollbar-thumb{
  background:#b8bec8 !important;
  border-radius:999px !important;
}
body.social-video-mode .video-prompt-input::-webkit-scrollbar-thumb:hover,
body.social-video-mode .video-generation-card::-webkit-scrollbar-thumb:hover{
  background:#9ca3af !important;
}
body.social-video-mode .video-options-grid,
body.social-video-mode .video-effects-panel,
body.social-video-mode .video-upload-grid,
body.social-video-mode .video-generation-actions{
  margin-left:0 !important;
  margin-right:0 !important;
}
body.social-page.social-dark.social-video-mode .video-prompt-panel{
  background:rgba(255,255,255,.08) !important;
  color:#f9fafb !important;
}
body.social-page.social-dark.social-video-mode .video-prompt-head,
body.social-page.social-dark.social-video-mode .video-prompt-input,
body.social-page.social-dark.social-video-mode .gen-desc-counter{
  color:#f9fafb !important;
}
body.social-page.social-dark.social-video-mode .video-prompt-input,
body.social-page.social-dark.social-video-mode .video-generation-card{
  scrollbar-color:#4b5563 transparent !important;
}
body.social-page.social-dark.social-video-mode .video-prompt-input::-webkit-scrollbar-thumb,
body.social-page.social-dark.social-video-mode .video-generation-card::-webkit-scrollbar-thumb{
  background:#4b5563 !important;
}
/* === end Stage 5.2 video prompt panel === */

/* === Stage 5.3: video generator static gray panel + marketplace scrollbar === */
body.social-video-mode .video-generation-card{
  background:#F7F7F8 !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:18px !important;
  padding:18px 16px 14px !important;
  box-sizing:border-box !important;
  display:flex !important;
  flex-direction:column !important;
  gap:14px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain !important;
  scrollbar-gutter:stable !important;
  scrollbar-width:thin !important;
  scrollbar-color:#b8bec8 transparent !important;
}
body.social-video-mode .video-prompt-panel{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding:0 !important;
  display:grid !important;
  gap:12px !important;
}
body.social-video-mode .video-options-grid,
body.social-video-mode .video-effects-panel,
body.social-video-mode .video-upload-grid,
body.social-video-mode .video-generation-actions{
  flex:0 0 auto !important;
}
body.social-video-mode .video-generation-actions{
  margin-top:2px !important;
  padding-bottom:0 !important;
}
body.social-video-mode .video-prompt-input{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  resize:none !important;
  scrollbar-width:thin !important;
  scrollbar-color:#b8bec8 transparent !important;
}
body.social-video-mode .video-generation-card::-webkit-scrollbar,
body.social-video-mode .video-prompt-input::-webkit-scrollbar{
  width:6px !important;
  height:6px !important;
}
body.social-video-mode .video-generation-card::-webkit-scrollbar-track,
body.social-video-mode .video-prompt-input::-webkit-scrollbar-track{
  background:transparent !important;
}
body.social-video-mode .video-generation-card::-webkit-scrollbar-thumb,
body.social-video-mode .video-prompt-input::-webkit-scrollbar-thumb{
  background:#b8bec8 !important;
  border-radius:999px !important;
}
body.social-video-mode .video-generation-card::-webkit-scrollbar-thumb:hover,
body.social-video-mode .video-prompt-input::-webkit-scrollbar-thumb:hover{
  background:#9ca3af !important;
}
body.social-page.social-dark.social-video-mode .video-generation-card{
  background:#111827 !important;
  scrollbar-color:#4b5563 transparent !important;
}
body.social-page.social-dark.social-video-mode .video-generation-card::-webkit-scrollbar-thumb,
body.social-page.social-dark.social-video-mode .video-prompt-input::-webkit-scrollbar-thumb{
  background:#4b5563 !important;
}
/* === end Stage 5.3 === */

/* Video generation upload rows refinement */
.video-upload-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.video-upload-row-secondary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;grid-column:1/-1;}
.video-generate-btn{background:#2563eb;color:#fff;font-weight:400;}
.video-clear-btn{display:inline-flex;align-items:center;gap:8px;}
.video-clear-btn img{width:18px;height:18px;}
@media(max-width:680px){.video-upload-row-secondary{grid-template-columns:1fr;}}

/* === Stage 5.6: video generator action row, effects checklist, intensity sliders, upload icons === */
body.social-video-mode .video-generation-actions{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:8px !important;
}
body.social-video-mode .video-action-row{
  display:flex !important;
  align-items:center !important;
  gap:4px !important;
  width:100% !important;
}
body.social-video-mode .video-action-row .video-clear-btn{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  padding:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:12px !important;
  border:1px solid rgba(17,24,39,.10) !important;
  background:#fff !important;
  color:#111827 !important;
  font-size:0 !important;
  line-height:0 !important;
  box-shadow:none !important;
}
body.social-video-mode .video-action-row .video-clear-btn img{
  width:18px !important;
  height:18px !important;
  display:block !important;
  margin:0 !important;
  object-fit:contain !important;
}
body.social-video-mode .video-action-row .video-generate-btn{
  flex:1 1 auto !important;
  height:42px !important;
  min-height:42px !important;
  border-radius:12px !important;
  background:#2563eb !important;
  color:#fff !important;
  font-weight:400 !important;
  box-shadow:none !important;
}
body.social-video-mode .video-status{
  width:100% !important;
}
body.social-video-mode .video-effects-panel .video-effect-checks,
body.social-video-mode .video-effects-panel .video-effect-chips{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:4px !important;
}
body.social-video-mode .video-effects-panel .video-effect-chip{
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
  min-height:22px !important;
  padding:2px 3px !important;
  border:0 !important;
  border-radius:8px !important;
  background:transparent !important;
  font-size:11px !important;
  line-height:1.2 !important;
  font-weight:400 !important;
  box-shadow:none !important;
  transform:none !important;
}
body.social-video-mode .video-effects-panel .video-effect-chip:hover{
  background:rgba(127,127,127,.08) !important;
  transform:none !important;
}
body.social-video-mode .video-effects-panel .video-effect-chip.is-selected{
  background:transparent !important;
  border:0 !important;
  font-weight:400 !important;
}
body.social-video-mode .video-effects-panel .video-effect-chip span{
  font-size:11px !important;
  line-height:1.2 !important;
}
body.social-video-mode .video-effects-panel input[data-video-effect-checkbox]{
  appearance:none !important;
  -webkit-appearance:none !important;
  position:relative !important;
  display:inline-grid !important;
  place-items:center !important;
  width:14px !important;
  height:14px !important;
  min-width:14px !important;
  flex:0 0 14px !important;
  margin:0 !important;
  padding:0 !important;
  border:1.5px solid #b8c0cc !important;
  border-radius:50% !important;
  background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%) !important;
  box-sizing:border-box !important;
  cursor:pointer !important;
  line-height:0 !important;
  box-shadow:none !important;
}
body.social-video-mode .video-effects-panel input[data-video-effect-checkbox]:checked{
  border-color:#111827 !important;
  background:#fff !important;
  box-shadow:0 0 0 3px rgba(17,24,39,.08) !important;
}
body.social-video-mode .video-effects-panel input[data-video-effect-checkbox]:checked::after{
  content:'' !important;
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  width:6px !important;
  height:6px !important;
  border-radius:50% !important;
  background:#111827 !important;
  transform:translate(-50%,-50%) !important;
}
body.social-video-mode .video-intensity-row input[type="range"]{
  -webkit-appearance:none !important;
  appearance:none !important;
  width:100% !important;
  height:16px !important;
  background:transparent !important;
  accent-color:#111827 !important;
}
body.social-video-mode .video-intensity-row input[type="range"]::-webkit-slider-runnable-track{
  height:2px !important;
  background:#111827 !important;
  border-radius:999px !important;
}
body.social-video-mode .video-intensity-row input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none !important;
  width:12px !important;
  height:12px !important;
  margin-top:-5px !important;
  border-radius:50% !important;
  border:0 !important;
  background:#111827 !important;
  box-shadow:none !important;
}
body.social-video-mode .video-intensity-row input[type="range"]::-moz-range-track{
  height:2px !important;
  background:#111827 !important;
  border-radius:999px !important;
}
body.social-video-mode .video-intensity-row input[type="range"]::-moz-range-thumb{
  width:12px !important;
  height:12px !important;
  border-radius:50% !important;
  border:0 !important;
  background:#111827 !important;
  box-shadow:none !important;
}
body.social-video-mode .video-upload-zone{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
  min-height:86px !important;
  padding:10px 8px !important;
  text-align:center !important;
  overflow:hidden !important;
}
body.social-video-mode .video-upload-empty.is-download-icon{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:24px !important;
  height:24px !important;
  min-height:24px !important;
  margin:0 auto 2px !important;
  line-height:0 !important;
  overflow:visible !important;
}
body.social-video-mode .video-upload-empty.is-download-icon svg{
  width:22px !important;
  height:22px !important;
  display:block !important;
  flex:0 0 22px !important;
}
body.social-video-mode .video-upload-zone.has-preview .video-upload-empty.is-download-icon{
  display:none !important;
}
body.social-video-mode .video-upload-title{
  display:block !important;
  width:100% !important;
  text-align:center !important;
  font-size:12px !important;
  line-height:1.15 !important;
  font-weight:600 !important;
}
body.social-video-mode .video-upload-zone small{
  display:block !important;
  width:100% !important;
  text-align:center !important;
  font-size:10px !important;
  line-height:1.15 !important;
  max-width:100% !important;
}
body.social-video-mode .video-upload-zone img:not(.video-upload-empty img),
body.social-video-mode .video-upload-zone video{
  width:100% !important;
  max-height:66px !important;
  object-fit:cover !important;
}
body.social-page.social-dark.social-video-mode .video-action-row .video-clear-btn{
  background:#111827 !important;
  border-color:#374151 !important;
  color:#f9fafb !important;
}
body.social-page.social-dark.social-video-mode .video-effects-panel input[data-video-effect-checkbox]{
  background:linear-gradient(180deg,#1f2937 0%,#111827 100%) !important;
  border-color:#5b6472 !important;
}
body.social-page.social-dark.social-video-mode .video-effects-panel input[data-video-effect-checkbox]:checked{
  border-color:#f3f4f6 !important;
  box-shadow:0 0 0 3px rgba(243,244,246,.10) !important;
}
body.social-page.social-dark.social-video-mode .video-effects-panel input[data-video-effect-checkbox]:checked::after,
body.social-page.social-dark.social-video-mode .video-intensity-row input[type="range"]::-webkit-slider-thumb{
  background:#f3f4f6 !important;
}
body.social-page.social-dark.social-video-mode .video-intensity-row input[type="range"]::-webkit-slider-runnable-track,
body.social-page.social-dark.social-video-mode .video-intensity-row input[type="range"]::-moz-range-track{
  background:#f3f4f6 !important;
}
body.social-page.social-dark.social-video-mode .video-intensity-row input[type="range"]::-moz-range-thumb{
  background:#f3f4f6 !important;
}
/* === end Stage 5.6 === */

/* Stage video intensity scales: active only for selected effects */
body.social-video-mode .video-intensity-panel{
  padding-top:10px !important;
  border-top:1px solid rgba(17,24,39,.08) !important;
}
body.social-video-mode .video-intensity-panel .video-effect-group-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  margin-bottom:6px !important;
}
body.social-video-mode .video-intensity-panel .video-effect-group-head b{
  font-size:12px !important;
  line-height:1.2 !important;
  font-weight:700 !important;
  color:#111827 !important;
}
body.social-video-mode .video-intensity-panel .video-effect-group-head small{
  font-size:11px !important;
  line-height:1.2 !important;
  color:#6b7280 !important;
}
body.social-video-mode .video-intensity-row{
  display:grid !important;
  grid-template-columns:96px minmax(118px,1fr) 0 !important;
  align-items:center !important;
  gap:8px !important;
  padding:4px 0 !important;
  min-height:24px !important;
  font-size:11px !important;
  line-height:1.2 !important;
  color:#111827 !important;
}
body.social-video-mode .video-intensity-row > span:first-child{
  font-size:11px !important;
  line-height:1.2 !important;
  color:#111827 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
body.social-video-mode .video-intensity-row b{
  display:none !important;
}
body.social-video-mode .video-intensity-control{
  display:grid !important;
  grid-template-columns:10px 1fr 10px !important;
  align-items:center !important;
  gap:4px !important;
  min-width:0 !important;
}
body.social-video-mode .video-intensity-control i,
body.social-video-mode .video-intensity-control em{
  display:block !important;
  font-style:normal !important;
  font-size:12px !important;
  line-height:1 !important;
  text-align:center !important;
  color:#6b7280 !important;
}
body.social-video-mode .video-intensity-row input[type="range"]{
  -webkit-appearance:none !important;
  appearance:none !important;
  width:100% !important;
  height:18px !important;
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
  accent-color:#111827 !important;
  cursor:pointer !important;
}
body.social-video-mode .video-intensity-row input[type="range"]::-webkit-slider-runnable-track{
  height:17px !important;
  border:0 !important;
  border-radius:0 !important;
  background:
    linear-gradient(#111827,#111827) center/100% 1px no-repeat,
    repeating-linear-gradient(to right, transparent 0, transparent calc(10% - .75px), #111827 calc(10% - .75px), #111827 calc(10% + .75px), transparent calc(10% + .75px), transparent 10%) center/100% 9px no-repeat !important;
}
body.social-video-mode .video-intensity-row input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none !important;
  width:12px !important;
  height:12px !important;
  margin-top:2.5px !important;
  border:0 !important;
  border-radius:50% !important;
  background:#111827 !important;
  box-shadow:0 0 0 1px rgba(255,255,255,.45) !important;
}
body.social-video-mode .video-intensity-row input[type="range"]::-moz-range-track{
  height:17px !important;
  border:0 !important;
  border-radius:0 !important;
  background:
    linear-gradient(#111827,#111827) center/100% 1px no-repeat,
    repeating-linear-gradient(to right, transparent 0, transparent calc(10% - .75px), #111827 calc(10% - .75px), #111827 calc(10% + .75px), transparent calc(10% + .75px), transparent 10%) center/100% 9px no-repeat !important;
}
body.social-video-mode .video-intensity-row input[type="range"]::-moz-range-thumb{
  width:12px !important;
  height:12px !important;
  border:0 !important;
  border-radius:50% !important;
  background:#111827 !important;
  box-shadow:0 0 0 1px rgba(255,255,255,.45) !important;
}
body.social-video-mode .video-intensity-row.is-disabled{
  opacity:1 !important;
}
body.social-video-mode .video-intensity-row.is-disabled > span:first-child,
body.social-video-mode .video-intensity-row.is-disabled .video-intensity-control i,
body.social-video-mode .video-intensity-row.is-disabled .video-intensity-control em{
  color:#9ca3af !important;
}
body.social-video-mode .video-intensity-row.is-disabled input[type="range"]{
  cursor:default !important;
  pointer-events:none !important;
}
body.social-video-mode .video-intensity-row.is-disabled input[type="range"]::-webkit-slider-runnable-track{
  background:
    linear-gradient(#c9cdd3,#c9cdd3) center/100% 1px no-repeat,
    repeating-linear-gradient(to right, transparent 0, transparent calc(10% - .75px), #c9cdd3 calc(10% - .75px), #c9cdd3 calc(10% + .75px), transparent calc(10% + .75px), transparent 10%) center/100% 9px no-repeat !important;
}
body.social-video-mode .video-intensity-row.is-disabled input[type="range"]::-webkit-slider-thumb{
  background:#c9cdd3 !important;
  box-shadow:none !important;
}
body.social-video-mode .video-intensity-row.is-disabled input[type="range"]::-moz-range-track{
  background:
    linear-gradient(#c9cdd3,#c9cdd3) center/100% 1px no-repeat,
    repeating-linear-gradient(to right, transparent 0, transparent calc(10% - .75px), #c9cdd3 calc(10% - .75px), #c9cdd3 calc(10% + .75px), transparent calc(10% + .75px), transparent 10%) center/100% 9px no-repeat !important;
}
body.social-video-mode .video-intensity-row.is-disabled input[type="range"]::-moz-range-thumb{
  background:#c9cdd3 !important;
  box-shadow:none !important;
}
body.social-page.social-dark.social-video-mode .video-intensity-panel .video-effect-group-head b,
body.social-page.social-dark.social-video-mode .video-intensity-row > span:first-child{
  color:#f3f4f6 !important;
}
body.social-page.social-dark.social-video-mode .video-intensity-row input[type="range"]::-webkit-slider-runnable-track,
body.social-page.social-dark.social-video-mode .video-intensity-row input[type="range"]::-moz-range-track{
  background:
    linear-gradient(#f3f4f6,#f3f4f6) center/100% 1px no-repeat,
    repeating-linear-gradient(to right, transparent 0, transparent calc(10% - .75px), #f3f4f6 calc(10% - .75px), #f3f4f6 calc(10% + .75px), transparent calc(10% + .75px), transparent 10%) center/100% 9px no-repeat !important;
}
body.social-page.social-dark.social-video-mode .video-intensity-row input[type="range"]::-webkit-slider-thumb,
body.social-page.social-dark.social-video-mode .video-intensity-row input[type="range"]::-moz-range-thumb{
  background:#f3f4f6 !important;
}
body.social-page.social-dark.social-video-mode .video-intensity-row.is-disabled > span:first-child,
body.social-page.social-dark.social-video-mode .video-intensity-row.is-disabled .video-intensity-control i,
body.social-page.social-dark.social-video-mode .video-intensity-row.is-disabled .video-intensity-control em{
  color:#6b7280 !important;
}
body.social-page.social-dark.social-video-mode .video-intensity-row.is-disabled input[type="range"]::-webkit-slider-runnable-track,
body.social-page.social-dark.social-video-mode .video-intensity-row.is-disabled input[type="range"]::-moz-range-track{
  background:
    linear-gradient(#4b5563,#4b5563) center/100% 1px no-repeat,
    repeating-linear-gradient(to right, transparent 0, transparent calc(10% - .75px), #4b5563 calc(10% - .75px), #4b5563 calc(10% + .75px), transparent calc(10% + .75px), transparent 10%) center/100% 9px no-repeat !important;
}
body.social-page.social-dark.social-video-mode .video-intensity-row.is-disabled input[type="range"]::-webkit-slider-thumb,
body.social-page.social-dark.social-video-mode .video-intensity-row.is-disabled input[type="range"]::-moz-range-thumb{
  background:#4b5563 !important;
}

/* === Stage 5.8: video intensity tick marks refinement === */
body.social-video-mode .video-intensity-row input[type="range"]::-webkit-slider-runnable-track{
  height:18px !important;
  border:0 !important;
  border-radius:0 !important;
  background:
    linear-gradient(#111827,#111827) center/100% 1px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 0% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 10% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 20% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 30% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 40% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 50% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 60% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 70% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 80% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 90% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 100% center/1px 15px no-repeat !important;
}
body.social-video-mode .video-intensity-row input[type="range"]::-moz-range-track{
  height:18px !important;
  border:0 !important;
  border-radius:0 !important;
  background:
    linear-gradient(#111827,#111827) center/100% 1px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 0% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 10% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 20% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 30% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 40% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 50% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 60% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 70% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 80% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 90% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 100% center/1px 15px no-repeat !important;
}
body.social-video-mode .video-intensity-row.is-disabled input[type="range"]::-webkit-slider-runnable-track{
  background:
    linear-gradient(#c9cdd3,#c9cdd3) center/100% 1px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 0% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 10% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 20% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 30% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 40% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 50% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 60% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 70% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 80% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 90% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 100% center/1px 15px no-repeat !important;
}
body.social-video-mode .video-intensity-row.is-disabled input[type="range"]::-moz-range-track{
  background:
    linear-gradient(#c9cdd3,#c9cdd3) center/100% 1px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 0% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 10% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 20% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 30% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 40% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 50% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 60% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 70% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 80% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 90% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 100% center/1px 15px no-repeat !important;
}
body.social-page.social-dark.social-video-mode .video-intensity-row input[type="range"]::-webkit-slider-runnable-track,
body.social-page.social-dark.social-video-mode .video-intensity-row input[type="range"]::-moz-range-track{
  background:
    linear-gradient(#f3f4f6,#f3f4f6) center/100% 1px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 0% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 10% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 20% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 30% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 40% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 50% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 60% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 70% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 80% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 90% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 100% center/1px 15px no-repeat !important;
}
body.social-page.social-dark.social-video-mode .video-intensity-row.is-disabled input[type="range"]::-webkit-slider-runnable-track,
body.social-page.social-dark.social-video-mode .video-intensity-row.is-disabled input[type="range"]::-moz-range-track{
  background:
    linear-gradient(#4b5563,#4b5563) center/100% 1px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 0% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 10% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 20% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 30% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 40% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 50% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 60% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 70% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 80% center/1px 15px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 90% center/1px 9px no-repeat,
    linear-gradient(#9ca3af,#9ca3af) 100% center/1px 15px no-repeat !important;
}
/* === end Stage 5.8 === */

/* === Stage 5.7: video uploads, presets and selects polish === */
body.social-video-mode .video-upload-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
  margin-top:0 !important;
}
body.social-video-mode .video-upload-row-secondary{
  grid-column:1 / -1 !important;
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
}
body.social-video-mode .video-upload-zone{
  min-height:86px !important;
  padding:10px 10px 8px !important;
  border-radius:12px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:6px !important;
  text-align:left !important;
}
body.social-video-mode .video-upload-info{
  display:grid !important;
  gap:3px !important;
  width:100% !important;
  min-width:0 !important;
  align-self:stretch !important;
}
body.social-video-mode .video-upload-title{
  width:100% !important;
  text-align:left !important;
  font-size:12px !important;
  line-height:1.2 !important;
  font-weight:600 !important;
}
body.social-video-mode .video-upload-zone small{
  width:100% !important;
  text-align:left !important;
  font-size:10.5px !important;
  line-height:1.2 !important;
  min-height:24px !important;
}
body.social-video-mode .video-upload-empty{
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
  border:none !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 !important;
  margin-top:auto !important;
  color:#838281 !important;
}
body.social-video-mode .video-upload-empty::before,
body.social-video-mode .video-upload-empty::after{
  display:none !important;
  content:none !important;
}
body.social-video-mode .video-upload-empty svg{
  width:20px !important;
  height:20px !important;
  display:block !important;
  flex:0 0 auto !important;
}
body.social-video-mode .video-upload-zone img,
body.social-video-mode .video-upload-zone video{
  width:100% !important;
  height:58px !important;
  margin-top:4px !important;
  border-radius:9px !important;
  align-self:stretch !important;
}
body.social-video-mode .video-effect-presets button.is-selected{
  background:#2563eb !important;
  border-color:#2563eb !important;
  color:#fff !important;
  font-weight:400 !important;
  transform:none !important;
}
body.social-video-mode .video-effect-presets button.is-selected:hover{
  background:#1d4ed8 !important;
  border-color:#1d4ed8 !important;
  color:#fff !important;
}
body.social-video-mode .video-select-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
  margin-top:0 !important;
}
body.social-video-mode .video-select-field{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  gap:5px !important;
  min-width:0 !important;
}
body.social-video-mode .video-select-current{
  width:100% !important;
  height:34px !important;
  border:1px solid #d1d5db !important;
  border-radius:10px !important;
  background:#fff !important;
  color:#111827 !important;
  padding:0 8px !important;
  font-size:11.5px !important;
  font-weight:400 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:6px !important;
  min-width:0 !important;
  overflow:hidden !important;
}
body.social-video-mode .video-select-current span:first-child{
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
body.social-video-mode .video-select-current .marketplace-category-arrow{
  flex:0 0 auto !important;
}
body.social-video-mode .video-select-field.open .marketplace-category-arrow{
  transform:rotate(180deg) !important;
}
body.social-video-mode .video-select-menu{
  display:none !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:calc(100% + 2px) !important;
  bottom:auto !important;
  min-width:100% !important;
  max-height:190px !important;
  overflow:auto !important;
  z-index:40 !important;
  background:#fff !important;
  border:1px solid #d1d5db !important;
  border-radius:12px !important;
  padding:5px !important;
  box-shadow:0 10px 30px rgba(15,23,42,.12) !important;
}
body.social-video-mode .video-select-field.open .video-select-menu{
  display:block !important;
}
body.social-video-mode .video-select-menu button{
  width:100% !important;
  border:0 !important;
  background:transparent !important;
  color:#374151 !important;
  border-radius:10px !important;
  padding:7px 8px !important;
  text-align:left !important;
  display:flex !important;
  align-items:center !important;
  font-size:12px !important;
  line-height:1.2 !important;
  font-weight:400 !important;
  cursor:pointer !important;
}
body.social-video-mode .video-select-menu button:hover{
  background:#f3f4f6 !important;
  color:#111827 !important;
}
body.social-video-mode .video-select-menu button.active{
  background:#111827 !important;
  color:#fff !important;
}
body.social-video-mode .video-select-menu button span{
  min-width:0 !important;
  white-space:normal !important;
  overflow:hidden !important;
  text-overflow:clip !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
  line-clamp:2 !important;
}
body.social-page.social-dark.social-video-mode .video-select-current,
body.social-page.social-dark.social-video-mode .video-select-menu{
  background:#111827 !important;
  color:#e5e7eb !important;
  border-color:#374151 !important;
}
body.social-page.social-dark.social-video-mode .video-select-menu button{
  color:#e5e7eb !important;
}
body.social-page.social-dark.social-video-mode .video-select-menu button:hover{
  background:#1f2937 !important;
  color:#fff !important;
}
body.social-page.social-dark.social-video-mode .video-select-menu button.active{
  background:#e5e7eb !important;
  color:#111827 !important;
}
@media (max-width:680px){
  body.social-video-mode .video-select-grid,
  body.social-video-mode .video-upload-grid,
  body.social-video-mode .video-upload-row-secondary{
    grid-template-columns:1fr !important;
  }
}
/* === end Stage 5.7 === */


/* === Stage 5.9: video effect hints and select menu polish === */
body.social-video-mode .video-effect-presets button{
  position:relative !important;
}
body.social-video-mode .video-effect-presets button:hover::after{
  content:attr(title) !important;
  position:absolute !important;
  left:50% !important;
  bottom:calc(100% + 8px) !important;
  transform:translateX(-50%) !important;
  background:#fff6b8 !important;
  border:1px solid #c89b00 !important;
  border-radius:8px !important;
  color:#111 !important;
  padding:6px 10px !important;
  font-size:12px !important;
  font-weight:400 !important;
  white-space:nowrap !important;
  z-index:80 !important;
  pointer-events:none !important;
}
/* shorter visual scrollbar in description panel */
body.social-video-mode .video-prompt-panel,
body.social-video-mode .video-effects-body{
  scrollbar-width:thin !important;
}
body.social-video-mode .video-prompt-panel::-webkit-scrollbar,
body.social-video-mode .video-effects-body::-webkit-scrollbar{
  width:7px !important;
}
body.social-video-mode .video-prompt-panel::-webkit-scrollbar-thumb,
body.social-video-mode .video-effects-body::-webkit-scrollbar-thumb{
  border-radius:10px !important;
  background:#b8b8b8 !important;
  margin-top:6px !important;
  margin-bottom:6px !important;
}


/* Video effect custom tooltips */
.video-hover-tip{
  position:fixed;
  width:210px;
  max-width:210px;
  box-sizing:border-box;
  padding:10px 12px;
  background:#fff4b8;
  border:1px solid #b58a00;
  border-radius:10px;
  color:#111 !important;
  font-size:12px;
  font-weight:400;
  line-height:1.35;
  text-align:left;
  white-space:normal;
  overflow-wrap:break-word;
  word-break:normal;
  pointer-events:none;
  opacity:0;
  visibility:hidden;
  z-index:2147483647;
  box-shadow:none;
}
.video-hover-tip.show{
  opacity:1;
  visibility:visible;
}
.video-effect-presets button[data-video-tip],
.video-effect-chip[data-video-tip]{
  position:relative;
}



/* Панель разработчика: изолированные стили, не затрагивают рабочие вкладки */
.social-dev-btn{border:1px solid rgba(17,24,39,.12);background:rgba(255,255,255,.82);color:#111827;border-radius:999px;padding:10px 14px;font-weight:700;font-size:13px;line-height:1;cursor:pointer;white-space:nowrap;box-shadow:0 8px 24px rgba(15,23,42,.06);transition:.18s ease}
.social-dev-btn:hover{transform:translateY(-1px);box-shadow:0 12px 30px rgba(15,23,42,.10)}
body.dark .social-dev-btn,.dark-theme .social-dev-btn{background:rgba(17,24,39,.72);color:#f9fafb;border-color:rgba(255,255,255,.16)}
.dev-panel-modal{position:fixed;inset:0;display:none;z-index:1000000;color:#111827}
.dev-panel-modal.show{display:block}
.dev-panel-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.52);backdrop-filter:blur(8px)}
.dev-panel-window{position:absolute;right:24px;top:24px;bottom:24px;width:min(760px,calc(100vw - 48px));display:flex;flex-direction:column;border-radius:24px;background:#fff;box-shadow:0 28px 80px rgba(15,23,42,.28);overflow:hidden;border:1px solid rgba(15,23,42,.10)}
.dev-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 22px 14px;border-bottom:1px solid rgba(15,23,42,.08)}
.dev-panel-title{font-size:22px;font-weight:900;letter-spacing:-.02em}.dev-panel-subtitle{margin-top:4px;color:#6b7280;font-size:13px}.dev-panel-close{border:0;background:rgba(15,23,42,.06);width:36px;height:36px;border-radius:50%;font-size:24px;line-height:1;cursor:pointer;color:inherit}.dev-panel-toolbar{display:flex;align-items:center;gap:10px;padding:12px 22px;border-bottom:1px solid rgba(15,23,42,.08)}.dev-panel-action{border:1px solid rgba(15,23,42,.12);background:#f9fafb;border-radius:12px;padding:8px 12px;font-weight:800;cursor:pointer}.dev-panel-count{margin-left:auto;color:#6b7280;font-size:13px}.dev-panel-list{flex:1;overflow:auto;padding:14px 22px 22px;background:#f8fafc;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}.dev-panel-empty{color:#6b7280;padding:20px;text-align:center}.dev-log-entry{background:#fff;border:1px solid rgba(15,23,42,.08);border-left:4px solid #94a3b8;border-radius:14px;padding:10px 12px;margin-bottom:10px;white-space:pre-wrap;word-break:break-word}.dev-log-entry.error{border-left-color:#ef4444}.dev-log-entry.api{border-left-color:#3b82f6}.dev-log-entry.video{border-left-color:#8b5cf6}.dev-log-entry.success{border-left-color:#22c55e}.dev-log-meta{display:flex;gap:10px;align-items:center;margin-bottom:6px;color:#475569;font-weight:800}.dev-log-type{text-transform:uppercase;color:#111827}.dev-log-data{margin-top:8px;color:#334155;background:#f1f5f9;border-radius:10px;padding:8px;max-height:220px;overflow:auto}
body.dark .dev-panel-window,.dark-theme .dev-panel-window{background:#111827;color:#f9fafb;border-color:rgba(255,255,255,.12)}body.dark .dev-panel-head,body.dark .dev-panel-toolbar,.dark-theme .dev-panel-head,.dark-theme .dev-panel-toolbar{border-color:rgba(255,255,255,.10)}body.dark .dev-panel-subtitle,body.dark .dev-panel-count,.dark-theme .dev-panel-subtitle,.dark-theme .dev-panel-count{color:#9ca3af}body.dark .dev-panel-close,body.dark .dev-panel-action,.dark-theme .dev-panel-close,.dark-theme .dev-panel-action{background:rgba(255,255,255,.08);color:#f9fafb;border-color:rgba(255,255,255,.14)}body.dark .dev-panel-list,.dark-theme .dev-panel-list{background:#0b1220}.dark-theme .dev-log-entry,body.dark .dev-log-entry{background:#111827;border-color:rgba(255,255,255,.10)}body.dark .dev-log-type,.dark-theme .dev-log-type{color:#f9fafb}body.dark .dev-log-data,.dark-theme .dev-log-data{background:#0b1220;color:#d1d5db}

.dev-sent-prompt{padding:14px 22px;border-bottom:1px solid rgba(15,23,42,.08);background:#fff}
.dev-sent-prompt-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:10px}
.dev-sent-prompt-title{font-size:15px;font-weight:900;color:#111827}
.dev-sent-prompt-meta{margin-top:3px;font-size:12px;color:#64748b}
.dev-sent-prompt-text{margin:0;max-height:280px;overflow:auto;white-space:pre-wrap;word-break:break-word;padding:12px 14px;border-radius:12px;background:#f1f5f9;color:#0f172a;font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;border:1px solid rgba(15,23,42,.08)}
body.dark .dev-sent-prompt,.dark-theme .dev-sent-prompt{background:#111827;border-color:rgba(255,255,255,.10)}
body.dark .dev-sent-prompt-title,.dark-theme .dev-sent-prompt-title{color:#f9fafb}
body.dark .dev-sent-prompt-meta,.dark-theme .dev-sent-prompt-meta{color:#9ca3af}
body.dark .dev-sent-prompt-text,.dark-theme .dev-sent-prompt-text{background:#0b1220;color:#d1d5db;border-color:rgba(255,255,255,.10)}
@media (max-width:720px){.dev-panel-window{left:12px;right:12px;top:12px;bottom:12px;width:auto;border-radius:18px}.social-dev-btn{padding:9px 11px;font-size:12px}}


/* Patch 311: generated video posters always fill the whole preview card.
   The poster itself is extracted from frame 0 of the completed MP4. */
body.social-page .video-gallery-grid .social-grid-media > img,
body.social-page .video-current-card .social-grid-media > img{
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
}


/* Patch 316: video tab uses the same unified scrollbar as “Мои логотипы”.
   The unified bar controls only the generated-video gallery; the description/settings panel stays fixed. */
body.social-page.social-video-mode .generation-logo-workspace.video-generation-shell .video-generation-card{
  overflow-y:hidden !important;
  overflow-x:hidden !important;
  scrollbar-width:none !important;
}
body.social-page.social-video-mode .generation-logo-workspace.video-generation-shell .video-generation-card::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}
body.social-page.social-video-mode .generation-logo-workspace.video-generation-shell [data-dynamic-card-zone]{
  height:100% !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  overscroll-behavior:contain !important;
  scrollbar-width:none !important;
}
body.social-page.social-video-mode .generation-logo-workspace.video-generation-shell [data-dynamic-card-zone]::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}


/* Patch 318: the unified scrollbar is a real fixed UI element and stays visible.
   It controls the active scroll owner; in video mode that owner is the generated-video gallery. */
#unifiedScrollTrack{
  position:fixed !important;
  top:96px !important;
  bottom:18px !important;
  right:5px !important;
  width:6px !important;
  height:auto !important;
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  overflow:hidden !important;
  border-radius:999px !important;
  background:rgba(120,120,120,.12) !important;
  z-index:2147483000 !important;
  pointer-events:none !important;
}
#unifiedScrollThumb{
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  width:6px !important;
  min-height:42px !important;
  border-radius:999px !important;
  background:#8a8a8a !important;
  box-shadow:0 0 0 1px rgba(255,255,255,.18) inset !important;
  pointer-events:auto !important;
  cursor:grab !important;
  touch-action:none !important;
}
body.social-page.social-dark #unifiedScrollTrack{
  background:rgba(255,255,255,.12) !important;
}
body.social-page.social-dark #unifiedScrollThumb{
  background:#a7a7a7 !important;
}


/* Patch 319: one scrollbar everywhere — identical to “Все логотипы”.
   Native thin scrollbars are hidden only on the main/gallery scroll owners.
   The single fixed #unifiedScrollTrack remains the only visible page scrollbar. */
html.social-page,
body.social-page,
body.social-page .social-main,
body.social-page #socialGrid,
body.social-page #socialGrid.is-grid,
body.social-page .generation-logo-workspace [data-dynamic-card-zone],
body.social-page .generation-logo-workspace .gen-preview-gallery,
body.social-page .generation-logo-workspace .gen-gallery-grid,
body.social-page.social-video-mode .video-generation-shell [data-dynamic-card-zone],
body.social-page.social-video-mode .video-generation-shell .gen-preview-gallery,
body.social-page.social-video-mode .video-generation-shell .video-gallery-grid {
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
html.social-page::-webkit-scrollbar,
body.social-page::-webkit-scrollbar,
body.social-page .social-main::-webkit-scrollbar,
body.social-page #socialGrid::-webkit-scrollbar,
body.social-page #socialGrid.is-grid::-webkit-scrollbar,
body.social-page .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar,
body.social-page .generation-logo-workspace .gen-preview-gallery::-webkit-scrollbar,
body.social-page .generation-logo-workspace .gen-gallery-grid::-webkit-scrollbar,
body.social-page.social-video-mode .video-generation-shell [data-dynamic-card-zone]::-webkit-scrollbar,
body.social-page.social-video-mode .video-generation-shell .gen-preview-gallery::-webkit-scrollbar,
body.social-page.social-video-mode .video-generation-shell .video-gallery-grid::-webkit-scrollbar {
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* Same geometry in every tab, including video generation. */
#unifiedScrollTrack{
  position:fixed !important;
  top:96px !important;
  bottom:18px !important;
  right:5px !important;
  width:6px !important;
  height:auto !important;
  min-height:42px !important;
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  z-index:2147483000 !important;
  border-radius:999px !important;
  overflow:hidden !important;
  background:rgba(120,120,120,.12) !important;
  pointer-events:none !important;
}
#unifiedScrollThumb{
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  width:6px !important;
  min-height:42px !important;
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  border-radius:999px !important;
  background:#8a8a8a !important;
  pointer-events:auto !important;
  cursor:grab !important;
}

/* Patch 320: extend the existing Unified Scroll without creating a second scrollbar. */
#unifiedScrollTrack{
  width:12px !important;
  overflow:visible !important;
  background:transparent !important;
  border-radius:0 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:3px !important;
  pointer-events:auto !important;
}
#unifiedScrollRail{
  position:relative !important;
  flex:1 1 auto !important;
  min-height:42px !important;
  width:12px !important;
  overflow:hidden !important;
  border-radius:999px !important;
  background:rgba(120,120,120,.12) !important;
}
#unifiedScrollThumb{
  width:12px !important;
  left:0 !important;
  border-radius:999px !important;
}
#unifiedScrollUp,
#unifiedScrollDown{
  flex:0 0 24px !important;
  width:24px !important;
  height:24px !important;
  min-width:24px !important;
  min-height:24px !important;
  margin-left:-6px !important;
  padding:0 !important;
  border:0 !important;
  outline:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:transparent !important;
  color:#737373 !important;
  font:700 16px/1 Arial,sans-serif !important;
  cursor:pointer !important;
  user-select:none !important;
  -webkit-user-select:none !important;
  transition:opacity .15s ease,color .15s ease !important;
}
#unifiedScrollUp:hover,
#unifiedScrollDown:hover{
  background:transparent !important;
  color:#4f4f4f !important;
  opacity:1 !important;
}
#unifiedScrollUp:focus,
#unifiedScrollDown:focus,
#unifiedScrollUp:focus-visible,
#unifiedScrollDown:focus-visible{
  outline:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}
#unifiedScrollUp:disabled,
#unifiedScrollDown:disabled{
  opacity:.55 !important;
  cursor:default !important;
}
body.social-page.social-dark #unifiedScrollRail{
  background:rgba(255,255,255,.12) !important;
}
body.social-page.social-dark #unifiedScrollUp,
body.social-page.social-dark #unifiedScrollDown{
  color:#a7a7a7 !important;
}

/* Patch 321: keep the normal arrow cursor on Unified Scroll while preserving drag behavior. */
#unifiedScrollTrack,
#unifiedScrollRail,
#unifiedScrollThumb,
#unifiedScrollThumb:hover,
#unifiedScrollThumb:active {
  cursor:default !important;
}

/* Patch 322: Unified Scroll cosmetic refinement only — about 10% thinner and lighter. */
#unifiedScrollTrack{
  width:11px !important;
}
#unifiedScrollRail{
  width:11px !important;
  background:rgba(120,120,120,.108) !important;
}
#unifiedScrollThumb{
  width:11px !important;
  background:#969696 !important;
}
#unifiedScrollUp,
#unifiedScrollDown{
  flex-basis:22px !important;
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
  min-height:22px !important;
  margin-left:-5.5px !important;
  color:#818181 !important;
  font-size:15px !important;
}
#unifiedScrollUp:hover,
#unifiedScrollDown:hover{
  color:#616161 !important;
}
body.social-page.social-dark #unifiedScrollRail{
  background:rgba(255,255,255,.108) !important;
}
body.social-page.social-dark #unifiedScrollUp,
body.social-page.social-dark #unifiedScrollDown{
  color:#b0b0b0 !important;
}


/* Patch 323: Generation Logo uses only the existing Unified Scroll.
   Override the older high-specificity native thin-scrollbar rule on the card zone. */
body.social-page.social-zone-generate .generation-logo-workspace.logo-generation-shell [data-dynamic-card-zone],
body.social-page.social-zone-generate .generation-logo-workspace[data-generator-shell="stable"] [data-dynamic-card-zone]{
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
  padding-right:0 !important;
}
body.social-page.social-zone-generate .generation-logo-workspace.logo-generation-shell [data-dynamic-card-zone]::-webkit-scrollbar,
body.social-page.social-zone-generate .generation-logo-workspace[data-generator-shell="stable"] [data-dynamic-card-zone]::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* Patch 325: Unified Scroll color and arrow shape only. */
#unifiedScrollThumb,
#unifiedScrollThumb:hover,
#unifiedScrollThumb:active,
body.social-page.social-dark #unifiedScrollThumb{
  background:#B8BEC8 !important;
}
#unifiedScrollUp,
#unifiedScrollDown,
#unifiedScrollUp:hover,
#unifiedScrollDown:hover,
#unifiedScrollUp:active,
#unifiedScrollDown:active,
body.social-page.social-dark #unifiedScrollUp,
body.social-page.social-dark #unifiedScrollDown{
  color:#B8BEC8 !important;
  transform:scaleY(.88) !important;
  transform-origin:center !important;
}

/* Video effects modal: replaces inline expansion in the video description panel. */
.video-effects-launcher .video-effects-title{margin-bottom:0;width:100%}
.video-effects-launcher .video-effects-selected{margin-top:8px}
.video-effects-modal{position:fixed;inset:0;z-index:10050;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.48);cursor:default}
.video-effects-modal-backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.48);cursor:default}
.video-effects-modal-dialog{position:relative;z-index:1;width:min(760px,calc(100vw - 32px));max-height:min(820px,calc(100vh - 40px));display:flex;flex-direction:column;border:1px solid rgba(130,130,130,.32);border-radius:20px;background:var(--social-card,#fff);box-shadow:0 24px 80px rgba(0,0,0,.28);overflow:hidden}
.video-effects-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid rgba(130,130,130,.2)}
.video-effects-modal-head>div{display:grid;gap:4px}.video-effects-modal-head b{font-size:18px}.video-effects-modal-head small{font-size:12px;color:var(--social-muted,#777)}
.video-effects-modal-head>button{border:0;background:transparent;font-size:28px;line-height:1;color:inherit;padding:0 2px;cursor:pointer}
.video-effects-modal .video-effects-body{display:block!important;margin:0;padding:18px 20px;overflow:auto;scrollbar-width:none}
.video-effects-modal .video-effects-body::-webkit-scrollbar{display:none}
.video-effects-modal-actions{display:flex;justify-content:flex-end;gap:10px;padding:14px 20px;border-top:1px solid rgba(130,130,130,.2)}
.video-effects-modal-actions button{min-width:110px;border-radius:12px;padding:10px 16px;border:1px solid rgba(130,130,130,.35);background:transparent;color:inherit;font-weight:600;cursor:pointer}
.video-effects-modal-actions [data-video-effects-save]{background:#111;color:#fff;border-color:#111}
body.social-dark .video-effects-modal-dialog{background:#1f1f1f;border-color:rgba(255,255,255,.18)}
body.social-dark .video-effects-modal-actions [data-video-effects-save]{background:#f2f2f2;color:#111;border-color:#f2f2f2}
@media(max-width:680px){.video-effects-modal{padding:8px}.video-effects-modal-dialog{width:calc(100vw - 16px);max-height:calc(100vh - 16px);border-radius:16px}.video-effects-modal-head,.video-effects-modal .video-effects-body,.video-effects-modal-actions{padding-left:14px;padding-right:14px}}


/* === Video effects modal — preview-matched card layout (social 321) === */
body:has(.video-effects-modal){overflow:hidden!important}
.video-effects-modal{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  z-index:2147483000!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:24px!important;
  box-sizing:border-box!important;
  isolation:isolate!important;
}
.video-effects-modal-backdrop{
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100dvh!important;
  z-index:0!important;
  display:block!important;
  border:0!important;
  border-radius:0!important;
  background:rgba(15,18,24,.58)!important;
  backdrop-filter:blur(1.5px)!important;
  -webkit-backdrop-filter:blur(1.5px)!important;
  padding:0!important;
  margin:0!important;
}
.video-effects-modal-dialog{
  position:relative!important;
  z-index:1!important;
  width:min(1220px,calc(100vw - 48px))!important;
  max-width:1220px!important;
  height:auto!important;
  max-height:calc(100dvh - 48px)!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  color:#111!important;
  background:#fff!important;
  border:1px solid #e1e4e8!important;
  border-radius:20px!important;
  box-shadow:0 28px 90px rgba(0,0,0,.34),0 3px 14px rgba(0,0,0,.12)!important;
}
.video-effects-modal-head{
  flex:0 0 auto!important;
  min-height:72px!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:20px!important;
  padding:18px 22px 16px!important;
  border-bottom:1px solid #e4e6e9!important;
  background:#fff!important;
}
.video-effects-modal-head b{
  display:block!important;
  font-size:24px!important;
  line-height:1.2!important;
  font-weight:800!important;
  color:#0b0b0c!important;
}
.video-effects-modal-head>button{
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  display:grid!important;
  place-items:center!important;
  padding:0 0 3px!important;
  margin:-8px -2px 0 0!important;
  border:1px solid #d9dde2!important;
  border-radius:7px!important;
  background:#f6f7f8!important;
  color:#8b9097!important;
  font-size:31px!important;
  line-height:1!important;
  font-weight:300!important;
  cursor:default!important;
  box-shadow:none!important;
}
.video-effects-modal .video-effects-body{
  flex:1 1 auto!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:10px!important;
  margin:0!important;
  padding:16px 18px 20px!important;
  overflow:auto!important;
  background:#fff!important;
  scrollbar-width:none!important;
}
.video-effects-modal .video-effects-body::-webkit-scrollbar{display:none!important}
.video-effects-modal .video-effect-presets{
  grid-column:1/-1!important;
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin:0 0 2px!important;
}
.video-effects-modal .video-effect-presets button{
  padding:6px 12px!important;
  border:1px solid #dfe3e8!important;
  border-radius:999px!important;
  background:#f7f8f9!important;
  color:#111!important;
  font-size:12px!important;
  line-height:1.15!important;
  font-weight:500!important;
  transform:none!important;
  box-shadow:none!important;
}
.video-effects-modal .video-effect-presets button.is-selected{
  border-color:#b9c1cc!important;
  background:#eef1f4!important;
  font-weight:700!important;
}
.video-effects-modal .video-effect-group{
  min-width:0!important;
  margin:0!important;
  padding:9px 10px 12px!important;
  border:1px solid #dfe3e8!important;
  border-radius:15px!important;
  background:#f8f9fa!important;
}
.video-effects-modal .video-effect-group-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  margin:0 0 8px!important;
}
.video-effects-modal .video-effect-group-head b{
  color:#111!important;
  font-size:13px!important;
  line-height:1.2!important;
  font-weight:800!important;
}
.video-effects-modal .video-effect-group-head small{
  color:#7d838c!important;
  font-size:10px!important;
  white-space:nowrap!important;
}
.video-effects-modal .video-effect-checks{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:3px!important;
}
.video-effects-modal .video-effect-chip{
  min-height:23px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:7px!important;
  margin:0!important;
  padding:2px 1px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#20242a!important;
  font-size:11px!important;
  line-height:1.25!important;
  font-weight:400!important;
  transform:none!important;
  box-shadow:none!important;
}
.video-effects-modal .video-effect-chip:hover,
.video-effects-modal .video-effect-chip.is-selected{
  border:0!important;
  background:transparent!important;
  color:#111!important;
  font-weight:400!important;
  transform:none!important;
}
.video-effects-modal .video-effect-chip input[type="checkbox"]{
  appearance:none!important;
  -webkit-appearance:none!important;
  flex:0 0 auto!important;
  width:15px!important;
  height:15px!important;
  margin:0!important;
  border:1px solid #bdc6d1!important;
  border-radius:50%!important;
  background:#fff!important;
  box-shadow:none!important;
}
.video-effects-modal .video-effect-chip input[type="checkbox"]:checked{
  border:4px solid #aeb8c4!important;
  background:#1d232b!important;
}
.video-effects-modal .video-effect-chip input[type="checkbox"]::before,
.video-effects-modal .video-effect-chip input[type="checkbox"]::after{display:none!important;content:none!important}
.video-effects-modal .video-intensity-panel{
  grid-column:1/-1!important;
  margin:4px 0 0!important;
  padding:12px!important;
  border:1px solid #dfe3e8!important;
  border-radius:15px!important;
  background:#f8f9fa!important;
}
.video-effects-modal-actions{
  flex:0 0 auto!important;
  min-height:72px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:20px!important;
  padding:14px 18px 16px 24px!important;
  border-top:1px solid #e4e6e9!important;
  background:#fff!important;
}
.video-effects-modal-summary{
  max-width:70%!important;
  color:#707781!important;
  font-size:12px!important;
  line-height:1.4!important;
}
.video-effects-modal-summary b{color:#4e555e!important}
.video-effects-modal-actions [data-video-effects-save]{
  min-width:168px!important;
  padding:11px 17px!important;
  border:1px solid #2366ed!important;
  border-radius:12px!important;
  background:#2d6df6!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:700!important;
  box-shadow:none!important;
  cursor:pointer!important;
}
body.social-dark .video-effects-modal-dialog,
body.social-dark .video-effects-modal-head,
body.social-dark .video-effects-modal .video-effects-body,
body.social-dark .video-effects-modal-actions{background:#fff!important;color:#111!important}
@media(max-width:1100px){
  .video-effects-modal .video-effects-body{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:700px){
  .video-effects-modal{padding:10px!important}
  .video-effects-modal-dialog{width:calc(100vw - 20px)!important;max-height:calc(100dvh - 20px)!important;border-radius:16px!important}
  .video-effects-modal .video-effects-body{grid-template-columns:1fr!important;padding:12px!important}
  .video-effects-modal-head{min-height:62px!important;padding:15px!important}
  .video-effects-modal-head b{font-size:20px!important}
  .video-effects-modal-actions{align-items:stretch!important;flex-direction:column!important;padding:12px 15px!important}
  .video-effects-modal-summary{max-width:none!important}
  .video-effects-modal-actions [data-video-effects-save]{width:100%!important}
}
/* === end video effects modal preview layout === */


/* === Video effects modal opens like the video + chat detail dialog === */
body.video-effects-modal-open{
  overflow:hidden!important;
}
body.video-effects-modal-open .social-main,
body.video-effects-modal-open #socialGrid,
body.video-effects-modal-open .video-generation-shell,
body.video-effects-modal-open .video-generation-card{
  transform:none!important;
  filter:none!important;
  perspective:none!important;
  contain:none!important;
}
.video-effects-modal{
  position:fixed!important;
  inset:0!important;
  z-index:2147483600!important;
  display:block!important;
  width:auto!important;
  height:auto!important;
  padding:24px!important;
  overflow:auto!important;
  background:rgba(15,23,42,.42)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  animation:videoEffectsOverlayIn .16s ease-out both!important;
}
.video-effects-modal-backdrop{
  position:fixed!important;
  inset:0!important;
  z-index:0!important;
  width:100%!important;
  height:100%!important;
  border:0!important;
  background:transparent!important;
}
.video-effects-modal-dialog{
  position:relative!important;
  z-index:1!important;
  width:min(1220px,100%)!important;
  max-width:1220px!important;
  max-height:none!important;
  min-height:min(720px,calc(100dvh - 48px))!important;
  margin:auto!important;
  border-radius:22px!important;
  background:#fff!important;
  overflow:hidden!important;
  box-shadow:0 24px 70px rgba(15,23,42,.22)!important;
  animation:videoEffectsDialogIn .18s ease-out both!important;
}
@keyframes videoEffectsOverlayIn{
  from{opacity:0}
  to{opacity:1}
}
@keyframes videoEffectsDialogIn{
  from{opacity:0;transform:translateY(10px) scale(.992)}
  to{opacity:1;transform:none}
}
@media(max-width:700px){
  .video-effects-modal{padding:12px!important}
  .video-effects-modal-dialog{
    width:100%!important;
    min-height:calc(100dvh - 24px)!important;
    border-radius:18px!important;
  }
}
/* === end video-detail style opening === */


.video-effects-modal [hidden]{display:none!important}
.video-effects-modal .video-effect-chip{
  display:grid!important;
  grid-template-columns:15px minmax(0,1fr) 22px!important;
  align-items:center!important;
  gap:7px!important;
}
.video-effects-modal .video-effect-intensity-arrow{
  width:22px!important;
  height:22px!important;
  display:grid!important;
  place-items:center!important;
  padding:0 0 2px!important;
  margin:0!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  color:#8b939e!important;
  font-size:20px!important;
  line-height:1!important;
  font-weight:400!important;
  cursor:default!important;
  transform:none!important;
  box-shadow:none!important;
}
.video-effects-modal .video-effect-intensity-arrow:hover,
.video-effects-modal .video-effect-intensity-arrow.is-open{
  background:#e9edf2!important;
  color:#313842!important;
}
.video-effects-modal .video-effect-intensity-top{
  grid-column:1/-1!important;
  order:-2!important;
  margin:0 0 4px!important;
  padding:12px 14px!important;
  border:1px solid #dfe3e8!important;
  border-radius:14px!important;
  background:#f8f9fa!important;
}
.video-effects-modal .video-effect-intensity-top-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin-bottom:8px!important;
}
.video-effects-modal .video-effect-intensity-top-head b{
  color:#111!important;
  font-size:13px!important;
  font-weight:800!important;
}
.video-effects-modal .video-effect-intensity-top-head button{
  width:24px!important;
  height:24px!important;
  display:grid!important;
  place-items:center!important;
  padding:0 0 2px!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  color:#7b828c!important;
  font-size:20px!important;
  line-height:1!important;
  cursor:default!important;
}
.video-effects-modal .video-effect-intensity-top .video-intensity-row{
  display:grid!important;
  grid-template-columns:minmax(180px,1fr) 48px!important;
  align-items:center!important;
  gap:12px!important;
  padding:0!important;
}
.video-effects-modal .video-effect-intensity-top .video-intensity-control{
  display:grid!important;
  grid-template-columns:16px minmax(120px,1fr) 16px!important;
  align-items:center!important;
  gap:8px!important;
}
.video-effects-modal .video-effect-intensity-top .video-intensity-row>b{
  text-align:right!important;
  font-size:12px!important;
  color:#626a75!important;
}
.video-effects-modal .video-effect-presets{order:-1!important}
@media(max-width:700px){
  .video-effects-modal .video-effect-intensity-top .video-intensity-row{grid-template-columns:1fr 44px!important}
}
/* === end video effects modal refinements === */



/* === social329: one continuous fullscreen shade for the video-effects modal ===
   A single viewport layer covers both the sidebar and the working area, so there
   is no seam, white strip, or difference in opacity between interface sections. */
body.video-effects-modal-open::before{
  content:"" !important;
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100dvh !important;
  z-index:2147483500 !important;
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:rgba(15,23,42,.42) !important;
  pointer-events:auto !important;
  cursor:default !important;
}
body.video-effects-modal-open .video-effects-modal{
  z-index:2147483600 !important;
  background:transparent !important;
}
body.video-effects-modal-open .video-effects-modal-backdrop{
  background:transparent !important;
}
/* Remove the previous separate sidebar shade. */
body.video-effects-modal-open .social-sidebar::after{
  content:none !important;
  display:none !important;
}
/* === end unified fullscreen shade === */

/* === social330: unified shade inside the modal root ===
   The full-screen modal root provides one continuous shade over the sidebar and
   workspace. The dialog is a child above that shade, so it stays bright and active. */
body.video-effects-modal-open::before{
  content:none !important;
  display:none !important;
  pointer-events:none !important;
}
body.video-effects-modal-open .video-effects-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:2147483600 !important;
  display:block !important;
  background:rgba(15,23,42,.42) !important;
  pointer-events:auto !important;
  isolation:isolate !important;
}
body.video-effects-modal-open .video-effects-modal-backdrop{
  position:fixed !important;
  inset:0 !important;
  z-index:0 !important;
  display:block !important;
  background:transparent !important;
  pointer-events:auto !important;
}
body.video-effects-modal-open .video-effects-modal-dialog{
  position:relative !important;
  z-index:2 !important;
  opacity:1 !important;
  filter:none !important;
  -webkit-filter:none !important;
  pointer-events:auto !important;
}
body.video-effects-modal-open .social-sidebar::after{
  content:none !important;
  display:none !important;
}
/* === end modal-root unified shade === */


/* FINAL video effects modal layer: same concept as video chat */
body.video-effects-modal-open::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:99900;
  background:rgba(15,23,42,.42);
  pointer-events:auto;
}
body.video-effects-modal-open .video-effects-modal{
  position:fixed!important;
  inset:0!important;
  z-index:100000!important;
  display:grid!important;
  place-items:center!important;
  background:transparent!important;
  pointer-events:none!important;
}
body.video-effects-modal-open .video-effects-modal-backdrop{
  display:none!important;
}
body.video-effects-modal-open .video-effects-modal-dialog{
  pointer-events:auto!important;
  position:relative!important;
  z-index:100001!important;
}


/* === final video effects modal background lock === */
.video-effects-modal{
  z-index:2147483640!important;
}
.video-effects-modal-backdrop{
  position:fixed!important;
  inset:0!important;
  z-index:2147483639!important;
  pointer-events:auto!important;
  background:rgba(15,18,24,.50)!important;
}
/* keep only dialog interactive */
.video-effects-modal-dialog{
  position:relative!important;
  z-index:2147483641!important;
  pointer-events:auto!important;
}
.video-effects-modal-backdrop + .video-effects-modal-dialog{
  pointer-events:auto!important;
}

/* Video effects modal uses the shared social modal layer (same as existing app modals). */
body.social-modal-open .video-effects-modal{
  position:fixed!important;
  inset:0!important;
  z-index:100000!important;
  display:grid!important;
  place-items:center!important;
  background:transparent!important;
  pointer-events:none!important;
}
body.social-modal-open .video-effects-modal-dialog{
  position:relative!important;
  z-index:100001!important;
  pointer-events:auto!important;
}
body.social-modal-open .video-effects-modal-backdrop{
  display:none!important;
}


/* social338: full Video Effects functionality inside the working Test modal */
#testModal.test-video-effects-modal{
  z-index:100000!important;
  background:rgba(0,0,0,.58)!important;
  backdrop-filter:none!important;
  padding:20px!important;
}
#testModal .test-video-effects-host{
  width:min(1220px,calc(100vw - 48px));
  max-height:calc(100dvh - 48px);
  display:flex;
  align-items:center;
  justify-content:center;
}
#testModal .video-effects-modal-dialog{
  position:relative!important;
  z-index:1!important;
  width:100%!important;
  max-height:calc(100dvh - 40px)!important;
  margin:0!important;
}
body.social-modal-open{overflow:hidden!important;}
@media(max-width:680px){
  #testModal.test-video-effects-modal{padding:8px!important;}
  #testModal .test-video-effects-host{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);}
  #testModal .video-effects-modal-dialog{max-height:calc(100dvh - 16px)!important;}
}

/* social338: keep Test menu item explicitly interactive */
#testMenuBtn{pointer-events:auto!important;cursor:pointer!important;position:relative!important;z-index:2!important;}
#testMenuBtn *{pointer-events:none!important;}

/* social338 HTML direct Test button/modal fix */
#testMenuBtn{
  display:flex!important;
  width:100%!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  position:relative!important;
  z-index:20!important;
}
#testModal.open{
  display:grid!important;
  position:fixed!important;
  inset:0!important;
  z-index:2147483646!important;
  pointer-events:auto!important;
  place-items:center!important;
  background:rgba(0,0,0,.62)!important;
}
#testModal.open .test-video-effects-host{pointer-events:auto!important;}

/* social338: simple Test modal (video effects removed) */
#testModal .test-modal-dialog{
  width:min(520px,calc(100vw - 32px));
  background:#fff;
  color:#111827;
  border-radius:18px;
  box-shadow:0 24px 80px rgba(0,0,0,.28);
  overflow:hidden;
  pointer-events:auto;
}
#testModal .test-modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px 20px;
  border-bottom:1px solid rgba(15,23,42,.12);
  font-size:20px;
}
#testModal .test-modal-head button{
  border:0;
  background:transparent;
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
#testModal .test-modal-body{
  padding:32px 20px;
  font-size:18px;
}


/* social339: Test uses the exact Video Effects modal layout. */
#testModal.open .video-effects-body{
  display:grid!important;
}
#testModal.open .video-effects-modal-dialog{
  width:min(1220px,calc(100vw - 48px))!important;
  max-width:1220px!important;
}
@media(max-width:700px){
  #testModal.open .video-effects-modal-dialog{
    width:calc(100vw - 20px)!important;
  }
}


/* social342: Test modal - match video effects modal design */
#testModal .test-modal-dialog.video-effects-modal-dialog,
#testModal .video-effects-modal-dialog{
  width:min(1220px,calc(100vw - 48px))!important;
  max-width:1220px!important;
  min-height:680px!important;
  background:#fff!important;
  border-radius:24px!important;
  overflow:hidden!important;
  box-shadow:0 24px 80px rgba(0,0,0,.28)!important;
}
#testModal .test-modal-body{
  padding:0!important;
}
#testModal .video-effects-body,
#testModal .test-video-effects-host{
  width:100%;
  height:100%;
}
#testModal .video-effects-content{
  padding:18px 20px 20px;
}
#testModal .video-effects-footer{
  padding:16px 24px!important;
  border-top:1px solid rgba(15,23,42,.12);
}
#testModal .video-effects-categories{
  padding:0 20px;
}
@media(max-width:700px){
 #testModal .test-modal-dialog.video-effects-modal-dialog,
 #testModal .video-effects-modal-dialog{
   width:calc(100vw - 20px)!important;
   min-height:0!important;
 }
}

/* Fix: test modal uses only its own overlay. Video effects is content, not a modal. */
#testModal .video-effects-modal-dialog{
  position:relative;
  z-index:1;
  width:min(1220px,calc(100vw - 40px));
  max-height:calc(100vh - 40px);
}
#testModal .video-effects-body{
  display:block!important;
}


/* === social348: exact Test modal design, isolated from legacy modal CSS === */
#testModal.open{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:24px!important;
  background:rgba(15,18,24,.58)!important;
  overflow:hidden!important;
}
#testModal.open .test-video-effects-host{
  width:min(1220px,calc(100vw - 48px))!important;
  height:auto!important;
  max-height:calc(100dvh - 48px)!important;
  display:block!important;
  overflow:visible!important;
}
#testModal.open .test-effects-shell{
  position:relative!important;
  width:100%!important;
  max-width:none!important;
  height:auto!important;
  min-height:0!important;
  max-height:calc(100dvh - 48px)!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  background:#fff!important;
  color:#111!important;
  border:1px solid #e1e4e8!important;
  border-radius:20px!important;
  box-shadow:0 28px 90px rgba(0,0,0,.34),0 3px 14px rgba(0,0,0,.12)!important;
}
#testModal.open .test-effects-shell .video-effects-modal-head{
  min-height:72px!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  padding:18px 22px 16px!important;
  border-bottom:1px solid #e4e6e9!important;
  background:#fff!important;
}
#testModal.open .test-effects-shell .video-effects-modal-head b{
  font-size:24px!important;
  line-height:1.2!important;
  font-weight:800!important;
  color:#0b0b0c!important;
}
#testModal.open .test-effects-shell .video-effects-modal-head>button{
  width:40px!important;height:40px!important;min-width:40px!important;
  display:grid!important;place-items:center!important;
  margin:-8px -2px 0 0!important;padding:0 0 3px!important;
  border:1px solid #d9dde2!important;border-radius:7px!important;
  background:#f6f7f8!important;color:#8b9097!important;
  font-size:31px!important;line-height:1!important;font-weight:300!important;
  cursor:pointer!important;
}
#testModal.open .test-effects-shell .video-effects-body{
  flex:1 1 auto!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:10px!important;
  margin:0!important;
  padding:16px 18px 20px!important;
  overflow:auto!important;
  background:#fff!important;
  scrollbar-width:none!important;
}
#testModal.open .test-effects-shell .video-effects-body::-webkit-scrollbar{display:none!important}
#testModal.open .test-effects-shell .video-effect-presets{
  grid-column:1/-1!important;display:flex!important;flex-wrap:wrap!important;gap:8px!important;margin:0 0 2px!important;
}
#testModal.open .test-effects-shell .video-effect-presets button{
  padding:6px 12px!important;border:1px solid #dfe3e8!important;border-radius:999px!important;
  background:#f7f8f9!important;color:#111!important;font-size:12px!important;line-height:1.15!important;font-weight:500!important;
}
#testModal.open .test-effects-shell .video-effect-group{
  min-width:0!important;margin:0!important;padding:9px 10px 12px!important;
  border:1px solid #dfe3e8!important;border-radius:15px!important;background:#f8f9fa!important;
}
#testModal.open .test-effects-shell .video-effect-group-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;margin:0 0 8px!important}
#testModal.open .test-effects-shell .video-effect-group-head b{font-size:13px!important;line-height:1.2!important;font-weight:800!important;color:#111!important}
#testModal.open .test-effects-shell .video-effect-group-head small{font-size:10px!important;color:#7d838c!important;white-space:nowrap!important}
#testModal.open .test-effects-shell .video-effect-checks{display:flex!important;flex-direction:column!important;gap:3px!important}
#testModal.open .test-effects-shell .video-effect-chip{
  min-height:23px!important;display:flex!important;align-items:center!important;gap:7px!important;
  margin:0!important;padding:2px 1px!important;border:0!important;background:transparent!important;
  color:#20242a!important;font-size:11px!important;line-height:1.25!important;font-weight:400!important;
}
#testModal.open .test-effects-shell .video-effect-chip input[type="checkbox"]{
  appearance:none!important;-webkit-appearance:none!important;width:15px!important;height:15px!important;margin:0!important;
  border:1px solid #bdc6d1!important;border-radius:50%!important;background:#fff!important;box-shadow:none!important;
}
#testModal.open .test-effects-shell .video-effect-chip input[type="checkbox"]:checked{border:4px solid #aeb8c4!important;background:#1d232b!important}
#testModal.open .test-effects-shell .video-effects-modal-actions{
  min-height:72px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:20px!important;
  padding:14px 18px 16px 24px!important;border-top:1px solid #e4e6e9!important;background:#fff!important;
}
#testModal.open .test-effects-shell .video-effects-modal-summary{max-width:70%!important;color:#707781!important;font-size:12px!important;line-height:1.4!important}
#testModal.open .test-effects-shell [data-video-effects-save]{
  min-width:168px!important;padding:11px 17px!important;border:1px solid #2366ed!important;border-radius:12px!important;
  background:#2d6df6!important;color:#fff!important;font-size:13px!important;font-weight:700!important;cursor:pointer!important;
}
@media(max-width:1100px){#testModal.open .test-effects-shell .video-effects-body{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:700px){
  #testModal.open{padding:10px!important}
  #testModal.open .test-video-effects-host{width:calc(100vw - 20px)!important;max-height:calc(100dvh - 20px)!important}
  #testModal.open .test-effects-shell{max-height:calc(100dvh - 20px)!important;border-radius:16px!important}
  #testModal.open .test-effects-shell .video-effects-body{grid-template-columns:1fr!important;padding:12px!important}
  #testModal.open .test-effects-shell .video-effects-modal-actions{flex-direction:column!important;align-items:stretch!important}
  #testModal.open .test-effects-shell .video-effects-modal-summary{max-width:none!important}
  #testModal.open .test-effects-shell [data-video-effects-save]{width:100%!important}
}
/* === end social348 exact Test modal design === */

/* Video effects modal: lock background without visual overlay */
body.video-effects-background-locked {
  overflow: hidden !important;
}
body.video-effects-background-locked .app,
body.video-effects-background-locked .social-layout,
body.video-effects-background-locked .social-main,
body.video-effects-background-locked .social-sidebar,
body.video-effects-background-locked header {
  pointer-events: none;
}
body.video-effects-background-locked .video-effects-modal,
body.video-effects-background-locked .video-effects-modal * {
  pointer-events: auto;
}


/* Empty video effects modal shell */
#testModal .empty-video-effects-dialog{
  width:min(900px, calc(100vw - 64px));
  height:min(600px, calc(100vh - 96px));
  background:#fff;
  border-radius:24px;
  box-shadow:0 24px 80px rgba(0,0,0,.25);
}

/* Empty video effects modal: centered shell */
#testModal.test-video-effects-modal.open {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
#testModal .empty-video-effects-dialog {
  position: relative;
  width: min(700px, calc(100vw - 48px));
  min-height: 320px;
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 24px 70px rgba(0,0,0,.25);
}

#testModal.test-video-effects-modal.open{z-index:9999;}

/* social356: empty Video Effects modal uses the same viewport centering flow as chat modal */
#testModal.test-video-effects-modal {
  position: fixed !important;
  inset: 0 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 18px 28px !important;
  overflow: auto !important;
}
#testModal.test-video-effects-modal.open {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  place-items: initial !important;
}
#testModal.test-video-effects-modal .test-video-effects-host {
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 100% !important;
  max-height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: auto !important;
  overflow: visible !important;
}
#testModal.test-video-effects-modal .empty-video-effects-dialog {
  position: relative !important;
  flex: 0 1 auto !important;
  margin: auto !important;
  transform: none !important;
  inset: auto !important;
}
@media (max-width: 900px) {
  #testModal.test-video-effects-modal {
    padding: 10px !important;
    align-items: center !important;
  }
}


/* social357: full preview layout inside the centered chat-style modal */
#testModal.test-video-effects-modal.has-video-effects-content .test-video-effects-host{
  width:min(1220px,calc(100vw - 48px))!important;
  max-width:1220px!important;
  max-height:calc(100dvh - 48px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:auto!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell{
  width:100%!important;
  max-width:1220px!important;
  min-height:0!important;
  max-height:calc(100dvh - 48px)!important;
  margin:auto!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .video-effects-modal-head .social-detail-close{
  position:relative!important;
  top:auto!important;
  right:auto!important;
  flex:0 0 auto!important;
}
@media(max-width:700px){
  #testModal.test-video-effects-modal.has-video-effects-content .test-video-effects-host{
    width:calc(100vw - 20px)!important;
    max-height:calc(100dvh - 20px)!important;
  }
}


/* social357 fixes: clean preset tooltip, selected preset state, reliable chat-style close icon */
body.social-video-mode .video-effect-presets button[data-video-tip]::after,
#testModal .video-effect-presets button[data-video-tip]::after{
  content:none !important;
  display:none !important;
  border:0 !important;
  padding:0 !important;
}
#testModal.test-video-effects-modal.has-video-effects-content .video-effect-presets button.is-selected{
  background:#3f444b !important;
  border-color:#3f444b !important;
  color:#fff !important;
  font-weight:600 !important;
}
#testModal.test-video-effects-modal.has-video-effects-content .video-effect-presets button.is-selected:hover{
  background:#30343a !important;
  border-color:#30343a !important;
  color:#fff !important;
}
#testModal .video-effects-modal-head .social-detail-close{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#f9fafb !important;
  border-radius:8px !important;
  text-indent:0 !important;
  overflow:hidden !important;
}
#testModal .video-effects-modal-head .social-detail-close img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  pointer-events:none !important;
}

/* social359: per-effect intensity editor matching the approved preview */
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-chip{
  display:grid!important;
  grid-template-columns:16px minmax(0,1fr) 42px!important;
  align-items:center!important;
  column-gap:8px!important;
  width:100%!important;
  min-height:24px!important;
  padding:2px 2px!important;
  border:0!important;
  border-radius:5px!important;
  background:transparent!important;
  transform:none!important;
  font-weight:400!important;
  cursor:pointer!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-chip:hover,
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-chip.is-active-intensity{
  background:#eef1f4!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-chip.is-selected{
  border:0!important;
  font-weight:400!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-name{
  min-width:0!important;
  color:#343a42!important;
  font-size:12px!important;
  line-height:1.25!important;
  white-space:normal!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-value{
  display:block!important;
  justify-self:end!important;
  width:42px!important;
  color:#24282e!important;
  font-size:11px!important;
  line-height:1!important;
  font-variant-numeric:tabular-nums!important;
  text-align:right!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-arrow{
  display:none!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top{
  grid-column:1 / -1!important;
  display:block!important;
  width:100%!important;
  margin:8px 0 2px!important;
  padding:14px 0 6px!important;
  border-top:0!important;
  background:#fff!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top-head{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:14px!important;
  margin:0 0 8px!important;
  padding:0!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top-head b{
  color:#666d75!important;
  font-size:12px!important;
  font-weight:700!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top-head span{
  color:#666d75!important;
  font-size:12px!important;
  font-weight:600!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top .video-intensity-row{
  position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(0,760px) 46px!important;
  align-items:start!important;
  gap:12px!important;
  width:100%!important;
  margin:0!important;
  padding:0 0 18px!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top input[type="range"]{
  grid-column:1!important;
  width:100%!important;
  height:18px!important;
  margin:0!important;
  padding:0!important;
  appearance:none!important;
  -webkit-appearance:none!important;
  background:transparent!important;
  cursor:pointer!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top input[type="range"]::-webkit-slider-runnable-track{
  height:2px!important;
  border-radius:2px!important;
  background:#111!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top input[type="range"]::-webkit-slider-thumb{
  width:18px!important;
  height:18px!important;
  margin-top:-8px!important;
  border:0!important;
  border-radius:50%!important;
  background:#111!important;
  box-shadow:none!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top input[type="range"]::-moz-range-track{
  height:2px!important;
  border:0!important;
  border-radius:2px!important;
  background:#111!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top input[type="range"]::-moz-range-thumb{
  width:18px!important;
  height:18px!important;
  border:0!important;
  border-radius:50%!important;
  background:#111!important;
  box-shadow:none!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top.is-disabled input[type="range"]{
  cursor:default!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top.is-disabled input[type="range"]::-webkit-slider-runnable-track{
  background:#c9cdd2!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top.is-disabled input[type="range"]::-webkit-slider-thumb{
  background:#aeb3b9!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top.is-disabled input[type="range"]::-moz-range-track{
  background:#c9cdd2!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top.is-disabled input[type="range"]::-moz-range-thumb{
  background:#aeb3b9!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-intensity-ticks{
  position:absolute!important;
  left:0!important;
  top:18px!important;
  display:flex!important;
  justify-content:space-between!important;
  width:min(760px,calc(100% - 58px))!important;
  color:#555c64!important;
  font-size:10px!important;
  line-height:1!important;
  pointer-events:none!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-intensity-ticks span{
  position:relative!important;
  min-width:14px!important;
  text-align:center!important;
  transform:translateX(-7px)!important;
}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-intensity-ticks span:first-child{transform:none!important;text-align:left!important}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-intensity-ticks span:last-child{transform:none!important;text-align:right!important}
#testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell [data-video-intensity-value]{
  grid-column:2!important;
  grid-row:1!important;
  align-self:center!important;
  color:#222!important;
  font-size:12px!important;
  font-variant-numeric:tabular-nums!important;
  text-align:right!important;
}
@media(max-width:800px){
  #testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-effect-intensity-top .video-intensity-row{
    grid-template-columns:minmax(0,1fr) 42px!important;
  }
  #testModal.test-video-effects-modal.has-video-effects-content .test-effects-shell .video-intensity-ticks{
    width:calc(100% - 54px)!important;
  }
}

/* === PXPress minimal UI cleanup: marketplace scrollbars + sidebar footer === */
/* Keep marketplace scrolling, but hide the extra thin scrollbar. */
body.social-page .marketplace-workspace .gen-preview-editor .marketplace-editor{
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
  scrollbar-gutter:auto !important;
}
body.social-page .marketplace-workspace .gen-preview-editor .marketplace-editor::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* Keep prompt scrolling, but hide its own scrollbar. */
body.social-page .marketplace-workspace .marketplace-editor #marketPromptInput.gen-desc-input{
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
body.social-page .marketplace-workspace .marketplace-editor #marketPromptInput.gen-desc-input::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* Sidebar footer: no separator, regular light-gray text, left aligned. */
body.social-page .social-footer-note{
  border-top:none !important;
  text-align:left !important;
  color:#94a3b8 !important;
}
body.social-page .social-footer-note-title,
body.social-page .social-footer-note-copy{
  font-weight:400 !important;
  color:#94a3b8 !important;
  text-align:left !important;
}
body.social-page.social-dark .social-footer-note{
  border-top:none !important;
}
body.social-page.social-dark .social-footer-note-title,
body.social-page.social-dark .social-footer-note-copy{
  font-weight:400 !important;
  color:#9ca3af !important;
}


/* === PXPress marketplace scrollbar correction ===
   Keep the existing unified HTML scrollbar and hide only the native
   scrollbar of the cards viewport. Scrolling remains enabled. */
body.social-page.social-zone-marketplace .marketplace-workspace [data-dynamic-card-zone],
body.social-page.social-zone-marketplace .generation-logo-workspace [data-dynamic-card-zone]{
  scrollbar-width:none !important;
  -ms-overflow-style:none !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace [data-dynamic-card-zone]::-webkit-scrollbar,
body.social-page.social-zone-marketplace .generation-logo-workspace [data-dynamic-card-zone]::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}

/* === PXPress empty gallery background correction ===
   When image/video galleries contain only a few cards, their grid ends before
   the viewport. Keep the remaining area white instead of exposing the generic
   light-gray .social-main background. */
body.social-page.social-zone-feed .social-main,
body.social-page.social-zone-video .social-main,
body.social-page.social-zone-library .social-main,
body.social-page.social-zone-feed #socialGrid,
body.social-page.social-zone-video #socialGrid,
body.social-page.social-zone-library #socialGrid{
  background:#fff !important;
  background-color:#fff !important;
}

/* === PXPress notifications empty background correction ===
   The bell opens the notifications feed in its own body zone. Keep the empty
   area white there as well, matching the regular image/video galleries. */
body.social-page.social-zone-notifications .social-main,
body.social-page.social-zone-notifications #socialGrid{
  background:#fff !important;
  background-color:#fff !important;
}


/* PXPress: compact hover plate for card three-dot menu */
body.social-page #socialGrid.is-grid .social-menu-wrap > .social-btn.icon-only,
body.social-page .gen-gallery-grid.is-logo-cards .social-menu-wrap > .social-btn.icon-only,
body.social-page .social-masonry-footer .social-menu-wrap > .social-btn.icon-only{
  width:20px !important;
  min-width:20px !important;
  height:20px !important;
  padding:0 !important;
  border-radius:6px !important;
  background:transparent !important;
  transform:none !important;
}
body.social-page #socialGrid.is-grid .social-menu-wrap > .social-btn.icon-only:hover,
body.social-page .gen-gallery-grid.is-logo-cards .social-menu-wrap > .social-btn.icon-only:hover,
body.social-page .social-masonry-footer .social-menu-wrap > .social-btn.icon-only:hover{
  background:#f3f4f6 !important;
  transform:none !important;
}
body.social-page #socialGrid.is-grid .social-menu-wrap > .social-btn.icon-only img,
body.social-page .gen-gallery-grid.is-logo-cards .social-menu-wrap > .social-btn.icon-only img,
body.social-page .social-masonry-footer .social-menu-wrap > .social-btn.icon-only img{
  width:16px !important;
  height:16px !important;
}


/* === Canonical post menu placement ===
   This is the only late positioning block for the card dropdown.
   Menus open downward by default and upward when space below is insufficient. */
body.social-page .social-menu-wrap.open:not(.drop-up) > .social-menu,
body.social-page .social-card.menu-open:not(.menu-up) .social-menu-wrap.open > .social-menu,
body.social-page #socialGrid.is-grid .social-menu-wrap.open:not(.drop-up) > .social-menu,
body.social-page .gen-gallery-grid.is-logo-cards .social-menu-wrap.open:not(.drop-up) > .social-menu,
body.social-page .social-generation-row.menu-open:not(.menu-up) .social-menu-wrap.open > .social-menu{
  top:calc(100% + 8px) !important;
  bottom:auto !important;
  right:0 !important;
  left:auto !important;
  transform:none !important;
}
body.social-page .social-menu-wrap.open.drop-up > .social-menu,
body.social-page .social-card.menu-open.menu-up .social-menu-wrap.open > .social-menu,
body.social-page #socialGrid.is-grid .social-menu-wrap.open.drop-up > .social-menu,
body.social-page .gen-gallery-grid.is-logo-cards .social-menu-wrap.open.drop-up > .social-menu,
body.social-page .social-generation-row.menu-open.menu-up .social-menu-wrap.open > .social-menu{
  top:auto !important;
  bottom:calc(100% + 8px) !important;
  right:0 !important;
  left:auto !important;
  transform:none !important;
}
body.social-page .social-menu-wrap > .social-menu{
  padding:11px !important;
}

/* Font weight normalization */
html, body {
    font-weight: 400;
    font-style: normal;
    font-synthesis: none;
}

.social-page,
.social-page * {
    font-style: normal;
}

.social-page {
    font-family: "Inter", Arial, sans-serif;
}

/* PXPress: lighter, consistent local Inter rendering */
body.social-page{
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
body.social-page input,
body.social-page textarea,
body.social-page select,
body.social-page button{
  font-family:"Inter",Arial,sans-serif;
  font-style:normal;
}


/* === Unified dropdown appearance for all social card menus === */
body.social-page .social-menu-wrap.open > .social-menu,
body.social-page .social-card.menu-open .social-menu-wrap.open > .social-menu,
body.social-page .social-generation-row.menu-open .social-menu-wrap.open > .social-menu,
body.social-page #socialGrid.is-grid .social-menu-wrap.open > .social-menu,
body.social-page .gen-gallery-grid.is-logo-cards .social-menu-wrap.open > .social-menu{
  background:#ffffff !important;
  border:1px solid rgba(229,231,235,.96) !important;
  box-shadow:0 14px 34px rgba(15,23,42,.18),0 4px 12px rgba(15,23,42,.10) !important;
  filter:none !important;
}
body.social-page.social-dark .social-menu-wrap.open > .social-menu,
body.social-page.social-dark .social-card.menu-open .social-menu-wrap.open > .social-menu,
body.social-page.social-dark .social-generation-row.menu-open .social-menu-wrap.open > .social-menu,
body.social-page.social-dark #socialGrid.is-grid .social-menu-wrap.open > .social-menu,
body.social-page.social-dark .gen-gallery-grid.is-logo-cards .social-menu-wrap.open > .social-menu{
  background:#111827 !important;
  border-color:#303744 !important;
  box-shadow:0 16px 38px rgba(0,0,0,.46),0 4px 14px rgba(0,0,0,.30) !important;
}

/* Video generation progress: SVG ring with centered percentage. */
body.social-page .video-progress-loader{
  width:82px;
  height:82px;
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 10px;
}
body.social-page .video-progress-loader svg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  transform:rotate(-90deg);
}
body.social-page .video-progress-track,
body.social-page .video-progress-arc{
  fill:none;
  stroke-width:9;
  vector-effect:non-scaling-stroke;
}
body.social-page .video-progress-track{stroke:#dfe3e8;}
body.social-page .video-progress-arc{
  stroke:#1677f2;
  stroke-linecap:round;
  transition:stroke-dasharray .45s ease;
}
body.social-page .video-progress-value{
  position:absolute;
  inset:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#fff;
  color:#344054;
  font-size:14px;
  font-weight:400;
  line-height:1;
  font-variant-numeric:tabular-nums;
}
body.social-page.social-dark .video-progress-track{stroke:#374151;}
body.social-page.social-dark .video-progress-arc{stroke:#60a5fa;}
body.social-page.social-dark .video-progress-value{background:#111827;color:#e5e7eb;}


/* Solid video generation card and queue caption. */
body.social-page .video-current-card.is-generating,
body.social-page .video-generation-progress-card{
  background:#e5e7eb !important;
  background-image:none !important;
  border:none !important;
}
body.social-page .video-generation-progress-card::before,
body.social-page .video-generation-progress-card::after{display:none !important;}
body.social-page .video-generation-progress-content{
  min-height:100%; width:100%; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:4px; padding:22px;
}
body.social-page .video-generation-queue-label{
  color:#4b5563; font-size:14px; font-weight:400; line-height:1.3; text-align:center;
}
body.social-page.social-dark .video-current-card.is-generating,
body.social-page.social-dark .video-generation-progress-card{background:#2f3742 !important;}
body.social-page.social-dark .video-generation-queue-label{color:#d1d5db;}
.dev-panel-toolbar{flex-wrap:wrap;}

/* === social441: unify generator settings panel widths ===
   Video uses a 320px left column. Keep marketplace and logo settings cards
   at the same outer width; mobile layout remains fluid. */
@media (min-width:761px){
  body.social-page.social-zone-generate .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor,
  body.social-page.social-zone-marketplace .generation-logo-workspace > .gen-preview-editor > .social-generation-description.social-generation-editor.gen-preview38-editor,
  body.social-page.social-zone-marketplace .marketplace-workspace .gen-preview-editor .marketplace-editor.gen-preview38-editor{
    width:320px !important;
    max-width:320px !important;
  }
}
/* === end social441 === */


/* Marketplace tab: compact spacing for all controls below the prompt. */
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-actions-stack{
  display:flex;
  flex-direction:column;
  gap:6px;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-actions-stack > *{
  margin-top:0 !important;
  margin-bottom:0 !important;
}

/* === social446: keep marketplace prompt block at the top ===
   The compact controls remain grouped below the prompt in one shared container. */
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor > .marketplace-actions-stack{
  order:3 !important;
  flex:0 0 auto !important;
  width:100% !important;
}

/* Marketplace dropdowns: unified distance from trigger buttons */
body.social-page .marketplace-editor .marketplace-category-menu,
body.social-page .marketplace-editor .marketplace-select-menu{
  bottom:auto!important;
  top:calc(100% + 2px)!important;
}


.marketplace-card-images{
  width:100%;
  grid-column:1 / -1;
  margin-top:18px;
}

.marketplace-card-images .gen-upload-zones{
  grid-row:auto !important;
  margin:0 !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:12px !important;
  width:100%;
}

.marketplace-card-images .gen-upload-zone{
  width:100% !important;
  min-height:88px !important;
}

/* Patch: video effects launcher hover matches upload cards and keeps full button area clickable. */
body.social-video-mode .video-effects-title{
  cursor:pointer !important;
  transition:background .15s ease,border-color .15s ease,color .15s ease !important;
}
body.social-video-mode .video-effects-title:hover{
  background:rgba(127,127,127,.06) !important;
  border-color:rgba(100,100,100,.65) !important;
}

/* Final fix: video effects launcher hover applies to the whole gray card, not the text button */
body.social-video-mode .video-effects-launcher[data-video-effects-toggle]{
  cursor:pointer !important;
  transition:background .15s ease,border-color .15s ease,color .15s ease !important;
}
body.social-video-mode .video-effects-launcher[data-video-effects-toggle]:hover{
  background:rgba(127,127,127,.06) !important;
  border-color:rgba(100,100,100,.65) !important;
}
body.social-video-mode .video-effects-launcher .video-effects-title:hover,
body.social-video-mode .video-effects-launcher .video-effects-title span:hover,
body.social-video-mode .video-effects-launcher .video-effects-title b:hover,
body.social-video-mode .video-effects-launcher .video-effects-title small:hover{
  background:transparent !important;
  border-color:transparent !important;
}


/* === Fix marketplace video effects launcher size/alignment === */
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-title{
  min-height:0 !important;
  height:auto !important;
  padding:8px 12px !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  text-align:left !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-title span{
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  text-align:left !important;
}
.marketplace-workspace .marketplace-editor .marketplace-video-effects .video-effects-selected{
  text-align:left !important;
}


/* === v17 marketplace video-card alignment fixes === */
.marketplace-editor.mode-video .marketplace-video-effects .video-effects-title{
  margin-bottom:8px!important;
  padding:0!important;
  align-items:flex-start!important;
}
.marketplace-editor.mode-video .marketplace-video-effects .video-effects-title span{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:2px!important;
}
.marketplace-editor.mode-video .marketplace-video-effects .video-effects-title small{
  text-align:left!important;
  max-width:none!important;
}
.marketplace-editor.mode-video .marketplace-video-effects .video-effects-selected{
  margin-top:6px!important;
  padding-top:8px!important;
}

/* Keep marketplace videocard prompt behaviour identical to card/generation prompt */
.marketplace-editor.mode-video #marketPromptInput{
  height:170px!important;
  min-height:170px!important;
  max-height:170px!important;
  resize:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  box-sizing:border-box!important;
}

/* === Final fix: pin video controls to bottom of generator card === */
body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card{
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card .video-generation-actions{
  margin-top:6px !important;
  padding-top:0 !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card .video-prompt-panel,
body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card .video-options-grid,
body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card .video-effects-panel,
body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card .video-upload-grid{
  flex-shrink:0 !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card{
  overflow-y:auto !important;
}
/* === end final fix === */

/* video generation lower block alignment */
.video-generation-card{
  display:flex;
  flex-direction:column;
}
.video-lower-controls{
  margin-top:auto;
  padding-top:24px;
}
.video-generation-actions{
  margin-top:16px;
}

/* final adjustment: move video upload/options block closer to bottom actions */
body.social-page .generation-logo-workspace.video-generation-shell .video-lower-controls{
  position:static !important;
  top:auto !important;
  margin-top:auto !important;
}

/* video effects spacing: separate effects block from upload cards */
body.social-page .generation-logo-workspace.video-generation-shell .video-effects-panel{
  margin-bottom:24px !important;
}

/* final: spacing between upload cards and bottom action buttons */
body.social-page .generation-logo-workspace.video-generation-shell .video-upload-grid{
  margin-bottom:18px !important;
}


/* final vertical alignment for video lower controls */
body.social-page .generation-logo-workspace.video-generation-shell .video-effects-panel{
  margin-bottom:18px !important;
}
body.social-page .generation-logo-workspace.video-generation-shell .video-upload-grid{
  margin-bottom:18px !important;
}
body.social-page .generation-logo-workspace.video-generation-shell .video-generation-actions{
  margin-top:18px !important;
}


/* === social495: align marketplace video and logo generator panels ===
   Based on actual render DOM from js/social.js:
   marketplace-editor -> marketplace-actions-stack / marketplace-video-panel
   generation-logo-workspace -> generationPromptInput / gen-desc-input
*/

/* Marketplace: video card controls occupy the available lower area without gaps. */
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-actions-stack{
  flex:0 0 auto !important;
  gap:6px !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-video-panel{
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
  margin-top:6px !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-video-images{
  margin-top:0 !important;
  margin-bottom:0 !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-video-effects{
  margin-top:0 !important;
  margin-bottom:0 !important;
}

/* Logo generation prompt: fixed editor height with internal scroll, like video prompt area. */
body.social-page .generation-logo-workspace.logo-generation-shell .gen-preview-editor{
  overflow:hidden !important;
}
body.social-page .generation-logo-workspace.logo-generation-shell .social-generation-editor{
  min-height:0 !important;
  display:flex !important;
  flex-direction:column !important;
}
body.social-page .generation-logo-workspace.logo-generation-shell #generationPromptInput{
  height:150px !important;
  min-height:150px !important;
  max-height:150px !important;
  resize:none !important;
  overflow-y:auto !important;
}

/* Use the same compact dropdown behavior as marketplace controls. */
body.social-page .generation-logo-workspace.logo-generation-shell .gen-desc-select{
  max-height:34px !important;
}


/* === Logo generation prompt final layout fix === */
.gen-preview38-editor .gen-desc-input{
  min-height:0 !important;
  height:100% !important;
  overflow-y:auto !important;
  resize:none !important;
}

.gen-preview38-editor{
  grid-template-rows:auto minmax(0,1fr) auto auto auto !important;
}

.gen-preview38-editor .gen-upload-zones{
  margin:0 0 18px !important;
}

/* stable video lower controls layout */
body.social-page .generation-logo-workspace.video-generation-shell .video-lower-controls{
  position:static !important;
  transform:none !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-upload-grid{
  align-items:stretch !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-upload-zone{
  height:142px !important;
  min-height:142px !important;
  max-height:142px !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-upload-zone img,
body.social-page .generation-logo-workspace.video-generation-shell .video-upload-zone video{
  width:100% !important;
  height:78px !important;
  max-height:78px !important;
  object-fit:cover !important;
  flex-shrink:0 !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-generation-actions{
  position:static !important;
  margin-top:16px !important;
  flex-shrink:0 !important;
}


/* video upload preview: replace text with full preview */
.video-upload-zone.has-preview .video-upload-info,
.video-upload-zone.has-preview .video-upload-empty{
  display:none !important;
}
.video-upload-zone.has-preview{
  padding:0 !important;
  gap:0 !important;
  position:relative;
}
.video-upload-zone .video-upload-preview{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  border-radius:12px;
}

/* reduce empty space before action buttons */
.video-lower-controls{
  row-gap:8px !important;
}
.video-upload-grid{
  margin-top:8px !important;
  margin-bottom:0 !important;
}
.video-generation-actions{
  margin-top:8px !important;
}


/* === social518 final video upload polish === */

/* Rectangular upload cards */
body.social-page .generation-logo-workspace.video-generation-shell .video-upload-zone{
    aspect-ratio:auto !important;
    height:118px !important;
    min-height:118px !important;
    max-height:118px !important;
    border-radius:12px !important;
}

/* Preview must fill zone but keep full image visible */
body.social-page .generation-logo-workspace.video-generation-shell .video-upload-zone.has-preview .video-upload-preview,
body.social-page .generation-logo-workspace.video-generation-shell .video-upload-zone img,
body.social-page .generation-logo-workspace.video-generation-shell .video-upload-zone video{
    width:100% !important;
    height:100% !important;
    max-height:none !important;
    object-fit:contain !important;
    margin:0 !important;
    border-radius:12px !important;
}

/* Remove remaining empty space between upload row and actions */
body.social-page .generation-logo-workspace.video-generation-shell .video-lower-controls{
    row-gap:0 !important;
    padding-top:12px !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-upload-grid{
    margin-top:0 !important;
    margin-bottom:0 !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-generation-actions{
    margin-top:4px !important;
}


/* === social520 video upload preview alignment === */

/* Keep upload card text layout unchanged before upload */
body.social-page .generation-logo-workspace.video-generation-shell .video-upload-zone{
    position:relative !important;
    aspect-ratio:auto !important;
    height:118px !important;
    min-height:118px !important;
    max-height:118px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
}

/* Both uploaded images use identical preview behavior */
body.social-page .generation-logo-workspace.video-generation-shell .video-upload-zone.has-preview .video-upload-preview{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    max-height:none !important;
    object-fit:contain !important;
    border-radius:12px !important;
    padding:0 !important;
}

/* Hide upload labels only while preview exists */
body.social-page .generation-logo-workspace.video-generation-shell .video-upload-zone.has-preview .video-upload-info,
body.social-page .generation-logo-workspace.video-generation-shell .video-upload-zone.has-preview .video-upload-empty{
    display:none !important;
}

/* restore compact spacing only between upload and action row */
body.social-page .generation-logo-workspace.video-generation-shell .video-upload-grid{
    margin-bottom:6px !important;
}
body.social-page .generation-logo-workspace.video-generation-shell .video-generation-actions{
    margin-top:6px !important;
}

/* remove extra effect-to-upload gap */
body.social-page .generation-logo-workspace.video-generation-shell .video-effects-panel{
    margin-bottom:10px !important;
}

/* === social557: expand video prompt into unused vertical space === */
body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card > .video-prompt-panel{
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
  min-height:0 !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card > .video-prompt-panel .video-prompt-input{
  flex:1 1 auto !important;
  width:100% !important;
  height:auto !important;
  min-height:240px !important;
  max-height:none !important;
  resize:none !important;
  border:none !important;
  outline:none !important;
  box-shadow:none !important;
  background:transparent !important;
  overflow-y:auto !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card > .video-lower-controls,
body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card > .video-generation-actions{
  flex:0 0 auto !important;
}

body.social-page .generation-logo-workspace.video-generation-shell .video-generation-card > .video-lower-controls{
  margin-top:12px !important;
}
/* === end social557 === */

/* Video upload preview delete control */
body.social-video-mode .video-upload-zone.has-preview{
  position:relative;
}
body.social-video-mode .video-upload-delete{
  position:absolute;
  top:8px;
  right:8px;
  z-index:6;
  width:30px;
  height:30px;
  padding:0;
  border:1px solid rgba(120,120,120,.22);
  border-radius:50%;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .16s ease, visibility .16s ease, transform .16s ease;
  box-shadow:0 2px 8px rgba(0,0,0,.12);
}
body.social-video-mode .video-upload-delete img{
  width:16px;
  height:16px;
  display:block;
  object-fit:contain;
}
body.social-video-mode .video-upload-zone.has-preview:hover .video-upload-delete,
body.social-video-mode .video-upload-delete:focus-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
body.social-video-mode .video-upload-delete:hover{
  transform:scale(1.05);
}
body.social-video-mode .video-upload-delete:focus-visible{
  outline:2px solid rgba(37,99,235,.45);
  outline-offset:2px;
}


/* === social568: marketplace prompt header, scrollbar and compact controls === */
/* Keep the marketplace title on one line and move the counter toward the right. */
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor .gen-desc-head{
  gap:8px !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor .gen-desc-title{
  display:flex !important;
  align-items:center !important;
  flex:1 1 auto !important;
  min-width:0 !important;
  gap:8px !important;
  white-space:nowrap !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor .gen-desc-title > span:first-child{
  white-space:nowrap !important;
  flex:0 0 auto !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor .gen-desc-counter{
  margin-left:auto !important;
  flex:0 0 auto !important;
  white-space:nowrap !important;
}

/* Give the marketplace prompt its own always-visible scrollbar, matching video generation. */
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor #marketPromptInput.gen-desc-input{
  overflow-y:scroll !important;
  overflow-x:hidden !important;
  scrollbar-width:thin !important;
  scrollbar-color:#b8bec8 transparent !important;
  scrollbar-gutter:stable !important;
  padding-right:8px !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor #marketPromptInput.gen-desc-input::-webkit-scrollbar{
  width:6px !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor #marketPromptInput.gen-desc-input::-webkit-scrollbar-track{
  background:transparent !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor #marketPromptInput.gen-desc-input::-webkit-scrollbar-thumb{
  background:#b8bec8 !important;
  border-radius:999px !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor #marketPromptInput.gen-desc-input::-webkit-scrollbar-thumb:hover{
  background:#9ca3af !important;
}
body.social-page.social-dark.social-zone-marketplace .marketplace-workspace .marketplace-editor #marketPromptInput.gen-desc-input{
  scrollbar-color:#4b5563 transparent !important;
}
body.social-page.social-dark.social-zone-marketplace .marketplace-workspace .marketplace-editor #marketPromptInput.gen-desc-input::-webkit-scrollbar-thumb{
  background:#4b5563 !important;
}

/* Compact spacing between marketplace controls, like the video generation card. */
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-actions-stack{
  gap:4px !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-select-grid,
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-category-row{
  gap:6px !important;
  margin-top:0 !important;
  margin-bottom:4px !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-select-field,
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-category-field{
  gap:3px !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-field-label{
  margin-bottom:3px !important;
}
/* === end social568 === */

/* === social569: fixed videocard prompt height with its own scrollbar === */
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input{
  height:230px !important;
  min-height:230px !important;
  max-height:230px !important;
  overflow-y:scroll !important;
  overflow-x:hidden !important;
  resize:none !important;
  scrollbar-width:thin !important;
  scrollbar-color:#b8bec8 transparent !important;
  scrollbar-gutter:stable !important;
  padding-right:8px !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input::-webkit-scrollbar{
  width:6px !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input::-webkit-scrollbar-track{
  background:transparent !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input::-webkit-scrollbar-thumb{
  background:#b8bec8 !important;
  border-radius:999px !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input::-webkit-scrollbar-thumb:hover{
  background:#9ca3af !important;
}
body.social-page.social-dark.social-zone-marketplace .marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input{
  scrollbar-color:#4b5563 transparent !important;
}
body.social-page.social-dark.social-zone-marketplace .marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input::-webkit-scrollbar-thumb{
  background:#4b5563 !important;
}

/* === social570: videocard scrollbar state, compact spacing and image delete === */
/* Empty videocard prompt: hide the native scrollbar buttons. Filled prompt: show it. */
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input:not(.has-scroll-content){
  overflow-y:hidden !important;
  scrollbar-width:none !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input:not(.has-scroll-content)::-webkit-scrollbar{
  width:0 !important;
  height:0 !important;
  display:none !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input.has-scroll-content{
  overflow-y:scroll !important;
  scrollbar-width:thin !important;
}
body.social-page.social-zone-marketplace .marketplace-workspace .marketplace-editor.mode-video #marketPromptInput.gen-desc-input.has-scroll-content::-webkit-scrollbar{
  display:block !important;
  width:6px !important;
}

/* Reduce vertical gaps only in the marketplace videocard controls. */
body.social-page.social-zone-marketplace .marketplace-editor.mode-video .marketplace-actions-stack{
  gap:0 !important;
}
body.social-page.social-zone-marketplace .marketplace-editor.mode-video .marketplace-select-grid,
body.social-page.social-zone-marketplace .marketplace-editor.mode-video .marketplace-category-row{
  gap:5px !important;
  margin-top:0 !important;
  margin-bottom:2px !important;
}
body.social-page.social-zone-marketplace .marketplace-editor.mode-video .marketplace-video-panel{
  gap:5px !important;
  margin-top:3px !important;
}
body.social-page.social-zone-marketplace .marketplace-editor.mode-video .marketplace-video-images{
  gap:6px !important;
  margin-top:0 !important;
}

/* Shared delete control for marketplace Card and Videocard image previews. */
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-card-images .gen-upload-zone,
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-video-images .gen-upload-zone{
  position:relative !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-upload-delete{
  position:absolute !important;
  top:8px !important;
  right:8px !important;
  z-index:12 !important;
  width:30px !important;
  height:30px !important;
  min-width:30px !important;
  min-height:30px !important;
  padding:0 !important;
  margin:0 !important;
  border:1px solid rgba(120,120,120,.22) !important;
  border-radius:50% !important;
  background:#fff !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transition:opacity .16s ease, visibility .16s ease, transform .16s ease !important;
  box-shadow:0 2px 8px rgba(0,0,0,.12) !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-upload-delete > img{
  width:27px !important;
  height:27px !important;
  min-width:27px !important;
  min-height:27px !important;
  max-width:27px !important;
  max-height:27px !important;
  margin:0 !important;
  padding:0 !important;
  display:block !important;
  object-fit:contain !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .gen-upload-zone.has-preview:hover > .marketplace-upload-delete,
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-upload-delete:focus-visible{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-upload-delete:hover{
  transform:scale(1.05) !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-upload-delete:focus-visible{
  outline:2px solid rgba(37,99,235,.45) !important;
  outline-offset:2px !important;
}
/* === end social570 === */

/* === social574: equal compact vertical spacing in marketplace Card and Videocard === */
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-actions-stack{
  gap:2px !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-select-grid,
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-category-row{
  row-gap:5px !important;
  margin-top:0 !important;
  margin-bottom:2px !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-card-images,
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-video-panel{
  margin-top:3px !important;
}
/* === end social574 === */

/* === social574_v2: same absolute vertical reduction step === */
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-actions-stack{
  gap:0 !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-select-grid,
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-category-row{
  row-gap:4px !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-card-images,
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-video-panel{
  margin-top:1px !important;
}
/* === end social574_v2 === */

/* === social574_v3: additional equal vertical compaction === */
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-actions-stack{
  gap:0 !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-select-grid,
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-category-row{
  row-gap:2px !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-card-images,
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-video-panel{
  margin-top:0 !important;
}
/* === end social574_v3 === */


/* Compact spacing between video card selectors and upload blocks */
.video-card-panel .upload-section,
.marketplace-card-panel .video-card-panel .upload-section,
.video-card-content .upload-section{
  margin-top:4px !important;
}
.video-card-panel .controls-grid,
.video-card-content .controls-grid{
  margin-bottom:4px !important;
}


/* Logo generation upload preview delete controls */
body.social-page.social-zone-generate .generation-logo-workspace .gen-upload-zone.has-preview{
  position:relative !important;
}
body.social-page.social-zone-generate .generation-logo-workspace .gen-upload-delete{
  position:absolute !important;
  top:8px !important;
  right:8px !important;
  z-index:8 !important;
  width:30px !important;
  height:30px !important;
  padding:0 !important;
  margin:0 !important;
  border:1px solid rgba(120,120,120,.22) !important;
  border-radius:50% !important;
  background:#fff !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transition:opacity .16s ease, visibility .16s ease, transform .16s ease !important;
  box-shadow:0 2px 8px rgba(0,0,0,.12) !important;
}
body.social-page.social-zone-generate .generation-logo-workspace .gen-upload-delete img{
  width:30px !important;
  height:30px !important;
  display:block !important;
  object-fit:contain !important;
}
body.social-page.social-zone-generate .generation-logo-workspace .gen-upload-zone.has-preview:hover .gen-upload-delete,
body.social-page.social-zone-generate .generation-logo-workspace .gen-upload-delete:focus-visible{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}
body.social-page.social-zone-generate .generation-logo-workspace .gen-upload-delete:hover{
  transform:scale(1.05) !important;
}
body.social-page.social-zone-generate .generation-logo-workspace .gen-upload-delete:focus-visible{
  outline:2px solid rgba(37,99,235,.45) !important;
  outline-offset:2px !important;
}

.marketplace-video-effects .video-effects-title{margin-bottom:0!important;align-items:center!important}.marketplace-video-effects .video-effects-inline-count{font-weight:400;font-size:12px;color:var(--social-muted,#777);margin-left:8px}.marketplace-video-effects .video-effects-selected{display:none!important}


/* social584: marketplace videocard effects button in one compact line */
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-video-effects .video-effects-title{
  min-height:16px !important;
  height:16px !important;
  padding:0 10px !important;
  display:flex !important;
  align-items:center !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-video-effects .video-effects-title .video-effects-one-line{
  width:100% !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  flex-wrap:nowrap !important;
  white-space:nowrap !important;
  line-height:1 !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-video-effects .video-effects-title .video-effects-one-line b,
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-video-effects .video-effects-title .video-effects-inline-count{
  display:inline !important;
  margin:0 !important;
  line-height:16px !important;
  vertical-align:baseline !important;
  white-space:nowrap !important;
}
body.social-page.social-zone-marketplace .marketplace-editor .marketplace-video-effects .video-effects-selected{
  display:none !important;
}
/* end social584 */

/* === social586: logo prompt matches video/marketplace prompt scrollbar and fills available height === */
body.social-page.social-zone-generate .generation-logo-workspace.logo-generation-shell .social-generation-editor.gen-preview38-editor{
  display:grid !important;
  grid-template-rows:auto minmax(0,1fr) auto auto auto !important;
  min-height:0 !important;
}
body.social-page.social-zone-generate .generation-logo-workspace.logo-generation-shell #generationPromptInput.gen-desc-input{
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  max-height:none !important;
  resize:none !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  box-sizing:border-box !important;
  scrollbar-width:thin !important;
  scrollbar-color:#b8bec8 transparent !important;
}
body.social-page.social-zone-generate .generation-logo-workspace.logo-generation-shell #generationPromptInput.gen-desc-input::-webkit-scrollbar{
  width:6px !important;
  height:6px !important;
}
body.social-page.social-zone-generate .generation-logo-workspace.logo-generation-shell #generationPromptInput.gen-desc-input::-webkit-scrollbar-track{
  background:transparent !important;
}
body.social-page.social-zone-generate .generation-logo-workspace.logo-generation-shell #generationPromptInput.gen-desc-input::-webkit-scrollbar-thumb{
  background:#b8bec8 !important;
  border-radius:999px !important;
}
body.social-page.social-zone-generate .generation-logo-workspace.logo-generation-shell #generationPromptInput.gen-desc-input::-webkit-scrollbar-thumb:hover{
  background:#9ca3af !important;
}
body.social-page.social-dark.social-zone-generate .generation-logo-workspace.logo-generation-shell #generationPromptInput.gen-desc-input{
  scrollbar-color:#4b5563 transparent !important;
}
body.social-page.social-dark.social-zone-generate .generation-logo-workspace.logo-generation-shell #generationPromptInput.gen-desc-input::-webkit-scrollbar-thumb{
  background:#4b5563 !important;
}
/* === end social586 === */


/* social587: image lightbox close and prompt-copy controls */
body.social-page .social-image-lightbox-close{
  left:22px!important;
  right:auto!important;
  top:18px!important;
  width:38px!important;
  height:38px!important;
  background:transparent!important;
  background-image:none!important;
}
body.social-page .social-image-lightbox-close img{
  display:block!important;
  width:38px!important;
  height:38px!important;
  max-width:none!important;
  max-height:none!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:transparent!important;
  pointer-events:none!important;
}
body.social-page .social-prompt-heading-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin:0 0 10px!important;
}
body.social-page .social-prompt-heading-row h3{
  margin:0!important;
}
body.social-page .social-prompt-copy-btn{
  width:28px!important;
  height:28px!important;
  min-width:28px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  cursor:pointer!important;
}
body.social-page .social-prompt-copy-btn img{
  width:22px!important;
  height:22px!important;
  display:block!important;
}


/* social588: repair full-image lightbox and compact prompt-copy header */
body.social-page .social-image-lightbox-close{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  left:22px !important;
  right:auto !important;
  top:18px !important;
  width:38px !important;
  height:38px !important;
  padding:0 !important;
  background:transparent !important;
  background-image:none !important;
}
body.social-page .social-image-lightbox-close img{
  width:38px !important;
  height:38px !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:contain !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:transparent !important;
}
body.social-page .social-image-lightbox > .social-image-lightbox-media{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:96vw !important;
  max-height:94vh !important;
  object-fit:contain !important;
  border-radius:0 !important;
  background:#000 !important;
  box-shadow:none !important;
}
body.social-page .social-prompt-heading-row{
  justify-content:flex-start !important;
  gap:4px !important;
}
body.social-page .social-prompt-copy-btn{
  width:16px !important;
  height:16px !important;
  min-width:16px !important;
  margin:0 !important;
  padding:0 !important;
}
body.social-page .social-prompt-copy-btn img{
  width:11px !important;
  height:11px !important;
}
/* === end social588 === */


/* === social589 requested UI updates === */
/* Prompt copy icon: +15% from 11px, keep button circle/slot unchanged. */
body.social-page .social-prompt-copy-btn img{
  width:12.65px !important;
  height:12.65px !important;
}

/* Generator top action: no separate Clear button; Generate spans the full first row. */
body.social-page.social-zone-generate .generation-logo-workspace.logo-generation-shell .gen-preview-editor .gen-desc-generate{
  grid-column:1 / 5 !important;
  grid-row:1 !important;
  width:100% !important;
  min-width:0 !important;
  justify-self:stretch !important;
}

/* The former image-type button is now a reset-all-settings button. */
body.social-page.social-zone-generate .generation-logo-workspace.logo-generation-shell .gen-reset-settings-btn img{
  width:18px !important;
  height:18px !important;
  display:block !important;
  object-fit:contain !important;
  pointer-events:none !important;
}

/* Match the prompt scrollbar's right-edge coordinates to Video Generation. */
body.social-page.social-zone-generate .generation-logo-workspace.logo-generation-shell #generationPromptInput.gen-desc-input{
  padding-right:8px !important;
  scrollbar-gutter:auto !important;
}
body.social-page.social-zone-generate .generation-logo-workspace.logo-generation-shell #generationPromptInput.gen-desc-input::-webkit-scrollbar{
  width:6px !important;
}
/* === end social589 === */

/* social590: prompt copy icon +10% */
body.social-page .social-prompt-copy-btn img{width:13.915px !important;height:13.915px !important;}

/* === Fix: top gallery cards must not be clipped by tabs/header === */
body.social-page .generation-logo-workspace .gen-gallery-grid,
body.social-page .gen-preview-workspace .gen-gallery-grid,
body.social-page .marketplace-workspace .gen-gallery-grid,
body.social-page .marketplace-card-workspace .gen-gallery-grid,
body.social-page .marketplace-gallery {
  padding-top: 4px !important;
  box-sizing: border-box !important;
}

/* Keep gallery cards inside their scroll area on hover. */
body.social-page .generation-logo-workspace .gen-gallery-grid > .gen-preview-card,
body.social-page .generation-logo-workspace .gen-gallery-grid > .social-card,
body.social-page .generation-logo-workspace .gen-gallery-grid > .social-masonry-card,
body.social-page .gen-preview-workspace .gen-gallery-grid > .gen-preview-card,
body.social-page .gen-preview-workspace .gen-gallery-grid > .social-card,
body.social-page .gen-preview-workspace .gen-gallery-grid > .social-masonry-card,
body.social-page .marketplace-workspace .gen-gallery-grid > .gen-preview-card,
body.social-page .marketplace-workspace .gen-gallery-grid > .social-card,
body.social-page .marketplace-workspace .gen-gallery-grid > .social-masonry-card,
body.social-page .marketplace-card-workspace .gen-gallery-grid > .gen-preview-card,
body.social-page .marketplace-card-workspace .gen-gallery-grid > .social-card,
body.social-page .marketplace-card-workspace .gen-gallery-grid > .social-masonry-card {
  transform: none !important;
}

body.social-page .generation-logo-workspace .gen-gallery-grid > .gen-preview-card:hover,
body.social-page .generation-logo-workspace .gen-gallery-grid > .social-card:hover,
body.social-page .generation-logo-workspace .gen-gallery-grid > .social-masonry-card:hover,
body.social-page .gen-preview-workspace .gen-gallery-grid > .gen-preview-card:hover,
body.social-page .gen-preview-workspace .gen-gallery-grid > .social-card:hover,
body.social-page .gen-preview-workspace .gen-gallery-grid > .social-masonry-card:hover,
body.social-page .marketplace-workspace .gen-gallery-grid > .gen-preview-card:hover,
body.social-page .marketplace-workspace .gen-gallery-grid > .social-card:hover,
body.social-page .marketplace-workspace .gen-gallery-grid > .social-masonry-card:hover,
body.social-page .marketplace-card-workspace .gen-gallery-grid > .gen-preview-card:hover,
body.social-page .marketplace-card-workspace .gen-gallery-grid > .social-card:hover,
body.social-page .marketplace-card-workspace .gen-gallery-grid > .social-masonry-card:hover {
  transform: none !important;
}

/* === Restore gallery hover lift without clipping under the white tabs bar === */
body.social-page .generation-logo-workspace .gen-gallery-grid,
body.social-page .gen-preview-workspace .gen-gallery-grid,
body.social-page .marketplace-workspace .gen-gallery-grid,
body.social-page .marketplace-card-workspace .gen-gallery-grid,
body.social-page .marketplace-gallery{
  overflow:visible !important;
  position:relative !important;
  z-index:4 !important;
}

body.social-page .generation-logo-workspace .gen-gallery-grid > .gen-preview-card,
body.social-page .generation-logo-workspace .gen-gallery-grid > .social-card,
body.social-page .generation-logo-workspace .gen-gallery-grid > .social-masonry-card,
body.social-page .gen-preview-workspace .gen-gallery-grid > .gen-preview-card,
body.social-page .gen-preview-workspace .gen-gallery-grid > .social-card,
body.social-page .gen-preview-workspace .gen-gallery-grid > .social-masonry-card,
body.social-page .marketplace-workspace .gen-gallery-grid > .gen-preview-card,
body.social-page .marketplace-workspace .gen-gallery-grid > .social-card,
body.social-page .marketplace-workspace .gen-gallery-grid > .social-masonry-card,
body.social-page .marketplace-card-workspace .gen-gallery-grid > .gen-preview-card,
body.social-page .marketplace-card-workspace .gen-gallery-grid > .social-card,
body.social-page .marketplace-card-workspace .gen-gallery-grid > .social-masonry-card{
  position:relative !important;
  z-index:1 !important;
  transition:transform .16s ease, box-shadow .16s ease !important;
}

body.social-page .generation-logo-workspace .gen-gallery-grid > .gen-preview-card:hover,
body.social-page .generation-logo-workspace .gen-gallery-grid > .social-card:hover,
body.social-page .generation-logo-workspace .gen-gallery-grid > .social-masonry-card:hover,
body.social-page .gen-preview-workspace .gen-gallery-grid > .gen-preview-card:hover,
body.social-page .gen-preview-workspace .gen-gallery-grid > .social-card:hover,
body.social-page .gen-preview-workspace .gen-gallery-grid > .social-masonry-card:hover,
body.social-page .marketplace-workspace .gen-gallery-grid > .gen-preview-card:hover,
body.social-page .marketplace-workspace .gen-gallery-grid > .social-card:hover,
body.social-page .marketplace-workspace .gen-gallery-grid > .social-masonry-card:hover,
body.social-page .marketplace-card-workspace .gen-gallery-grid > .gen-preview-card:hover,
body.social-page .marketplace-card-workspace .gen-gallery-grid > .social-card:hover,
body.social-page .marketplace-card-workspace .gen-gallery-grid > .social-masonry-card:hover{
  transform:translateY(-2px) !important;
  z-index:50 !important;
}
/* === end hover restore === */




/* === social591: invisible prompt copy, lightbox zoom controls, action hover lift === */
body.social-page .social-image-lightbox{
  background:rgba(15,23,42,.76) !important;
  overflow:auto !important;
}
body.social-page .social-image-lightbox > .social-image-lightbox-media{
  transition:transform .18s ease !important;
  transform-origin:center center !important;
  cursor:zoom-in !important;
}
body.social-page .social-image-lightbox > .social-image-lightbox-media.is-zoomed{
  cursor:zoom-out !important;
}
body.social-page .social-image-lightbox-zoom{
  position:fixed !important;
  right:22px !important;
  bottom:22px !important;
  z-index:2147483647 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
}
body.social-page .social-image-lightbox-zoom button{
  width:38px !important;
  height:38px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:10px !important;
  background:rgba(255,255,255,.94) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  box-shadow:0 8px 24px rgba(0,0,0,.2) !important;
}
body.social-page .social-image-lightbox-zoom button img{
  width:22px !important;
  height:22px !important;
  max-width:none !important;
  max-height:none !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  pointer-events:none !important;
}
body.social-page .gen-desc-generate,
body.social-page .video-generate-btn{
  transition:transform .16s ease, box-shadow .16s ease !important;
}
body.social-page .gen-desc-generate:hover:not(:disabled),
body.social-page .video-generate-btn:hover:not(:disabled){
  transform:translateY(-2px) !important;
}
body.social-page .gen-desc-generate:active:not(:disabled),
body.social-page .video-generate-btn:active:not(:disabled){
  transform:translateY(0) !important;
}
/* === end social591 === */

/* social592: equal zoom icon color and transparent scrollbar corner */
body.social-page .social-image-lightbox{
  scrollbar-color:rgba(255,255,255,.42) transparent !important;
}
body.social-page .social-image-lightbox::-webkit-scrollbar-corner{
  background:transparent !important;
}
body.social-page .social-image-lightbox-zoom button img{
  opacity:1 !important;
  filter:none !important;
}
/* end social592 */

/* social593: match lightbox close control to zoom controls and reveal interface */
body.social-page .social-image-lightbox{
  background:rgba(15,23,42,.66) !important;
}
body.social-page .social-image-lightbox-close{
  width:38px !important;
  height:38px !important;
  min-width:38px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:10px !important;
  background:rgba(255,255,255,.94) !important;
  background-image:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow:0 8px 24px rgba(0,0,0,.2) !important;
  overflow:visible !important;
}
body.social-page .social-image-lightbox-close:hover{
  background:rgba(255,255,255,.94) !important;
  background-image:none !important;
  filter:none !important;
}
body.social-page .social-image-lightbox-close img{
  width:22px !important;
  height:22px !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:contain !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  pointer-events:none !important;
}
/* === end social593 === */

/* social594: unified hover for image lightbox controls */
body.social-page .social-image-lightbox-close,
body.social-page .social-image-lightbox-zoom button{
  transition:background-color .16s ease, filter .16s ease !important;
}
body.social-page .social-image-lightbox-close:hover,
body.social-page .social-image-lightbox-close:focus-visible{
  background-color:rgba(230,230,230,.94) !important;
  background-image:none !important;
  filter:none !important;
}
body.social-page .social-image-lightbox-zoom button:hover,
body.social-page .social-image-lightbox-zoom button:focus-visible{
  background-color:rgba(230,230,230,.94) !important;
  background-image:none !important;
  filter:none !important;
}
body.social-page .social-image-lightbox-close:hover img,
body.social-page .social-image-lightbox-close:focus-visible img,
body.social-page .social-image-lightbox-zoom button:hover img,
body.social-page .social-image-lightbox-zoom button:focus-visible img{
  filter:none !important;
  opacity:1 !important;
  transform:none !important;
}
/* === end social594 === */

/* social595: remove legacy cross26 hover artifact from photo lightbox close */
body.social-page button.social-image-lightbox-close,
body.social-page button.social-image-lightbox-close:hover,
body.social-page button.social-image-lightbox-close:focus,
body.social-page button.social-image-lightbox-close:focus-visible,
body.social-page button.social-image-lightbox-close:active{
  background-image:none !important;
  background-repeat:no-repeat !important;
  background-position:center !important;
  background-size:0 0 !important;
  text-indent:0 !important;
  overflow:hidden !important;
}
body.social-page button.social-image-lightbox-close{
  background-color:rgba(255,255,255,.94) !important;
}
body.social-page button.social-image-lightbox-close:hover,
body.social-page button.social-image-lightbox-close:focus-visible{
  background-color:rgba(230,230,230,.94) !important;
}
body.social-page button.social-image-lightbox-close::before,
body.social-page button.social-image-lightbox-close::after{
  content:none !important;
  display:none !important;
  background:none !important;
}
body.social-page button.social-image-lightbox-close > img{
  display:block !important;
  position:static !important;
  inset:auto !important;
  margin:0 !important;
  transform:none !important;
}
/* === end social595 === */

/* social596: restore rounded corners for photo lightbox close button */
body.social-page #socialImageLightbox button.social-image-lightbox-close,
body.social-page #socialImageLightbox button.social-image-lightbox-close:hover,
body.social-page #socialImageLightbox button.social-image-lightbox-close:focus,
body.social-page #socialImageLightbox button.social-image-lightbox-close:focus-visible,
body.social-page #socialImageLightbox button.social-image-lightbox-close:active{
  border-radius:10px !important;
  overflow:hidden !important;
  clip-path:inset(0 round 10px) !important;
}
/* === end social596 === */

/* social597: equalize inner right/left spacing in image-generation panel.
   Keep the grey panel dimensions unchanged; only extend its internal content
   into the unused 16px area on the right. */
body.social-page.social-zone-generate
.generation-logo-workspace.logo-generation-shell
.gen-preview-editor
.social-generation-description.social-generation-editor.gen-preview38-editor > .gen-desc-head,
body.social-page.social-zone-generate
.generation-logo-workspace.logo-generation-shell
.gen-preview-editor
.social-generation-description.social-generation-editor.gen-preview38-editor > #generationPromptInput,
body.social-page.social-zone-generate
.generation-logo-workspace.logo-generation-shell
.gen-preview-editor
.social-generation-description.social-generation-editor.gen-preview38-editor > .gen-upload-zones,
body.social-page.social-zone-generate
.generation-logo-workspace.logo-generation-shell
.gen-preview-editor
.social-generation-description.social-generation-editor.gen-preview38-editor > .gen-desc-controls,
body.social-page.social-zone-generate
.generation-logo-workspace.logo-generation-shell
.gen-preview-editor
.social-generation-description.social-generation-editor.gen-preview38-editor > .gen-bg-toggle-wrap{
  width:calc(100% + 16px) !important;
  max-width:none !important;
  min-width:0 !important;
  box-sizing:border-box !important;
}

@media(max-width:760px){
  body.social-page.social-zone-generate
  .generation-logo-workspace.logo-generation-shell
  .gen-preview-editor
  .social-generation-description.social-generation-editor.gen-preview38-editor > .gen-desc-head,
  body.social-page.social-zone-generate
  .generation-logo-workspace.logo-generation-shell
  .gen-preview-editor
  .social-generation-description.social-generation-editor.gen-preview38-editor > #generationPromptInput,
  body.social-page.social-zone-generate
  .generation-logo-workspace.logo-generation-shell
  .gen-preview-editor
  .social-generation-description.social-generation-editor.gen-preview38-editor > .gen-upload-zones,
  body.social-page.social-zone-generate
  .generation-logo-workspace.logo-generation-shell
  .gen-preview-editor
  .social-generation-description.social-generation-editor.gen-preview38-editor > .gen-desc-controls,
  body.social-page.social-zone-generate
  .generation-logo-workspace.logo-generation-shell
  .gen-preview-editor
  .social-generation-description.social-generation-editor.gen-preview38-editor > .gen-bg-toggle-wrap{
    width:100% !important;
  }
}
/* === end social597 === */



/* === Atomic main-tab switching: no stale generator frame === */
body.social-page.social-mode-switching #socialGrid{
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* Служебные delete-кнопки никогда не должны вспыхивать между режимами. */
body.social-page.social-mode-switching .gen-upload-delete,
body.social-page.social-mode-switching .video-upload-delete,
body.social-page.social-mode-switching .marketplace-upload-delete{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
}

/* Страховка для медиа старого режима до нового render(). */
body.social-page.social-mode-switching #socialGrid img,
body.social-page.social-mode-switching #socialGrid video{
  visibility:hidden !important;
}


/* === Virtualized infinite feed === */
#socialGrid.is-grid > .social-virtual-spacer{
  grid-column:1 / -1 !important;
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  pointer-events:none !important;
  visibility:hidden !important;
}

#socialLoadMore.social-load-more-auto{
  /* Кнопка остаётся доступной как ручной fallback,
     но IntersectionObserver использует её как sentinel заранее. */
  margin-top:18px;
}


/* === Three-dot menu over lower white panel: scroll-safe === */
/* .social-main remains the scroll owner. Only the card/menu may overflow. */
body.social-page .social-main{
  height:100vh !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}

body.social-page #socialGrid,
body.social-page #socialGrid.is-grid{
  overflow:visible !important;
}

body.social-page #socialGrid.is-grid > .social-card.menu-open,
body.social-page #socialGrid.is-grid > .social-grid-card.menu-open,
body.social-page .social-generation-row.menu-open{
  position:relative !important;
  overflow:visible !important;
  z-index:100000 !important;
}

body.social-page .social-card.menu-open .social-card-actions,
body.social-page .social-card.menu-open .social-grid-footer,
body.social-page .social-grid-card.menu-open .social-grid-footer{
  overflow:visible !important;
  position:relative !important;
  z-index:100001 !important;
}

body.social-page .social-menu-wrap.open{
  position:relative !important;
  z-index:100002 !important;
}

body.social-page .social-menu-wrap.open .social-menu{
  position:absolute !important;
  right:-3px !important;
  left:auto !important;
  z-index:100003 !important;
  box-shadow:0 12px 34px rgba(15,23,42,.20) !important;
}

body.social-page .social-menu-wrap.open:not(.drop-up) .social-menu{
  top:calc(100% + 6px) !important;
  bottom:auto !important;
}

body.social-page .social-menu-wrap.open.drop-up .social-menu{
  top:auto !important;
  bottom:calc(100% + 6px) !important;
}
/* === end three-dot menu over lower white panel === */

/* === Drag-and-drop uploads: image, video and marketplace generators === */
body.social-page [data-upload-zone],
body.social-page [data-video-upload-zone]{
  transition:border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
body.social-page [data-upload-zone].is-dragover,
body.social-page [data-video-upload-zone].is-dragover{
  border-color:#2563eb !important;
  background:rgba(37,99,235,.07) !important;
  box-shadow:0 0 0 3px rgba(37,99,235,.14) !important;
}
body.social-page.social-dark [data-upload-zone].is-dragover,
body.social-page.social-dark [data-video-upload-zone].is-dragover{
  border-color:#60a5fa !important;
  background:rgba(96,165,250,.12) !important;
  box-shadow:0 0 0 3px rgba(96,165,250,.18) !important;
}
/* === end drag-and-drop uploads === */