.futuron-workspace-wrap{
  display:grid;
  gap:16px;
}

.futuron-workspace-wrap .futuron-app-page-head h1{
  font-size:22px;
  font-weight:800;
  color:#0f1b38;
}

.futuron-broadcast-list{
  display:grid;
  gap:14px;
}
.futuron-broadcast-card{
  border:1px solid #d3e3ed;
  border-radius:16px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 10px 24px rgba(10,35,64,0.08);
}
.futuron-broadcast-card.is-alert{
  border-color:rgba(179,45,46,0.28);
  box-shadow:0 10px 24px rgba(179,45,46,0.08);
}
.futuron-broadcast-banner img{
  display:block;
  width:100%;
  max-height:180px;
  object-fit:cover;
}
.futuron-broadcast-body{
  padding:16px;
}
.futuron-broadcast-type{
  display:inline-block;
  margin-bottom:8px;
  padding:3px 10px;
  border-radius:999px;
  background:rgba(47,122,138,0.12);
  color:#1f4d73;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
}
.futuron-broadcast-card.is-alert .futuron-broadcast-type{
  background:rgba(179,45,46,0.12);
  color:#b32d2e;
}
.futuron-broadcast-body h3{
  margin:0 0 8px;
  font-size:18px;
  color:#0f1b38;
}
.futuron-broadcast-body p{
  margin:0;
  color:#556170;
  line-height:1.5;
}
.futuron-broadcast-date{
  display:block;
  margin-top:10px;
  font-size:12px;
  color:#6b7a8b;
}
.futuron-activity-list{
  display:grid;
  gap:10px;
}
.futuron-activity-entry{
  display:grid;
  gap:0;
}
.futuron-activity-item{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px 14px;
  align-items:center;
  min-height:72px;
  padding:14px 16px;
  border:1px solid #d3e3ed;
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 20px rgba(10,35,64,0.06);
}
.futuron-activity-item.is-clickable{
  cursor:pointer;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.futuron-activity-item.is-clickable:hover,
.futuron-activity-item.is-clickable.is-expanded{
  border-color:#2f7a8a;
  box-shadow:0 6px 16px rgba(47,122,138,0.08);
}
.futuron-activity-details{
  margin-top:-4px;
  padding:10px 14px 12px;
  border:1px solid #d7e2ea;
  border-top:0;
  border-radius:0 0 12px 12px;
  background:#f6fbff;
}
.futuron-activity-details ul{
  margin:0;
  padding-left:18px;
  color:#1f4d73;
  font-size:13px;
  line-height:1.5;
}
.futuron-activity-hint{
  display:inline-block;
  margin-left:6px;
  font-size:11px;
  font-weight:600;
  color:#2f7a8a;
}
.futuron-activity-label{
  margin:0;
  font-weight:700;
  color:#0f1b38;
}
.futuron-activity-meta{
  margin:4px 0 0;
  font-size:12px;
  color:#6b7a8b;
}
.futuron-activity-time{
  font-size:12px;
  color:#6b7a8b;
  white-space:nowrap;
}
.futuron-activity-filters{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:12px;
}
.futuron-activity-filter{
  border:1px solid #d7e2ea;
  background:#fff;
  border-radius:999px;
  padding:6px 12px;
  font-size:12px;
  font-weight:700;
  color:#1f4d73;
  text-decoration:none;
}
.futuron-activity-filter.is-active{
  background:#2f7a8a;
  border-color:#2f7a8a;
  color:#fff;
}
.futuron-hub-tile--workspace .futuron-hub-tile-icon{
  background:linear-gradient(145deg,#5b3fd6,#2f7a8a);
}
.futuron-hub-tile-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20px;
  height:20px;
  padding:0 6px;
  border-radius:999px;
  background:#b32d2e;
  color:#fff;
  font-size:11px;
  font-weight:800;
}
.futuron-ai-wrap .futuron-ai-placeholder{
  text-align:center;
  padding:28px 18px;
}
.futuron-ai-wrap .futuron-ai-placeholder h2{
  margin:0 0 8px;
}
.futuron-ai-locked{
  padding:18px;
  border-radius:14px;
  background:#f6fbff;
  border:1px solid #d7e2ea;
}
/* ========== Social feed (Facebook-style � FUTURON) ========== */
.futuron-workspace-social{
  display:grid;
  gap:14px;
  max-width:680px;
  min-width:0;
  width:100%;
  margin:0 auto;
  box-sizing:border-box;
  padding:8px 4px 12px;
}
/* Desktop shell: feed owns the main column beside apps rail */
@media (min-width:1024px){
  .futuron-app-shell--workspace .futuron-workspace-social{
    max-width:min(100%, 820px);
    margin:0;
    padding:10px 16px 20px;
  }
}
.ff-page-head h1{
  font-size:22px;
  font-weight:800;
  color:#0f1b38;
}
.ff-page-head--tabs-only{
  margin-bottom:4px;
}
.ff-page-head--tabs-only .futuron-app-tabs{
  margin-top:0;
}
/* Workspace page header: row1 title+tools, row2 tabs — same on mobile & desktop */
.ff-ws-head{
  display:flex;
  flex-direction:column;
  gap:10px;
  width:100%;
}
.ff-ws-head-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
}
.ff-ws-section-meta{
  flex:1 1 auto;
  min-width:0;
  max-width:min(100%, 360px);
}
.ff-ws-section-title{
  margin:0;
  font-size:16px;
  font-weight:800;
  color:#0f1b38;
  line-height:1.25;
}
.ff-ws-section-desc{
  margin:3px 0 0;
  font-size:12px;
  color:#6b7a8b;
  line-height:1.4;
}
.ff-ws-tools{
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
  margin-left:auto;
}
.ff-ws-tool{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:999px;
  border:1px solid #c5d8e6;
  background:#fff;
  color:#1f4d73;
  text-decoration:none;
  box-sizing:border-box;
  transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease;
}
.ff-ws-tool:hover{
  background:#eef6fb;
  border-color:#1f4d73;
  color:#0f1b38;
}
.ff-ws-tool.is-active{
  border-color:#1f4d73;
  background:#e8f2fa;
  color:#0f1b38;
}
.ff-ws-tool--eye.is-active{
  border-color:#a66f12;
  background:linear-gradient(180deg,#fff8e8,#ffefd0);
  color:#8a5a10;
  box-shadow:0 0 0 2px rgba(201,139,46,.18);
}
.ff-oversight-banner{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin:8px 0 2px;
  padding:10px 12px;
  border-radius:12px;
  border:1px dashed rgba(166,111,18,.45);
  background:linear-gradient(180deg,#fffbf2,#fff6e4);
  color:#5c4314;
  font-size:12.5px;
  line-height:1.4;
}
.ff-oversight-banner strong{font-weight:800;margin-inline-end:4px}
.ff-oversight-banner-ico{flex:0 0 auto;line-height:1.2}
.ff-oversight-chip{
  display:inline-block;
  margin-inline-start:6px;
  padding:1px 7px;
  border-radius:999px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#8a5a10;
  background:rgba(201,139,46,.16);
  vertical-align:middle;
}
.ff-company-chip{
  display:inline-block;
  margin-inline-start:6px;
  padding:1px 7px;
  border-radius:999px;
  font-size:10px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#0b6e4f;
  background:rgba(15,140,102,.14);
  vertical-align:middle;
}
.ff-post.is-oversight-only{
  border:1px dashed rgba(166,111,18,.5);
  background:linear-gradient(180deg,#fffdf8 0%,#fff 55%);
  box-shadow:0 0 0 1px rgba(201,139,46,.08),0 10px 24px rgba(10,35,64,.05);
}
.ff-oversight-post-flag{
  margin:0;
  padding:8px 14px 0;
  font-size:11px;
  font-weight:700;
  color:#8a5a10;
  letter-spacing:.02em;
}
.ff-group-chat-row.is-oversight-only{
  border:1px dashed rgba(166,111,18,.4);
  background:linear-gradient(180deg,#fffbf2,#fff);
  border-radius:12px;
  opacity:.92;
}
.ff-groups-chat-list li.is-oversight-only{
  margin-top:2px;
}
.ff-ws-tool-icon{
  display:block;
  flex-shrink:0;
}
.ff-ws-tabs,
.ff-ws-head .futuron-app-tabs{
  width:100%;
  margin-top:0;
  flex:none;
}
/* Desktop: don't clip the active-tab underline (overflow-x:auto hides it). */
@media (min-width:721px){
  .futuron-app-shell .ff-ws-tabs.futuron-app-tabs,
  .futuron-app-shell .ff-ws-head .futuron-app-tabs{
    overflow:visible;
    flex-wrap:wrap;
  }
  .futuron-app-shell .ff-ws-tabs .futuron-app-tab.is-active,
  .futuron-app-shell .ff-ws-head .futuron-app-tab.is-active{
    border-bottom-width:3px;
    border-bottom-color:#2f7a8a;
    color:#0f1b38;
  }
}
@media (max-width:480px){
  .ff-ws-section-title{font-size:15px}
  .ff-ws-tool{width:34px;height:34px}
}
.ff-settings-page{
  max-width:560px;
  padding:18px 18px 20px;
}
.ff-settings-title{
  margin:0 0 6px;
  font-size:20px;
  font-weight:800;
  color:#0f1b38;
}
.ff-settings-lead{
  margin:0 0 16px;
  color:#556170;
  font-size:13px;
  line-height:1.5;
}
.ff-settings-card{
  border:1px solid #e2ebf2;
  border-radius:12px;
  background:#f8fbfd;
  padding:14px 14px 16px;
}
.ff-settings-card-title{
  margin:0 0 4px;
  font-size:15px;
  font-weight:800;
  color:#0f1b38;
}
.ff-settings-card-desc{
  margin:0 0 12px;
  font-size:12px;
  color:#6b7a8b;
  line-height:1.45;
}
.ff-notify-row{
  display:flex;
  gap:10px;
  align-items:flex-start;
  margin:0 0 12px;
  font-size:13px;
  color:#0f1b38;
  cursor:pointer;
}
.ff-notify-row input{
  margin-top:3px;
  flex-shrink:0;
}
.ff-notify-row strong{
  display:block;
  font-weight:700;
}
.ff-notify-hint{
  display:block;
  margin-top:2px;
  color:#6b7a8b;
  font-size:12px;
  font-weight:400;
}
.ff-notify-company-note{
  margin:0 0 14px;
  font-size:12px;
  color:#6b7a8b;
}
.ff-settings-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
}
.ff-settings-msg{
  font-size:13px;
  color:#15803d;
  font-weight:600;
}
.ff-settings-msg.is-error{
  color:#b91c1c;
}
.ff-panel{
  padding:16px;
}
.ff-inbox-soon{
  text-align:center;
  padding:36px 20px;
}
.ff-inbox-soon-icon{font-size:40px;margin-bottom:8px}
.ff-inbox-soon h2{margin:0 0 8px;font-size:18px;color:#0f1b38}
.ff-inbox-soon p{margin:0;color:#556170;line-height:1.5;max-width:360px;margin-inline:auto}

/* Composer */
.ff-composer{
  padding:14px 14px 12px;
  border-radius:16px;
  background:#fff;
  border:1px solid #d3e3ed;
  box-shadow:0 8px 22px rgba(10,35,64,0.07);
}
.ff-composer-row{
  display:flex;
  gap:12px;
  align-items:flex-start;
}
.ff-composer-main{flex:1;min-width:0}
.ff-composer-type{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:8px;
  font-size:12px;
  font-weight:700;
  color:#1f4d73;
}
.ff-composer-type label{
  display:inline-flex;
  align-items:center;
  gap:4px;
  cursor:pointer;
}
/* Admin: clear Personal vs Company split */
.ff-composer-mode{
  display:flex;
  gap:0;
  margin:0 0 8px;
  padding:3px;
  border-radius:12px;
  background:#eef3f7;
  border:1px solid #d3e3ed;
}
.ff-composer-mode-btn{
  flex:1 1 50%;
  border:0;
  background:transparent;
  color:#556170;
  font-size:13px;
  font-weight:800;
  padding:9px 10px;
  border-radius:10px;
  cursor:pointer;
  line-height:1.2;
}
.ff-composer-mode-btn.is-active{
  background:#fff;
  color:#0f1b38;
  box-shadow:0 1px 4px rgba(15,27,56,.1);
}
.ff-composer-mode-hint{
  margin:0 0 10px;
  font-size:12px;
  color:#6b7a8b;
  line-height:1.4;
}
.ff-composer-company{
  margin:0 0 10px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid #c5daf0;
  background:linear-gradient(180deg,#f4f9fd 0%,#eef6fb 100%);
}
.ff-composer-company[hidden],
.ff-composer-personal[hidden]{display:none !important}
.ff-composer-company-note{
  margin:6px 0 0;
  font-size:11px;
  color:#5a7a96;
}
.ff-composer-type--official{
  margin-bottom:10px;
}
.ff-composer-voice{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px 14px;
  margin:0 0 10px;
  padding:8px 10px;
  border:1px solid #d0d7de;
  border-radius:8px;
  background:#fff;
  font-size:12px;
  color:#1f4d73;
}
.ff-composer-voice[hidden]{display:none !important}
.ff-composer-voice label{
  display:inline-flex;
  align-items:center;
  gap:4px;
  cursor:pointer;
  font-weight:600;
}
.ff-composer-company .ff-composer-title{
  margin-bottom:10px;
}
.ff-composer-company .ff-composer-pin{
  margin-bottom:4px;
}
.ff-composer-title{
  width:100%;
  box-sizing:border-box;
  margin-bottom:8px;
  padding:10px 12px;
  border:1px solid #d3e3ed;
  border-radius:10px;
  font:inherit;
  font-size:14px;
}
.ff-composer-body{
  width:100%;
  box-sizing:border-box;
  min-height:52px;
  padding:12px 14px;
  border:1px solid #d3e3ed;
  border-radius:20px;
  background:#f4f7fa;
  font:inherit;
  font-size:15px;
  resize:vertical;
  line-height:1.4;
}
.ff-composer-body:focus{
  outline:none;
  border-color:#56a9b5;
  background:#fff;
  box-shadow:0 0 0 3px rgba(86,169,181,0.18);
}
.ff-composer-preview{
  position:relative;
  margin-top:10px;
  border-radius:12px;
  overflow:hidden;
  border:1px solid #d3e3ed;
}
.ff-composer-preview img{
  display:block;
  width:100%;
  max-height:220px;
  object-fit:cover;
}
.ff-composer-preview-x{
  position:absolute;
  top:8px;
  right:8px;
  width:28px;
  height:28px;
  border:0;
  border-radius:50%;
  background:rgba(15,27,56,0.75);
  color:#fff;
  font-size:18px;
  cursor:pointer;
}
.ff-composer-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid #eef3f7;
}
.ff-composer-photo-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 12px;
  border-radius:999px;
  font-size:13px;
  font-weight:700;
  color:#2f7a8a;
  background:#e8f6f8;
  cursor:pointer;
}
.ff-composer-drive-preview{
  display:flex;align-items:center;gap:8px;
  margin:8px 0;padding:10px 12px;background:#f0f7f8;border-radius:12px;font-size:13px;
}
.ff-composer-drive-preview[hidden]{display:none !important}
.ff-drive-name{font-weight:700;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ff-drive-attach-list{
  display:grid;
  gap:8px;
  /* Horizontal inset lives here so cards can be width:100% without overflow */
  padding:0 12px 10px;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  min-width:0;
}
.ff-drive-attach-list .ff-drive-attach{
  margin:0;
  width:100%;
  max-width:100%;
}
.ff-drive-attach{
  display:grid;
  /*
   * Root cause of cut "Open" on mobile:
   * max-width:100% + horizontal margin makes the box wider than the parent
   * (margins are outside the 100% width) → right edge (Open) is clipped.
   * Fix: width accounts for horizontal margins (or 100% when list supplies padding).
   */
  grid-template-columns:auto minmax(0, 1fr) auto;
  align-items:center;
  gap:8px 10px;
  margin:8px 12px 10px;
  /* Cap width so margin never overflows parent */
  width:calc(100% - 24px);
  max-width:calc(100% - 24px);
  padding:10px 12px;
  border:1px solid #d3e3ed;
  border-radius:14px;
  background:#f7fbfc;
  box-sizing:border-box;
  min-width:0;
  overflow:hidden; /* only name ellipsizes; Open has its own track */
  text-decoration:none;
  color:inherit;
}
a.ff-drive-attach:hover{border-color:#b7d0db;background:#f0f8fa}
.ff-drive-attach--pdf{background:linear-gradient(135deg,#fff5f5,#fff);border-color:#f0c9c9}
.ff-drive-attach--doc{background:linear-gradient(135deg,#f0f6ff,#fff);border-color:#c9d9f0}
.ff-drive-attach--sheet{background:linear-gradient(135deg,#f0faf4,#fff);border-color:#c3e6d0}
.ff-drive-attach--slide{background:linear-gradient(135deg,#fff8f0,#fff);border-color:#f0d9b8}
.ff-drive-attach--video{background:linear-gradient(135deg,#f6f0ff,#fff);border-color:#d7c6f0}
.ff-drive-attach--folder{background:linear-gradient(135deg,#f0f7f8,#fff)}
.ff-drive-attach-ico{
  font-size:22px;
  line-height:1;
  flex-shrink:0;
  min-width:1.4em;
  text-align:center;
}
.ff-drive-attach-body{
  min-width:0;
  max-width:100%;
  overflow:hidden;
}
.ff-drive-attach-name,
.ff-drive-attach-body strong{
  display:block;
  font-size:13px;
  font-weight:700;
  color:#0f1b38;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:100%;
}
.ff-drive-attach-body small{
  display:block;
  color:#6b7a8b;
  font-size:11px;
  margin-top:2px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ff-drive-attach-via{
  color:#2f7a8a !important;
  font-size:10px;
  font-weight:700;
  letter-spacing:.02em;
  white-space:nowrap;
}
.ff-drive-attach-by{
  color:#6b7a8b !important;
  font-size:10px !important;
  font-weight:600 !important;
  letter-spacing:0;
  white-space:nowrap;
}
.ff-drive-attach--reply{
  border-style:dashed;
}
.ff-drive-attach-open{
  flex-shrink:0;
  justify-self:end;
  align-self:center;
  font-weight:800;
  font-size:12px;
  color:#2f7a8a;
  text-decoration:none;
  padding:6px 10px;
  border-radius:999px;
  background:#e8f6f8;
  white-space:nowrap;
  line-height:1.2;
  /* Reserve space so Open never collapses out of the grid */
  min-width:max-content;
}
.ff-drive-attach-open:hover{filter:brightness(.97)}
@media (max-width:560px){
  .ff-drive-attach-list{padding:0 10px 10px}
  /* Single card (not in a list): still fit inside post */
  .ff-drive-attach{
    margin:6px 10px 8px;
    width:calc(100% - 20px);
    max-width:calc(100% - 20px);
    padding:10px;
    gap:8px 6px;
    /* Stack Open on its own row — guaranteed full visibility on narrow phones */
    grid-template-columns:auto minmax(0, 1fr);
    grid-template-areas:
      "ico body"
      "open open";
  }
  .ff-drive-attach-list .ff-drive-attach{
    width:100%;
    max-width:100%;
  }
  .ff-drive-attach-ico{grid-area:ico;font-size:18px}
  .ff-drive-attach-body{grid-area:body}
  .ff-drive-attach-open{
    grid-area:open;
    justify-self:stretch;
    text-align:center;
    padding:8px 10px;
    font-size:12px;
    min-width:0;
    margin-top:2px;
  }
  .ff-drive-attach-name,
  .ff-drive-attach-body strong{font-size:12px}
}

/* Drive attachments: icons only (no thumbnails / no media preview load). */
.ff-composer-photo-hint{
  font-size:11px;
  font-weight:600;
  color:#6b7a8b;
  opacity:.9;
}
.ff-composer-submit{
  padding:9px 20px;
  border:0;
  border-radius:999px;
  background:linear-gradient(145deg,#1f4d73,#2f7a8a);
  color:#fff;
  font-size:14px;
  font-weight:800;
  cursor:pointer;
}
.ff-composer-submit:disabled{opacity:.6;cursor:wait}
.ff-composer-msg{margin:8px 0 0;font-size:12px;color:#2f7a8a}
.ff-composer-msg.is-error{color:#b91c1c}

/* Avatar */
.ff-avatar{
  width:40px;
  height:40px;
  border-radius:50%;
  flex-shrink:0;
  background:#e8f0f5;
}
img.ff-avatar:not(.ff-avatar--brand){
  object-fit:contain;
  object-position:center;
  background:#56a9b5;
  box-sizing:border-box;
}
.ff-avatar--sm{width:32px;height:32px}
/* Company voice (news / alert / welcome): light mark on clean white disc */
.ff-avatar--brand{
  object-fit:contain;
  object-position:center;
  background:#fff;
  padding:5px;
  box-sizing:border-box;
  border:1px solid rgba(15,27,56,0.08);
  box-shadow:0 1px 2px rgba(10,35,64,0.06);
}
.ff-avatar--sm.ff-avatar--brand{
  padding:4px;
}
.ff-avatar--init{
  display:grid;
  place-items:center;
  box-sizing:border-box;
  padding:0;
  margin:0;
  border:0;
  font-size:14px;
  font-weight:800;
  line-height:1;
  letter-spacing:0;
  text-indent:0;
  text-align:center;
  color:#0f1b38;
  background:linear-gradient(145deg,#56a9b5,#e8f6f8);
  direction:ltr;
  unicode-bidi:isolate;
}

/* Post card */
.ff-feed{display:grid;gap:14px;min-width:0;max-width:100%;width:100%}
.ff-post{
  background:#fff;
  border:1px solid #d3e3ed;
  border-radius:16px;
  box-shadow:0 8px 22px rgba(10,35,64,0.07);
  /* visible so @mention dropdown is not clipped; images clip themselves */
  overflow:visible;
  /* Keep card inside app-main (overflow-x:clip) so nested panels can scroll. */
  max-width:100%;
  min-width:0;
  width:100%;
  box-sizing:border-box;
}
.ff-post-image,
.ff-shared-image{
  overflow:hidden;
  border-radius:0 0 12px 12px;
}
.ff-post.is-alert{
  border-color:rgba(179,45,46,0.28);
  box-shadow:0 8px 22px rgba(179,45,46,0.08);
}
.ff-post-head{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px 8px;
}
.ff-post-meta{flex:1;min-width:0}
.ff-post-author{
  display:block;
  font-size:14px;
  font-weight:800;
  color:#0f1b38;
  line-height:1.25;
}
.ff-post-sub{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  margin-top:2px;
}
.ff-post-time{font-size:12px;color:#6b7a8b}
.ff-post-badge{
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:0.04em;
  background:rgba(47,122,138,0.12);
  color:#1f4d73;
}
.ff-post-badge--alert{
  background:rgba(179,45,46,0.12);
  color:#b32d2e;
}
.ff-post-badge--welcome{
  background:rgba(86,169,181,0.18);
  color:#0f1b38;
}
/* ⋯ post menu only — do NOT apply to See more (same class name historically). */
.ff-post-tools .ff-post-more,
button.ff-post-more[data-ff-menu-toggle]{
  border:0;
  background:transparent;
  color:#6b7a8b;
  font-size:22px;
  line-height:1;
  padding:4px 10px;
  cursor:pointer;
  border-radius:50%;
  width:36px;
  height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.ff-post-tools .ff-post-more:hover,
.ff-post-tools.is-open .ff-post-more,
button.ff-post-more[data-ff-menu-toggle]:hover{
  background:#f0f2f5;
  color:#0f1b38;
}
.ff-post-tools{
  position:relative;
}
.ff-post-menu{
  position:absolute;
  top:calc(100% + 4px);
  right:0;
  min-width:180px;
  background:#fff;
  border:1px solid #e4ebf0;
  border-radius:12px;
  box-shadow:0 12px 28px rgba(10,35,64,0.16);
  z-index:30;
  padding:6px 0;
  overflow:hidden;
}
.ff-post-menu[hidden]{display:none !important}
.ff-post-menu-item{
  display:block;
  width:100%;
  text-align:left;
  border:0;
  background:transparent;
  padding:10px 14px;
  font:inherit;
  font-size:14px;
  font-weight:600;
  color:#0f1b38;
  cursor:pointer;
}
.ff-post-menu-item:hover{background:#f0f2f5}
.ff-post-menu-item.is-danger{color:#b91c1c}
.ff-post-menu-item.is-danger:hover{background:#fef2f2}
.ff-ui-ico{
  display:block;
  flex-shrink:0;
  width:14px;
  height:14px;
}
.ff-composer-collapsed-photo .ff-ui-ico{
  width:20px;
  height:20px;
}
.ff-post-audience-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  line-height:1;
  opacity:.9;
  cursor:default;
}
.ff-post-audience-icon .ff-ui-ico{
  width:14px;
  height:14px;
}
.ff-post-audience-icon--public{opacity:.85}
.ff-post-audience-icon--private{filter:none}
.ff-post-audience-icon--group{opacity:.95}
.ff-post-editor{
  padding:0 14px 12px;
  display:grid;
  gap:8px;
}
.ff-post-editor[hidden]{display:none !important}
.ff-post-body{padding:0 14px 10px}
/* Bidi: per-block direction (bilingual EN+AR posts). Shell stays dir=auto. */
.ff-post-text,
.ff-comment-bubble p,
.ff-shared-text,
.ff-composer-body.ff-rte-body,
.ff-group-desc.ff-rte-body,
.ff-rte-body{
  unicode-bidi:plaintext;
  text-align:start;
}
/* Each paragraph/heading/list item owns alignment — never whole-document dir. */
.ff-post-text > [dir="rtl"],
.ff-shared-text > [dir="rtl"],
.ff-rte-body > [dir="rtl"],
.ff-composer-body.ff-rte-body > [dir="rtl"],
.ff-group-desc.ff-rte-body > [dir="rtl"],
.ff-post-text li[dir="rtl"],
.ff-rte-body li[dir="rtl"],
.ff-comment-bubble p[dir="rtl"]{
  text-align:right;
  unicode-bidi:plaintext;
}
.ff-post-text > [dir="ltr"],
.ff-shared-text > [dir="ltr"],
.ff-rte-body > [dir="ltr"],
.ff-composer-body.ff-rte-body > [dir="ltr"],
.ff-group-desc.ff-rte-body > [dir="ltr"],
.ff-post-text li[dir="ltr"],
.ff-rte-body li[dir="ltr"],
.ff-comment-bubble p[dir="ltr"]{
  text-align:left;
  unicode-bidi:plaintext;
}
/* Fallback when body has no block children (plain text / single run). */
.ff-post-text[dir="rtl"],
.ff-shared-text[dir="rtl"],
.ff-rte-body[dir="rtl"],
.ff-comment-bubble p[dir="rtl"]{
  text-align:right;
}
.ff-post-text[dir="ltr"],
.ff-shared-text[dir="ltr"],
.ff-rte-body[dir="ltr"],
.ff-comment-bubble p[dir="ltr"]{
  text-align:left;
}
.ff-post-title{
  margin:0 0 6px;
  font-size:16px;
  font-weight:800;
  color:#0f1b38;
  line-height:1.3;
}
.ff-post-text{
  margin:0;
  font-size:15px;
  line-height:1.5;
  color:#1a2a3a;
  white-space:normal;
  word-break:break-word;
}
.ff-post-text p{margin:0 0 .55em}
.ff-post-text p:last-child{margin-bottom:0}
.ff-post-text ul,.ff-post-text ol{margin:.35em 0 .65em;padding-left:1.35em}
.ff-post-text li{margin:.15em 0}
.ff-post-text a{color:#0b3d5c;text-decoration:underline;font-weight:600}
.ff-post-text strong,.ff-post-text b{font-weight:700}
.ff-post-text em,.ff-post-text i{font-style:italic}
.ff-post-text u{text-decoration:underline}
.ff-post-text blockquote{
  margin:.4em 0;
  padding:.35em .75em;
  border-left:3px solid #2f7a8a;
  color:#334155;
  background:#f8fbfd;
  border-radius:0 8px 8px 0;
}
.ff-post-text-wrap{position:relative}
.ff-post-text.is-clamped{
  max-height:7.5em; /* ~5 lines — Facebook/LinkedIn style */
  overflow:hidden;
  position:relative;
}
.ff-post-text.is-clamped::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:2.2em;
  background:linear-gradient(to bottom, rgba(255,255,255,0), #fff 85%);
  pointer-events:none;
}
.ff-post-text.is-expanded{max-height:none;overflow:visible}
.ff-post-text.is-expanded::after{display:none}
/* “See more / See less” under post body — full-width text control, not the ⋯ circle. */
.ff-post-text-wrap .ff-post-more,
button.ff-post-more[data-ff-post-more]{
  display:inline-block;
  width:auto;
  height:auto;
  min-width:0;
  margin-top:4px;
  padding:2px 0;
  border:0;
  border-radius:0;
  background:none;
  color:#2f7a8a;
  font-family:inherit;
  font-size:14px;
  font-weight:700;
  line-height:1.35;
  white-space:nowrap;
  cursor:pointer;
  vertical-align:baseline;
}
.ff-post-text-wrap .ff-post-more:hover,
button.ff-post-more[data-ff-post-more]:hover{
  text-decoration:underline;
  background:none;
  color:#1f4d73;
}
.ff-post-text-wrap .ff-post-more[hidden],
button.ff-post-more[data-ff-post-more][hidden]{
  display:none !important;
}

/* YouTube playable embeds (from URL in post body) */
.ff-yt-list{
  margin:10px 0 4px;
  display:grid;
  gap:10px;
  padding:0 0 2px;
}
.ff-post-body > .ff-yt-list{
  margin-left:0;
  margin-right:0;
}
.ff-yt-embed{
  position:relative;
  width:100%;
  padding-bottom:56.25%; /* 16:9 */
  height:0;
  overflow:hidden;
  border-radius:12px;
  background:#0f0f0f;
  box-shadow:0 1px 3px rgba(10,35,64,0.12);
}
.ff-yt-embed iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}
.ff-shared-card .ff-yt-list{margin:8px 0 0}
.ff-shared-card .ff-yt-embed{border-radius:10px}

/* Separated live YouTube preview under composer / comment (not inside editor) */
.ff-yt-preview{
  margin:10px 0 4px;
  padding:10px 12px;
  border:1px solid #d3e3ed;
  border-radius:12px;
  background:#f4f7fa;
}
.ff-yt-preview[hidden]{display:none !important}
.ff-yt-preview-label{
  display:block;
  font-size:11px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#2f7a8a;
  margin:0 0 8px;
}
.ff-yt-preview-frame .ff-yt-list{margin:0}
.ff-yt-preview--comment{
  margin:0 0 8px;
  padding:8px 10px;
}
.ff-yt-preview--comment .ff-yt-embed{border-radius:10px}
.ff-comment-bubble .ff-yt-list{margin:8px 0 0}
.ff-comment-bubble .ff-yt-embed{border-radius:10px;max-width:100%}
.ff-c-reply-form{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:flex-end;
  margin-top:6px;
}
.ff-c-reply-form .ff-yt-preview{
  flex:1 1 100%;
  order:-1;
}
.ff-c-reply-form .ff-comment-input{flex:1;min-width:0}

/* Feed rich text editor (Careers-style simple formatting) */
.ff-rte{
  border:1px solid #d3e3ed;
  border-radius:14px;
  overflow:hidden;
  background:#f0f2f5;
}
.ff-rte:focus-within{
  background:#fff;
  border-color:#56a9b5;
  box-shadow:0 0 0 2px rgba(47,122,138,.15);
}
.ff-rte-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
  padding:6px 8px;
  background:#eef3f6;
  border-bottom:1px solid #e2e8f0;
}
.ff-rte-btn{
  border:1px solid #d3e3ed;
  background:#fff;
  border-radius:8px;
  padding:5px 9px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  color:#0f1b2d;
  line-height:1.2;
}
.ff-rte-btn:hover,.ff-rte-btn:focus{border-color:#2f7a8a;color:#0b3d5c;outline:none}
.ff-rte-sep{width:1px;align-self:stretch;background:#d3e3ed;margin:0 2px}
.ff-rte-body{
  min-height:72px;
  max-height:220px;
  overflow:auto;
  padding:10px 14px;
  font:inherit;
  font-size:15px;
  line-height:1.5;
  color:#050505;
  outline:none;
  background:transparent;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  white-space:normal;
  word-break:break-word;
}
.ff-rte-body:empty:before{
  content:attr(data-placeholder);
  color:#8a97a8;
  pointer-events:none;
}
.ff-rte-body p{margin:0 0 .45em}
.ff-rte-body p:last-child{margin-bottom:0}
.ff-rte-body ul,.ff-rte-body ol{margin:.3em 0 .5em;padding-left:1.3em}
.ff-rte-body a{color:#0b3d5c;text-decoration:underline}
.ff-composer-body-wrap .ff-rte{width:100%}
.ff-post-editor .ff-rte{background:#fff}
.ff-post-image img{
  display:block;
  width:100%;
  max-height:420px;
  object-fit:cover;
  background:#eef3f7;
}
.ff-post-stats{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:8px 14px;
  font-size:12px;
  color:#6b7a8b;
  border-bottom:1px solid #eef3f7;
}
.ff-post-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4px;
  padding:4px 8px;
  border-bottom:1px solid #eef3f7;
}
.ff-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:40px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#556170;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}
.ff-action:hover{background:#f4f7fa}
.ff-action.is-active{color:#2f7a8a}
.ff-action-icon{font-size:15px}

/* Comments base — detailed compact rules later (FB-style meta) */
.ff-comments{padding:8px 14px 12px}
.ff-comments-list{display:grid;gap:8px;margin-bottom:6px}
.ff-comment-form{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:flex-end;
  margin-top:4px;
  position:relative;
}
.ff-comment-input{
  flex:1;
  min-width:0;
  min-height:36px;
  max-height:140px;
  padding:8px 12px;
  border:0;
  border-radius:18px;
  background:#f0f2f5;
  font:inherit;
  font-size:13px;
  line-height:1.4;
  resize:none;
  overflow-y:hidden;
  box-sizing:border-box;
  field-sizing:content; /* modern browsers */
  unicode-bidi:plaintext;
  text-align:start;
}
.ff-comment-input[dir="rtl"]{text-align:right}
.ff-comment-input[dir="ltr"]{text-align:left}
.ff-comment-input:focus{
  outline:none;
  background:#e4e6eb;
}
.ff-comment-send{
  border:0;
  width:32px;
  height:32px;
  border-radius:50%;
  background:transparent;
  color:#2f7a8a;
  font-size:16px;
  cursor:pointer;
  flex-shrink:0;
  padding:0;
}
.ff-approval-toggle{
  flex:1 0 calc(100% - 44px);
  margin-inline-start:36px;
  appearance:none;
  border:0;
  background:transparent;
  color:#2f7a8a;
  font:inherit;
  font-size:12px;
  font-weight:700;
  text-align:start;
  padding:0 2px;
  cursor:pointer;
}
.ff-approval-toggle.is-on{color:#0f1b38}
.ff-approval-panel{
  flex:1 0 calc(100% - 44px);
  margin-inline-start:36px;
  display:grid;
  gap:8px;
  padding:8px 10px;
  border:1px solid #d3e3ed;
  border-radius:12px;
  background:#f7fafc;
}
.ff-approval-panel[hidden]{display:none !important}
.ff-approval-field{
  display:grid;
  gap:4px;
  font-size:12px;
  font-weight:700;
  color:#556170;
  position:relative;
}
.ff-approval-field select,
.ff-approval-search{
  width:100%;
  min-height:34px;
  padding:6px 8px;
  border:1px solid #d3e3ed;
  border-radius:8px;
  font:inherit;
  font-size:13px;
  font-weight:500;
  background:#fff;
  box-sizing:border-box;
}
.ff-approval-picked{
  font-size:12px;
  font-weight:700;
  color:#0f1b38;
}
.ff-approval-cc-chips{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
}
.ff-approval-cc-chip{
  appearance:none;
  border:0;
  border-radius:999px;
  background:rgba(47,122,138,0.12);
  color:#0f1b38;
  font:inherit;
  font-size:12px;
  font-weight:700;
  padding:3px 8px;
  cursor:pointer;
}
.ff-approval{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:4px 8px;
  margin:4px 0 2px;
}
.ff-approval-kicker{
  font-size:10px;
  font-weight:800;
  letter-spacing:0.04em;
  color:#2f7a8a;
}
.ff-approval-state{
  font-size:10px;
  font-weight:800;
  padding:1px 6px;
  border-radius:999px;
  background:rgba(47,122,138,0.12);
  color:#2f7a8a;
}
.ff-approval-state.is-approved{
  background:rgba(22,163,74,0.12);
  color:#15803d;
}
.ff-approval-state.is-declined{
  background:rgba(185,28,28,0.1);
  color:#b91c1c;
}
.ff-approval-line{
  flex:1 0 100%;
  margin:0;
  font-size:12px;
  font-weight:600;
  color:#556170;
}
.ff-approval-btn{
  appearance:none;
  border:0;
  background:transparent;
  font:inherit;
  font-size:12px;
  font-weight:800;
  padding:2px 6px;
  cursor:pointer;
  color:#2f7a8a;
}
.ff-approval-btn.is-decline{color:#b91c1c}
.ff-comment.is-approval .ff-comment-bubble{
  background:#eef6f8;
}
.ff-comment.is-highlight,
.ff-comment.is-approval.is-highlight{
  outline:2px solid rgba(47,122,138,0.35);
  outline-offset:2px;
  border-radius:12px;
}
.ff-task-item.has-approval{
  position:relative;
}
.ff-task-item.has-approval::before{
  content:'';
  position:absolute;
  inset-inline-start:3px;
  top:8px;
  bottom:8px;
  width:3px;
  border-radius:3px;
  background:#2f7a8a;
  pointer-events:none;
}
.ff-feed-pager{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:16px;
  padding:8px;
  font-size:13px;
  color:#556170;
}
.ff-feed-pager a{color:#2f7a8a;font-weight:700;text-decoration:none}

/* Workplace community extras */
.ff-composer-policy{
  margin:10px 0 0;
  font-size:11px;
  line-height:1.45;
  color:#6b7a8b;
}
.ff-composer-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  margin-bottom:8px;
  font-size:12px;
  font-weight:600;
  color:#1f4d73;
}
.ff-composer-tags-label{color:#6b7a8b;font-weight:700}
.ff-composer-pin{
  display:inline-flex;
  align-items:center;
  gap:6px;
  margin-bottom:8px;
  font-size:12px;
  font-weight:700;
  color:#1f4d73;
}
.ff-feed-filters{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0 0 4px;
}
.ff-feed-filter{
  padding:7px 12px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  text-decoration:none;
  color:#556170;
  background:#fff;
  border:1px solid #d3e3ed;
}
.ff-feed-filter.is-active,
.ff-feed-filter:hover{
  color:#fff;
  background:#2f7a8a;
  border-color:#2f7a8a;
}
.ff-post.is-pinned,
.ff-post.is-profile-pinned{
  border-color:rgba(47,122,138,0.45);
  box-shadow:0 10px 28px rgba(47,122,138,0.14);
}
.ff-post-badge--pin{
  background:#0f1b38;
  color:#fff;
}
.ff-post-badge--tag{
  background:rgba(31,77,115,0.1);
  color:#1f4d73;
}
.ff-post-tools{
  display:flex;
  align-items:center;
  gap:4px;
  flex-shrink:0;
}
.ff-post-tool{
  border:0;
  background:#e8f6f8;
  color:#2f7a8a;
  font-size:11px;
  font-weight:800;
  padding:5px 8px;
  border-radius:999px;
  cursor:pointer;
}
.ff-comment-del{
  border:0;
  background:none;
  color:#b91c1c;
  font-size:11px;
  font-weight:700;
  cursor:pointer;
  padding:0;
  margin-left:6px;
}

/* Inbox — Messenger-style split */
.ff-inbox{
  display:grid;
  grid-template-columns: minmax(260px, 36%) 1fr;
  min-height:480px;
  max-height:min(72vh,680px);
  overflow:hidden;
  padding:0 !important;
  border-radius:16px;
  border:1px solid #d3e3ed;
  background:#fff;
}
.ff-inbox-side-head{
  padding:12px 14px 2px;
}
.ff-inbox-side-title{
  font-size:15px;
  font-weight:800;
  color:#0f1b38;
}
.ff-inbox-back{
  display:none;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:999px;
  text-decoration:none !important;
  color:#1f4d73 !important;
  font-size:20px;
  font-weight:700;
  flex-shrink:0;
  background:#eef3f7;
  line-height:1;
  -webkit-tap-highlight-color:transparent;
}
.ff-inbox-back:hover{background:#e0eaf2}
@media (max-width:720px){
  .ff-inbox{
    grid-template-columns:1fr;
    min-height:0;
    max-height:none;
  }
  /* List-first: only show thread when user opened a chat (?c=). */
  .ff-inbox:not(.is-open) .ff-inbox-thread{display:none}
  .ff-inbox.is-open .ff-inbox-side{display:none}
  .ff-inbox-side{
    border-right:0;
    max-height:none;
    min-height:0;
    min-width:0;
  }
  .ff-inbox-back{display:inline-flex}
  .ff-inbox.is-open{
    display:flex;
    flex-direction:column;
    min-height:16rem;
    height:calc(100dvh - 19.5rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
    max-height:calc(100dvh - 19.5rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
  }
  .ff-inbox.is-open .ff-inbox-thread{
    flex:1 1 auto;
    min-height:0;
    height:100%;
  }
  .ff-inbox.is-open .ff-inbox-messages{
    flex:1 1 auto;
    min-height:0;
    max-height:none;
  }
  .ff-inbox.is-open .ff-inbox-compose{
    flex-shrink:0;
    padding:10px 12px 12px;
  }
  .ff-inbox-conv-list,
  .ff-inbox-conv,
  .ff-inbox-conv-body,
  .ff-inbox-conv-top{
    min-width:0;
  }
  .ff-inbox-conv{
    padding:11px 14px;
  }
  .ff-inbox-conv-body strong{
    flex:1 1 auto;
    min-width:0;
  }
  .ff-inbox-conv-time{
    white-space:nowrap;
  }
}
.ff-inbox-side{
  border-right:1px solid #e8eef3;
  display:flex;
  flex-direction:column;
  min-height:0;
  background:#f8fafc;
}
.ff-inbox-search-wrap{position:relative;padding:10px;border-bottom:1px solid #e8eef3}
.ff-inbox-search{
  width:100%;
  box-sizing:border-box;
  padding:9px 12px;
  border:1px solid #d3e3ed;
  border-radius:999px;
  font:inherit;
  font-size:13px;
  background:#fff;
}
.ff-inbox-search-results{
  position:absolute;
  left:10px;right:10px;top:100%;
  z-index:5;
  background:#fff;
  border:1px solid #d3e3ed;
  border-radius:12px;
  box-shadow:0 12px 28px rgba(10,35,64,0.14);
  max-height:220px;
  overflow:auto;
}
.ff-inbox-search-item{
  display:block;
  width:100%;
  text-align:left;
  border:0;
  background:#fff;
  padding:10px 12px;
  font-size:13px;
  font-weight:600;
  color:#0f1b38;
  cursor:pointer;
  border-bottom:1px solid #f0f4f8;
}
.ff-inbox-search-item:hover{background:#e8f6f8}
.ff-inbox-search-item small{display:block;font-weight:500;color:#6b7a8b;font-size:11px}
.ff-inbox-conv-list{list-style:none;margin:0;padding:0;overflow:auto;flex:1}
.ff-inbox-empty{padding:16px;font-size:13px;color:#6b7a8b}
.ff-inbox-conv{
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 12px;
  text-decoration:none;
  color:#0f1b38;
  border-bottom:1px solid #eef3f7;
}
.ff-inbox-conv:hover{background:#eef6fb}
.ff-inbox-conv.is-active{background:#e3f0f8}
.ff-inbox-conv.is-unread .ff-inbox-conv-body strong{font-weight:800}
.ff-inbox-conv.is-unread .ff-inbox-conv-preview{color:#0f1b38;font-weight:600}
.ff-inbox-conv-body{flex:1;min-width:0}
.ff-inbox-conv-top{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px;
}
.ff-inbox-conv-top > strong{
  flex:1 1 auto;
  min-width:0;
  font-size:13px;
  font-weight:700;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ff-inbox-conv-time{
  flex-shrink:0;
  font-size:11px;
  color:#8a96a3;
  font-weight:600;
}
.ff-inbox-conv-preview{
  display:block;
  margin-top:2px;
  font-size:12px;
  color:#6b7a8b;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ff-inbox-unread{
  min-width:18px;height:18px;padding:0 5px;
  border-radius:999px;background:#0084ff;color:#fff;
  font-size:10px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;
  flex-shrink:0;
}
.ff-inbox-thread{display:flex;flex-direction:column;min-height:0;min-width:0}
.ff-inbox-thread-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border-bottom:1px solid #e8eef3;
}
.ff-inbox-thread-peer{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  flex:1 1 auto;
}
.ff-inbox-thread-meta{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:1px;
}
.ff-inbox-thread-peer strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:14px;
  font-weight:800;
  color:#0f1b38;
}
.ff-inbox-thread-sub{
  font-size:11px;
  color:#6b7a8b;
  font-weight:600;
}
.ff-inbox-conv-delete{
  flex:0 0 auto;
  border:1px solid #e2b4b4;
  background:#fff5f5;
  color:#b91c1c;
  font-size:12px;
  font-weight:700;
  padding:6px 10px;
  border-radius:999px;
  cursor:pointer;
  line-height:1.2;
}
.ff-inbox-conv-delete:hover{
  background:#fee2e2;
}
.ff-inbox-messages{
  flex:1;overflow:auto;padding:14px;
  display:flex;flex-direction:column;gap:8px;
  background:#f4f7fa;
  min-height:240px;
  max-height:420px;
}
.ff-msg{display:flex}
.ff-msg.is-mine{justify-content:flex-end}
.ff-msg-bubble{
  max-width:80%;
  padding:9px 12px;
  border-radius:14px;
  background:#fff;
  border:1px solid #e2e8f0;
  position:relative;
}
.ff-msg.is-mine .ff-msg-bubble{
  background:linear-gradient(145deg,#1f4d73,#2f7a8a);
  color:#fff;
  border-color:transparent;
}
.ff-msg-bubble p{margin:0;font-size:13px;line-height:1.4}
.ff-msg-meta{
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:4px;
}
.ff-msg-time{display:block;font-size:10px;opacity:.75}
.ff-msg-seen{
  font-size:10px;
  font-weight:700;
  opacity:.85;
}
/* WhatsApp-style delivery / read ticks on own messages */
.ff-msg-ticks{
  display:inline-block;
  font-size:11px;
  font-weight:700;
  line-height:1;
  letter-spacing:-0.06em;
  opacity:.9;
  user-select:none;
}
.ff-msg-ticks.is-delivered{
  color:rgba(255,255,255,.85);
}
.ff-msg:not(.is-mine) .ff-msg-ticks.is-delivered{color:#64748b}
.ff-msg.is-mine .ff-msg-ticks.is-delivered{
  color:rgba(255,255,255,.8);
}
.ff-msg-ticks.is-read{
  color:#93c5fd; /* light blue on teal bubble */
}
.ff-msg.is-mine .ff-msg-ticks.is-read{
  color:#bfdbfe;
  opacity:1;
}
.ff-msg-delete{
  appearance:none;
  border:0;
  background:transparent;
  color:inherit;
  opacity:.55;
  cursor:pointer;
  font-size:14px;
  line-height:1;
  padding:0 2px;
  border-radius:4px;
  font-weight:700;
}
.ff-msg-delete:hover{
  opacity:1;
  background:rgba(0,0,0,.08);
}
.ff-msg.is-mine .ff-msg-delete:hover{
  background:rgba(255,255,255,.18);
}
.ff-inbox-compose{
  display:flex;gap:8px;padding:10px 12px;
  border-top:1px solid #e8eef3;background:#fff;
  align-items:flex-end;
}
.ff-inbox-input{
  flex:1;min-width:0;min-height:40px;max-height:140px;
  padding:10px 14px;
  border:1px solid #d3e3ed;border-radius:18px;
  font:inherit;font-size:13px;line-height:1.4;
  resize:none;overflow-y:hidden;box-sizing:border-box;
  field-sizing:content;
  unicode-bidi:plaintext;
  text-align:start;
}
.ff-inbox-input[dir="rtl"]{text-align:right}
.ff-inbox-input[dir="ltr"]{text-align:left}
.ff-msg-bubble p{
  unicode-bidi:plaintext;
  text-align:start;
}
.ff-msg-bubble p[dir="rtl"]{text-align:right}
.ff-msg-bubble p[dir="ltr"]{text-align:left}
.ff-inbox-input:focus{
  outline:none;
  border-color:#2f7a8a;
  box-shadow:0 0 0 2px rgba(47,122,138,.15);
}
.ff-inbox-send{
  border:0;padding:10px 16px;border-radius:999px;
  background:#2f7a8a;color:#fff;font-weight:800;font-size:13px;cursor:pointer;
  flex-shrink:0;align-self:flex-end;
}
.ff-inbox-placeholder{
  flex:1;display:grid;place-items:center;text-align:center;
  padding:40px 20px;color:#556170;background:#f8fafc;
}

/* Public / private visibility */
.ff-composer-visibility{
  display:grid;
  gap:6px;
  margin:0 0 10px;
  padding:10px 12px;
  border-radius:12px;
  background:#f4f7fa;
  border:1px solid #e2e8f0;
}
.ff-vis-option{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  font-weight:600;
  color:#0f1b38;
  cursor:pointer;
}
.ff-audience{margin-top:8px}
.ff-audience-search{
  width:100%;
  box-sizing:border-box;
  padding:9px 12px;
  border:1px solid #d3e3ed;
  border-radius:10px;
  font:inherit;
  font-size:13px;
  background:#fff;
}
.ff-audience-results{
  margin-top:6px;
  max-height:180px;
  overflow:auto;
  border:1px solid #d3e3ed;
  border-radius:10px;
  background:#fff;
}
.ff-aud-result{
  display:block;
  width:100%;
  text-align:left;
  border:0;
  background:#fff;
  padding:9px 12px;
  font-size:13px;
  font-weight:600;
  color:#0f1b38;
  cursor:pointer;
  border-bottom:1px solid #f0f4f8;
}
.ff-aud-result:hover{background:#e8f6f8}
.ff-aud-result small{display:block;font-weight:500;color:#6b7a8b;font-size:11px}
.ff-audience-chips{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:8px;
}
.ff-aud-chip{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:4px 8px 4px 10px;
  border-radius:999px;
  background:#2f7a8a;
  color:#fff;
  font-size:12px;
  font-weight:700;
}
.ff-aud-x{
  border:0;
  background:rgba(255,255,255,0.2);
  color:#fff;
  width:18px;height:18px;
  border-radius:50%;
  cursor:pointer;
  line-height:1;
  font-size:14px;
}
.ff-audience-hint{
  margin:8px 0 0;
  font-size:11px;
  color:#6b7a8b;
  line-height:1.4;
}
.ff-post-badge--private{
  background:#0f1b38;
  color:#e8f6f8;
}
.ff-post-audience-names{
  margin-top:3px;
  font-size:11px;
  color:#6b7a8b;
  line-height:1.3;
}

/* Privacy editor on post */
.ff-privacy-editor{
  padding:0 14px 12px;
}
.ff-privacy-editor[hidden]{display:none !important}
.ff-privacy-editor-inner{
  padding:12px;
  border-radius:12px;
  background:#f4f7fa;
  border:1px solid #d3e3ed;
  display:grid;
  gap:8px;
}
.ff-privacy-editor-inner > strong{
  font-size:13px;
  color:#0f1b38;
}
.ff-privacy-editor-actions{
  display:flex;
  gap:8px;
  align-items:center;
  margin-top:4px;
}
.ff-post.is-highlight{
  outline:3px solid #56a9b5;
  box-shadow:0 0 0 6px rgba(86,169,181,0.25);
  transition:outline .3s ease, box-shadow .3s ease;
}

/* ========== Facebook-like feed polish (FUTURON) ========== */
.futuron-workspace-social{
  gap:12px;
  min-width:0;
  max-width:100%;
  width:100%;
  box-sizing:border-box;
}
@media (min-width:1024px){
  .futuron-app-shell--workspace .futuron-workspace-social{
    padding:10px 16px 20px;
  }
}
body.futuron-app-body .futuron-app-main:has(.futuron-workspace-social){
  background:#e8eef3;
}
.ff-composer.card,
.ff-post{
  border-radius:12px;
  border:1px solid rgba(15,27,56,0.08);
  box-shadow:0 1px 2px rgba(10,35,64,0.06);
  background:#fff;
}
.ff-composer{
  padding:12px 16px 10px;
}
.ff-composer-body{
  border-radius:24px;
  min-height:44px;
  font-size:16px;
  background:#f0f2f5;
  border-color:transparent;
}
.ff-composer-body:focus{
  background:#fff;
  border-color:#56a9b5;
}
.ff-post-head{
  padding:12px 16px 8px;
}
.ff-post-author{
  font-size:15px;
  font-weight:700;
}
.ff-post-sub{
  font-size:12px;
  color:#65676b;
  gap:4px;
}
.ff-post-dot{opacity:.6}
.ff-post-body{
  padding:4px 16px 10px;
}
.ff-post-text{
  font-size:15px;
  line-height:1.45;
  color:#050505;
  white-space:normal;
  word-break:break-word;
}
.ff-post-title{
  font-size:17px;
  margin:0 0 6px;
}
.ff-post-image{
  margin-top:4px;
  background:#000;
}
.ff-post-image img{
  max-height:520px;
  width:100%;
  object-fit:contain;
  background:#000;
}
.ff-post-stats{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 16px 8px;
  border-bottom:1px solid #e4e6eb;
  min-height:20px;
}
.ff-post-stats.is-empty{
  display:none;
}
.ff-stat-likes{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:14px;
  color:#65676b;
  font-weight:500;
  cursor:pointer;
  border-radius:6px;
  padding:2px 4px;
  margin:-2px -4px;
}
.ff-stat-likes:hover,
.ff-stat-likes:focus{
  background:#f0f2f5;
  outline:none;
}
/* Who reacted tooltip (lazy-loaded names) */
.ff-react-tip{
  position:absolute;
  left:0;
  bottom:calc(100% + 8px);
  z-index:50;
  min-width:160px;
  max-width:240px;
  padding:8px 10px;
  border-radius:10px;
  background:#050505;
  color:#fff;
  font-size:12px;
  font-weight:500;
  line-height:1.35;
  box-shadow:0 8px 24px rgba(0,0,0,0.28);
  pointer-events:none;
  white-space:normal;
}
.ff-react-tip[hidden]{display:none !important}
.ff-react-tip::after{
  content:"";
  position:absolute;
  top:100%;
  left:16px;
  border:6px solid transparent;
  border-top-color:#050505;
}
.ff-react-tip-title{
  font-size:11px;
  font-weight:700;
  opacity:.75;
  margin-bottom:4px;
}
.ff-react-tip-row{
  display:flex;
  align-items:center;
  gap:6px;
  padding:2px 0;
}
.ff-react-tip-emoji{font-size:13px;line-height:1;flex-shrink:0}
.ff-react-tip-name{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ff-react-tip-more{
  margin-top:4px;
  opacity:.7;
  font-size:11px;
}
.ff-react-tip-loading{opacity:.7;font-style:italic}
.ff-react-stack{
  display:inline-flex;
  flex-direction:row-reverse;
}
.ff-react-dot{
  width:20px;height:20px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 0 0 1.5px #fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  margin-left:-4px;
  line-height:1;
}
.ff-react-dot:last-child{margin-left:0}
.ff-react-total{margin-left:2px}
.ff-stat-comments{
  border:0;
  background:none;
  color:#65676b;
  font-size:14px;
  font-weight:500;
  cursor:pointer;
  padding:0;
  font-family:inherit;
}
.ff-stat-comments:hover{text-decoration:underline;color:#2f7a8a}

.ff-post-author{
  text-decoration:none !important;
  color:#050505 !important;
}
.ff-post-author:hover{text-decoration:underline !important}
.ff-post-avatar-link{flex-shrink:0;line-height:0}
.ff-post-actions{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:0;
  padding:2px 4px;
  border-bottom:1px solid #e4e6eb;
}
.ff-post-actions.has-pin{
  grid-template-columns:1fr 1fr 1fr 1fr;
}
.ff-post-panels{
  margin:0 12px 10px;
  border:1px solid #e4ebf0;
  border-radius:12px;
  background:#fff;
  /* Bound width so Timeline/Time Chart scroll inside — app-main uses overflow-x:clip. */
  max-width:100%;
  min-width:0;
  width:auto;
  box-sizing:border-box;
  overflow-x:clip;
  overflow-y:visible;
}
.ff-post-panel-tabs{
  display:flex;
  gap:0;
  border-bottom:1px solid #e4ebf0;
  background:#f7fafc;
  border-radius:12px 12px 0 0;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  max-width:100%;
}
.ff-post-panel-tab{
  appearance:none;
  border:0;
  background:transparent;
  padding:10px 14px;
  font:inherit;
  font-size:13px;
  font-weight:800;
  color:#64748b;
  cursor:pointer;
  border-bottom:2px solid transparent;
  margin-bottom:-1px;
  flex:0 0 auto;
  white-space:nowrap;
}
.ff-post-panel-tab.is-active{
  color:#0f1b38;
  border-bottom-color:#2f7a8a;
  background:#fff;
}
.ff-post-panel{
  padding:0;
  max-width:100%;
  min-width:0;
  /* Contain wide table/chart so overflow-x:auto on children becomes a real scrollport. */
  overflow-x:clip;
  overflow-y:visible;
  box-sizing:border-box;
}
.ff-post-panel[hidden]{
  display:none !important;
}
.ff-post-panel > .ff-tasks{
  margin:0;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.ff-ai-timeline-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 14px;
  padding:10px 12px 0;
  font-size:12px;
  font-weight:600;
  color:#556170;
}
.ff-ai-timeline-subject{
  padding:8px 12px 0;
  font-size:14px;
  font-weight:800;
  color:#0f1b38;
}
.ff-ai-timeline-health{
  padding:4px 12px 0;
  font-size:12px;
  font-weight:700;
  color:#1f4d73;
}
.ff-ai-timeline-preview{
  display:block;
  margin:8px 12px 10px;
  border:1px solid #e2e8f0;
  border-radius:10px;
  overflow-x:auto;
  overflow-y:auto;
  max-height:min(70vh, 560px);
  background:#fff;
  padding:8px;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  touch-action:pan-x pan-y;
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}
.ff-ai-timeline-preview .ff-forecast-block{
  min-width:720px;
  max-width:none;
  width:max-content;
  box-sizing:border-box;
}
.ff-ai-timeline-preview table{
  /* Override inline width="100%" / width:100% so the table can exceed the preview and scroll. */
  width:max-content !important;
  min-width:720px;
  max-width:none;
  table-layout:auto;
}
.ff-ai-brief-preview{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  max-width:100%;
  min-width:0;
}
.ff-ai-brief-preview .ff-forecast-block{
  overflow-x:auto;
  min-width:0;
}
.ff-ai-brief-preview .ff-forecast-block table{
  min-width:560px;
}
.ff-ai-timeline-empty{
  margin:0;
  padding:16px 14px 8px;
  font-size:13px;
  color:#556170;
  line-height:1.45;
}
.ff-ai-timeline-actions,
.ff-timechart-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  margin:0 12px 12px;
}
.ff-timechart-actions{
  margin-top:10px;
}
.ff-ai-timeline-gen,
[data-ff-ai-timeline-panel] .ff-post-tool{
  margin:0;
}
.ff-ai-timeline-pdf{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-weight:800;
}
.ff-timechart{
  padding:10px 12px 14px;
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  overflow-x:clip;
  overflow-y:visible;
}
.ff-timechart-empty{
  margin:8px 0;
  color:#556170;
  font-size:13px;
}
.ff-timechart-head{
  display:flex;
  flex-wrap:wrap;
  gap:8px 14px;
  margin-bottom:8px;
  font-size:12px;
  font-weight:700;
  color:#1f4d73;
}
.ff-timechart-scroll{
  display:block;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  touch-action:pan-x pan-y;
  border:1px solid #e2e8f0;
  border-radius:10px;
  background:#fff;
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  /* Make horizontal scroll discoverable on desktop + mobile. */
  scrollbar-gutter:stable;
}
.ff-timechart-canvas{
  /* Wide enough for bars + room so edge ticks/bars are not clipped. */
  min-width:720px;
  width:max-content;
  max-width:none;
  padding:12px 32px 16px 12px;
  box-sizing:border-box;
}
.ff-timechart-axis{
  position:relative;
  height:22px;
  margin:0 0 8px 132px;
  border-bottom:1px solid #e2e8f0;
  overflow:visible;
}
.ff-timechart-tick{
  position:absolute;
  top:0;
  transform:translateX(-50%);
  font-size:10px;
  color:#94a3b8;
  white-space:nowrap;
  max-width:56px;
  overflow:visible;
  text-overflow:clip;
  pointer-events:none;
}
.ff-timechart-tick.is-edge-start{transform:translateX(0);}
.ff-timechart-tick.is-edge-end{transform:translateX(-100%);}
.ff-timechart-row{
  display:grid;
  grid-template-columns:132px minmax(0, 1fr);
  gap:8px;
  align-items:center;
  min-height:28px;
  margin-bottom:6px;
  min-width:0;
}
.ff-timechart-label{
  font-size:12px;
  line-height:1.25;
  overflow:hidden;
  min-width:0;
}
.ff-timechart-label strong{
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#0f1b38;
}
.ff-timechart-label span{
  display:block;
  color:#64748b;
  font-size:11px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ff-timechart-track{
  position:relative;
  height:18px;
  background:#f1f5f9;
  border-radius:999px;
  /* visible so due ticks are not clipped; bars keep their own radius */
  overflow:visible;
  min-width:0;
}
.ff-timechart-bar{
  position:absolute;
  top:2px;
  height:14px;
  border-radius:999px;
  min-width:6px;
  max-width:100%;
  box-sizing:border-box;
}
.ff-timechart-bar.is-ahead{background:#22c55e;}
.ff-timechart-bar.is-onplan{background:#3b82f6;}
.ff-timechart-bar.is-risk{background:#f59e0b;}
.ff-timechart-bar.is-behind{background:#ef4444;}
.ff-timechart-bar.is-unscheduled{background:#94a3b8;}
.ff-timechart-due{
  position:absolute;
  top:-2px;
  width:2px;
  height:22px;
  background:#0f1b38;
  transform:translateX(-1px);
  border-radius:1px;
  z-index:2;
}
.ff-timechart-unscheduled{
  position:absolute;
  left:8px;
  top:1px;
  font-size:10px;
  font-weight:700;
  color:#64748b;
}
.ff-timechart-legend{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:10px;
  font-size:11px;
  font-weight:700;
  color:#475569;
}
@media (max-width:640px){
  .ff-post-panels{
    margin:0 8px 10px;
  }
  .ff-ai-timeline-preview{
    margin:8px;
    padding:6px;
    max-height:min(65vh, 480px);
  }
  .ff-ai-timeline-preview .ff-forecast-block,
  .ff-ai-timeline-preview table{
    min-width:680px;
  }
  .ff-timechart{
    padding:8px;
  }
  .ff-timechart-canvas{
    min-width:640px;
    padding:10px 28px 14px 8px;
  }
  .ff-timechart-axis{
    margin-left:100px;
  }
  .ff-timechart-row{
    grid-template-columns:100px minmax(0, 1fr);
    gap:6px;
  }
  .ff-timechart-label{font-size:11px;}
  .ff-ai-timeline-actions,
  .ff-timechart-actions{
    margin:0 8px 10px;
  }
}
.ff-timechart-legend span::before{
  content:'';
  display:inline-block;
  width:10px;
  height:10px;
  border-radius:3px;
  margin-inline-end:5px;
  vertical-align:-1px;
}
.ff-timechart-legend .is-ahead::before{background:#22c55e;}
.ff-timechart-legend .is-onplan::before{background:#3b82f6;}
.ff-timechart-legend .is-risk::before{background:#f59e0b;}
.ff-timechart-legend .is-behind::before{background:#ef4444;}
.ff-timechart-due-legend::before{
  content:'';
  display:inline-block;
  width:2px;
  height:12px;
  background:#0f1b38;
  margin-inline-end:5px;
  vertical-align:-2px;
  border-radius:1px;
}
.ff-post-ai-brief{
  border:0;
  background:transparent;
  color:#1f4d73;
  width:36px;
  height:36px;
  padding:0;
  border-radius:50%;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.ff-post-ai-brief:hover,
.ff-post-ai-brief:focus-visible{
  background:#eef3f7;
  color:#0f1b38;
  outline:none;
}
.ff-post-ai-brief-ico,
.ff-ai-sparkles{
  display:block;
  width:20px;
  height:20px;
  line-height:0;
}
.ff-ai-brief-dialog{
  position:fixed;
  inset:0;
  z-index:10080;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
}
.ff-ai-brief-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,27,56,.45);
}
.ff-ai-brief-panel{
  position:relative;
  z-index:1;
  width:min(640px, 100%);
  max-height:min(86vh, 720px);
  overflow:auto;
  background:#fff;
  border-radius:14px;
  box-shadow:0 18px 48px rgba(15,27,56,.28);
  padding:14px 16px 16px;
  box-sizing:border-box;
}
.ff-ai-brief-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}
.ff-ai-brief-form{
  display:flex;
  flex-direction:column;
  gap:12px;
  margin-bottom:4px;
}
.ff-ai-brief-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:13px;
  font-weight:700;
  color:#0f1b38;
}
.ff-ai-brief-field select,
.ff-ai-brief-field textarea{
  font:inherit;
  font-weight:500;
  border:1px solid #d3e3ed;
  border-radius:10px;
  padding:9px 11px;
  background:#fff;
  color:#0f1b38;
  width:100%;
  box-sizing:border-box;
}
.ff-ai-brief-field textarea{
  resize:vertical;
  min-height:72px;
  line-height:1.45;
}
.ff-ai-brief-field select:focus,
.ff-ai-brief-field textarea:focus{
  outline:2px solid rgba(47,122,138,.35);
  border-color:#2f7a8a;
}
.ff-ai-brief-status{
  margin:0 0 8px;
  font-size:13px;
  color:#556170;
  font-weight:600;
}
.ff-ai-brief-subject{
  margin:0 0 8px;
  font-size:14px;
  font-weight:800;
  color:#0f1b38;
}
.ff-ai-brief-preview{
  border:1px solid #e2e8f0;
  border-radius:10px;
  overflow:auto;
  max-height:min(52vh, 420px);
  background:#eef3f7;
}
.ff-ai-brief-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  margin-top:10px;
}
.ff-ai-brief-actions--form{margin-top:4px;}
.ff-ai-brief-actions .ff-composer-submit,
.ff-ai-brief-actions .ff-post-tool,
.ff-ai-brief-btn{
  padding:6px 12px !important;
  min-height:32px;
  height:auto;
  font-size:12px !important;
  font-weight:700 !important;
  border-radius:8px !important;
  line-height:1.2;
}
.ff-ai-brief-actions .ff-post-tool{
  background:#f1f5f9;
  color:#334155;
  border:1px solid #e2e8f0;
}
.ff-ai-brief-actions .ff-post-tool:hover{
  background:#e2e8f0;
  color:#0f1b38;
}
body.ff-ai-brief-open{overflow:hidden;}
@media (max-width:640px){
  .ff-ai-brief-dialog{padding:8px;align-items:flex-end;}
  .ff-ai-brief-panel{
    width:100%;
    max-height:92vh;
    border-radius:14px 14px 0 0;
  }
  .ff-ai-brief-actions{
    gap:6px;
  }
  .ff-ai-brief-actions .ff-composer-submit,
  .ff-ai-brief-actions .ff-post-tool,
  .ff-ai-brief-btn{
    padding:7px 10px !important;
    font-size:12px !important;
    flex:1 1 calc(50% - 6px);
    justify-content:center;
    text-align:center;
  }
  .ff-ai-brief-actions .ff-composer-submit{
    flex:1 1 100%;
  }
}
.ff-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:40px;
  border:0;
  border-radius:6px;
  background:transparent;
  color:#65676b;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  font-family:inherit;
  padding:0 6px;
}
.ff-action:hover{background:#f0f2f5}
.ff-action-svg{display:block;opacity:.85}
.ff-action-icon{
  font-size:18px;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20px;
}
/* Inactive Like = outline gray (FB) */
.ff-action--like:not(.is-active){
  color:#65676b;
}
.ff-action--like.is-active.ff-action--like,
.ff-action--like.ff-action--like.is-active{
  color:#2f7a8a;
}
.ff-action--like.is-active .ff-action-icon{font-size:18px}
/* Long-press Like: no text selection / callout (mobile FB feel) */
.ff-action,
.ff-action--like,
.ff-react-wrap,
.ff-react-picker,
.ff-react-pick{
  -webkit-user-select:none !important;
  user-select:none !important;
  -webkit-touch-callout:none !important;
  -webkit-tap-highlight-color:transparent;
}
.ff-action--like{
  touch-action:manipulation;
}
body.ff-react-picking{
  -webkit-user-select:none !important;
  user-select:none !important;
  -webkit-touch-callout:none !important;
  overflow:hidden;
}
body.ff-react-picking .ff-post,
body.ff-react-picking .ff-post *{
  -webkit-user-select:none !important;
  user-select:none !important;
}
/* Reaction colors when active */
.ff-action--love.is-active{color:#f33e58}
.ff-action--haha.is-active,
.ff-action--wow.is-active{color:#f7b125}
.ff-action--sad.is-active,
.ff-action--angry.is-active{color:#e68a00}
.ff-action--pin.is-active{color:#2f7a8a}
.ff-action--copy.is-copied{color:#2f7a8a}
.ff-stat-right{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-left:auto;
}
/* Profile */
.ff-profile{padding:14px 16px 16px}
.ff-profile-back{
  display:inline-block;
  font-size:13px;
  font-weight:700;
  color:#2f7a8a !important;
  text-decoration:none !important;
  margin-bottom:12px;
}
.ff-profile-hero{
  display:flex;
  align-items:center;
  gap:14px;
}
.ff-profile-photo{
  width:88px;height:88px;
  border-radius:50%;
  object-fit:cover;
  object-position:center 30%;
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:28px;
  font-weight:800;
  color:#0f1b38;
  background:linear-gradient(145deg,#56a9b5,#e8f6f8);
}
.ff-profile-name{
  margin:0;
  font-size:22px;
  font-weight:800;
  color:#0f1b38;
}
.ff-profile-role{
  margin:4px 0 0;
  font-size:14px;
  color:#65676b;
  font-weight:600;
}
.ff-profile-count{
  margin:6px 0 0;
  font-size:13px;
  color:#2f7a8a;
  font-weight:700;
}
.ff-profile-hint{
  margin:12px 0 0;
  font-size:12px;
  color:#8a96a3;
}

/* Shared post embed (FB style) */
.ff-shared-card{
  margin:8px 16px 12px;
  border:1px solid #dadde1;
  border-radius:10px;
  overflow:hidden;
  background:#fff;
}
.ff-shared-unavailable{
  padding:28px 16px;
  text-align:center;
  background:#f0f2f5;
  color:#65676b;
}
.ff-shared-lock{font-size:28px;display:block;margin-bottom:8px}
.ff-shared-unavailable p{margin:0;font-size:14px;font-weight:600;line-height:1.4}
.ff-shared-head{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px 6px;
}
.ff-shared-head strong{display:block;font-size:13px;font-weight:700;color:#050505}
.ff-shared-time{font-size:12px;color:#65676b}
.ff-shared-title{margin:0 12px 4px;font-size:15px;font-weight:800}
.ff-shared-text{padding:0 12px 10px;font-size:14px;line-height:1.4;color:#050505}
.ff-shared-image img{display:block;width:100%;max-height:360px;object-fit:cover}

/* Share dialog */
.ff-share-dialog{
  position:fixed;
  inset:0;
  z-index:260;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
}
.ff-share-backdrop{
  position:absolute;
  inset:0;
  background:rgba(255,255,255,0.85);
}
.ff-share-panel{
  position:relative;
  z-index:1;
  width:min(440px, 100%);
  background:#fff;
  border-radius:12px;
  box-shadow:0 12px 40px rgba(0,0,0,0.2);
  padding:14px 16px 16px;
  display:grid;
  gap:10px;
}
.ff-share-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.ff-share-head strong{font-size:16px;font-weight:800}
.ff-share-hint{margin:0;font-size:12px;color:#65676b;line-height:1.4}
.ff-share-comment{min-height:80px !important}
.ff-share-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  align-items:center;
}
body.ff-share-open{overflow:hidden}

/* Reaction picker (FB style) — hidden unless explicitly open */
.ff-post-actions,
.ff-react-wrap{
  overflow:visible;
  position:relative;
}
.ff-react-wrap{
  display:flex;
  justify-content:center;
  z-index:2;
}
/* Default: never visible (even if [hidden] stripped by old CSS) */
.ff-react-picker,
.ff-react-picker[hidden]{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
  opacity:0 !important;
}
/* Only show when wrap has is-open AND picker is not [hidden] */
.ff-react-wrap.is-open .ff-react-picker:not([hidden]){
  display:flex !important;
  visibility:visible !important;
  pointer-events:auto !important;
  opacity:1 !important;
  position:fixed;
  /* left/top set by JS from button rect; fallback absolute for no-JS */
  z-index:4000;
  gap:4px;
  padding:8px 10px;
  background:#fff;
  border-radius:999px;
  box-shadow:0 8px 28px rgba(0,0,0,0.22), 0 0 0 1px rgba(0,0,0,0.06);
  white-space:nowrap;
  max-width:calc(100vw - 16px);
  animation:ff-react-in .16s cubic-bezier(.2,.9,.3,1.2);
  transform:none;
  touch-action:none;
  will-change:transform, opacity;
}
@keyframes ff-react-in{
  from{opacity:0; transform:translateY(10px) scale(.86)}
  to{opacity:1; transform:translateY(0) scale(1)}
}
.ff-react-pick{
  width:42px;height:42px;
  border:0;
  background:transparent;
  border-radius:50%;
  font-size:28px;
  line-height:1;
  cursor:pointer;
  transition:transform .12s cubic-bezier(.2,.9,.3,1.25);
  padding:0;
  flex:0 0 auto;
  touch-action:none;
  -webkit-user-select:none;
  user-select:none;
}
.ff-react-pick:hover,
.ff-react-pick.is-hot{
  transform:scale(1.42) translateY(-10px);
}

/* Comments FB style — compact actions (mobile + desktop) */
.ff-comments{
  padding:8px 16px 12px;
  background:#fff;
}
.ff-comments-list{display:grid;gap:8px;margin-bottom:6px}
.ff-comment-thread{display:grid;gap:4px;min-width:0;max-width:100%}
.ff-comment{
  display:flex;
  gap:8px;
  align-items:flex-start;
  min-width:0;
  max-width:100%;
}
.ff-comment .ff-avatar,
.ff-comment .ff-avatar--sm{
  width:28px !important;
  height:28px !important;
  flex-shrink:0;
  font-size:11px;
}
.ff-comment-main{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:0;
  align-items:flex-start;
}
.ff-comment-bubble{
  display:inline-block;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  overflow:hidden;
  padding:6px 10px;
  border-radius:16px;
  background:#f0f2f5;
}
.ff-comment-bubble strong{
  display:block;
  font-size:12px;
  font-weight:700;
  color:#050505;
  line-height:1.25;
  margin:0 0 1px;
}
.ff-comment-bubble p{
  font-size:13px;
  line-height:1.35;
  color:#050505;
  margin:0;
}
/* Compact meta row: Like · Reply · time · Delete */
.ff-comment-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:2px 2px;
  padding:1px 2px 0 8px;
  margin:0;
  line-height:1.2;
}
.ff-comment-meta > * + *::before{
  /* separators handled via gaps + · on time */
}
.ff-comment-time,
.ff-comment-del,
.ff-c-reply-btn,
.ff-c-like{
  appearance:none;
  -webkit-appearance:none;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:none;
  margin:0;
  padding:2px 6px !important;
  min-height:0 !important;
  min-width:0 !important;
  height:auto !important;
  width:auto !important;
  font-family:inherit;
  font-size:11px !important;
  font-weight:600;
  line-height:1.2;
  color:#65676b;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:3px;
  flex-direction:row !important;
  text-decoration:none;
  border-radius:0;
}
.ff-comment-time{
  cursor:default;
  padding-left:4px !important;
  font-weight:500;
}
.ff-comment-time::before{
  content:"·";
  margin-right:6px;
  color:#bcc0c4;
  font-weight:700;
}
.ff-c-like:hover,
.ff-c-reply-btn:hover{color:#2f7a8a;text-decoration:underline}
.ff-c-like.is-active{color:#2f7a8a}
.ff-comment-del:hover{color:#b91c1c;text-decoration:underline}
/* No large icons on comment Like — text / emoji only */
.ff-c-like [data-ff-c-like-icon],
.ff-c-like .ff-action-svg,
.ff-c-like svg{
  display:none !important;
}
.ff-c-react-wrap{
  position:relative;
  display:inline-flex;
  align-items:center;
}
.ff-c-react-picker{
  position:absolute;
  bottom:calc(100% + 4px);
  left:0;
  display:flex;
  gap:1px;
  padding:4px 6px;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:999px;
  box-shadow:0 6px 18px rgba(10,35,64,0.14);
  z-index:30;
}
.ff-c-react-picker[hidden]{display:none !important}
.ff-c-react-picker .ff-react-pick{
  width:28px;
  height:28px;
  font-size:16px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  border-radius:50%;
}
.ff-c-react-picker .ff-react-pick:hover{background:#f0f2f5;transform:scale(1.12)}
.ff-c-react-count{
  display:inline-flex;
  align-items:center;
  gap:2px;
  font-size:10px;
  font-weight:600;
  color:#65676b;
  margin:0 0 0 6px;
  padding:0 4px;
  background:#fff;
  border:1px solid #e4e6eb;
  border-radius:10px;
  line-height:1.4;
  transform:translateY(-4px);
}
.ff-c-react-count .ff-react-dot{font-size:11px}
.ff-c-react-count[hidden]{display:none !important}

/* Nested replies */
.ff-comment-replies{
  display:grid;
  gap:6px;
  margin:2px 0 2px 36px;
  padding-left:0;
  border-left:0;
  min-width:0;
  max-width:100%;
}
.ff-comment.is-reply .ff-comment-bubble{background:#f0f2f5}
.ff-comment.is-reply .ff-avatar,
.ff-comment.is-reply .ff-avatar--sm{
  width:24px !important;
  height:24px !important;
  font-size:10px;
}
.ff-c-reply-form{
  display:flex;
  gap:6px;
  align-items:flex-end;
  margin-top:4px;
  width:100%;
  max-width:100%;
}
.ff-c-reply-form[hidden]{display:none !important}
.ff-c-reply-input{
  flex:1;
  min-height:44px;
  max-height:120px;
  padding:8px 12px;
  font-size:13px;
  line-height:1.4;
  resize:none;
  overflow-y:hidden;
  box-sizing:border-box;
  font-family:inherit;
}
@media (max-width:640px){
  .ff-comment-form,
  .ff-c-reply-form{
    gap:6px 4px;
    align-items:flex-end;
  }
  .ff-comment-form > .ff-avatar,
  .ff-comment-form > .ff-avatar--sm{
    width:28px !important;
    height:28px !important;
    font-size:11px;
    margin-bottom:8px;
  }
  .ff-comment-form .ff-comment-input,
  .ff-c-reply-form .ff-comment-input,
  .ff-c-reply-input{
    min-height:52px;
    padding:10px 12px;
    font-size:13px;
    line-height:1.35;
    overflow-y:auto;
  }
  .ff-comment-form .ff-c-drive-btn,
  .ff-comment-form .ff-comment-send,
  .ff-c-reply-form .ff-c-drive-btn,
  .ff-c-reply-form .ff-comment-send{
    width:28px;
    height:28px;
    font-size:14px;
    margin-bottom:10px;
  }
}

@media (max-width:640px){
  .ff-comment-meta{
    gap:0 0;
    padding-left:6px;
  }
  .ff-comment-time,
  .ff-comment-del,
  .ff-c-reply-btn,
  .ff-c-like{
    font-size:10.5px !important;
    padding:2px 5px !important;
  }
  .ff-comment-replies{margin-left:28px}
  .ff-comment-bubble{padding:5px 9px}
  .ff-comment-bubble strong{font-size:11.5px}
  .ff-comment-bubble p{font-size:12.5px}
}

.ff-comments-more{
  appearance:none;
  display:inline-block;
  margin:2px 0 4px;
  padding:0;
  border:0;
  background:transparent;
  font:inherit;
  font-size:12px;
  font-weight:600;
  line-height:1.3;
  color:#65676b;
  cursor:pointer;
  min-height:0;
  box-shadow:none;
}
.ff-comments-more:hover{
  text-decoration:underline;
  color:#1f4d73;
}
.ff-comments-more:focus-visible{
  outline:2px solid #93c5fd;
  outline-offset:2px;
  border-radius:4px;
}
@media (max-width:640px){
  .ff-comments-more{
    font-size:11.5px;
    font-weight:600;
    padding:2px 0;
  }
}
.ff-comment-form{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  gap:8px;
  margin-top:4px;
}
.ff-c-drive-btn{
  width:32px;
  height:32px;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#2f7a8a;
  font-size:16px;
  cursor:pointer;
  display:grid;
  place-items:center;
  flex-shrink:0;
  align-self:flex-end;
  margin-bottom:2px;
}
.ff-c-drive-btn:hover{background:#e8f6f8}
.ff-c-drive-preview{
  flex:1 0 100%;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  order:10;
}
.ff-c-drive-preview[hidden]{display:none !important}
.ff-c-drive-chip,
.ff-comment-drive-chip{
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  padding:4px 8px;
  border-radius:999px;
  background:#e8f6f8;
  color:#1f4d73;
  font-size:12px;
  font-weight:600;
  text-decoration:none;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ff-comment-drive-chip{display:block}
.ff-c-drive-chip{
  display:flex;
  align-items:center;
  gap:4px;
}
a.ff-comment-drive-chip:hover{background:#d4eef2}
.ff-c-drive-x{
  appearance:none;
  border:0;
  background:transparent;
  color:#6b7a8b;
  font-size:14px;
  line-height:1;
  cursor:pointer;
  padding:0 2px;
}
.ff-c-drive-x:hover{color:#b42318}
.ff-comment-drive{
  display:grid;
  gap:6px;
  margin-top:6px;
  min-width:0;
  max-width:100%;
}
.ff-c-reply-form{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  gap:8px;
  margin-top:6px;
}
.ff-comment-input{
  flex:1;
  min-height:36px;
  max-height:140px;
  padding:8px 14px;
  border:0;
  border-radius:18px;
  background:#f0f2f5;
  font-size:14px;
  line-height:1.4;
  resize:none;
  overflow-y:hidden;
  box-sizing:border-box;
  font-family:inherit;
  field-sizing:content;
}
.ff-comment-input:focus{
  outline:none;
  background:#e4e6eb;
}
.ff-comment-send{
  width:36px;height:36px;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#2f7a8a;
  font-size:18px;
  cursor:pointer;
  display:grid;
  place-items:center;
  flex-shrink:0;
  align-self:flex-end;
  margin-bottom:2px;
}
.ff-comment-send:hover{background:#e8f6f8}
.ff-comment-send:disabled{opacity:.4}

.ff-feed-filters{
  position:sticky;
  top:0;
  z-index:5;
  padding:4px 0;
  background:linear-gradient(180deg,#e8eef3 70%, transparent);
}
.ff-feed-filter{
  background:#fff;
  border-color:transparent;
  box-shadow:0 1px 2px rgba(0,0,0,0.05);
}
.ff-feed-filter.is-active{
  background:#2f7a8a;
  box-shadow:none;
}
.ff-post.is-private{
  /* subtle lock tone */
}

/* Project groups + mentions */
.ff-groups,
.ff-groups-hub,
.ff-group-detail{padding:14px}
.ff-groups-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
}
.ff-groups-head strong{font-size:15px;color:#0f1b38;display:block}
.ff-groups-head-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.ff-groups-view{
  display:inline-flex;
  align-items:center;
  background:#f1f5f8;
  border-radius:10px;
  padding:2px;
  gap:2px;
}
.ff-groups-view-btn{
  width:32px;
  height:32px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#64748b;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
}
.ff-groups-view-btn:hover{color:#0f1b38;background:#e8eef3}
.ff-groups-view-btn.is-active{
  background:#fff;
  color:#2f7a8a;
  box-shadow:0 1px 2px rgba(15,27,56,.08);
}
.ff-groups-sub{
  margin:4px 0 0;
  font-size:12px;
  color:#6b7a8b;
  font-weight:500;
  line-height:1.4;
  max-width:42ch;
}
.ff-groups-new{
  border:0;
  background:#e8f6f8;
  color:#2f7a8a;
  font-size:12px;
  font-weight:800;
  padding:8px 14px;
  border-radius:999px;
  cursor:pointer;
  flex-shrink:0;
  white-space:nowrap;
}
.ff-groups-new:hover{background:#d5eef2}
.ff-groups-empty{
  text-align:center;
  padding:28px 12px 18px;
  color:#556170;
}
.ff-groups-empty p{margin:0 0 6px}
/* Tab badge (Groups unread total) */
.futuron-app-tab{
  position:relative;
}
.ff-tab-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:18px;
  height:18px;
  padding:0 5px;
  margin-left:4px;
  border-radius:999px;
  background:#25d366;
  color:#fff;
  font-size:11px;
  font-weight:800;
  line-height:1;
  vertical-align:middle;
}

/* WhatsApp-style groups chat list */
.ff-groups-hub--chats{
  padding:0 !important;
  overflow:hidden;
}
.ff-groups-hub--chats .ff-groups-head{
  padding:12px 14px;
  margin:0;
  border-bottom:1px solid #e8eef3;
}
.ff-groups-hub--chats .ff-group-create{
  margin:0;
  border-radius:0;
  border-left:0;
  border-right:0;
}
.ff-groups-chat-list{
  list-style:none;
  margin:0;
  padding:0;
}
.ff-groups-chat-list li,
.ff-groups-item{
  position:relative;
  border-bottom:1px solid #f0f2f5;
  display:flex;
  align-items:stretch;
}
.ff-groups-chat-list li:last-child{border-bottom:0}
.ff-groups-item.is-pinned::before{
  content:"";
  position:absolute;
  inset-inline-start:0;
  top:10px;
  bottom:10px;
  width:3px;
  border-radius:2px;
  background:#2f7a8a;
  z-index:1;
}
.ff-group-chat-row{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  padding-inline-end:44px;
  text-decoration:none !important;
  color:inherit;
  transition:background .12s ease;
  flex:1;
  min-width:0;
}
.ff-group-chat-row:hover,
.ff-group-chat-row:active{
  background:#f5f8fa;
}
.ff-group-chat-avatar{
  width:52px;height:52px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:16px;
  font-weight:800;
  color:#fff;
  background:linear-gradient(145deg,#2f7a8a,#56a9b5);
  flex-shrink:0;
}
.ff-group-chat-main{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.ff-group-chat-top,
.ff-group-chat-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.ff-group-chat-name{
  font-size:16px;
  font-weight:700;
  color:#0f1b38;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  min-width:0;
}
.ff-groups-chat-list li.has-unread .ff-group-chat-name{
  font-weight:800;
}
.ff-group-chat-time{
  font-size:12px;
  color:#8a96a3;
  flex-shrink:0;
  font-weight:500;
}
.ff-group-chat-time.is-unread{
  color:#25d366;
  font-weight:700;
}
.ff-group-chat-preview{
  flex:1;
  min-width:0;
  font-size:13.5px;
  color:#667781;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ff-groups-chat-list li.has-unread .ff-group-chat-preview{
  color:#3b4a54;
  font-weight:600;
}
.ff-group-chat-badge{
  flex-shrink:0;
  min-width:22px;
  height:22px;
  padding:0 6px;
  border-radius:999px;
  background:#25d366;
  color:#fff;
  font-size:12px;
  font-weight:800;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}
.ff-group-card-more{display:none}
.ff-group-pin{
  position:absolute;
  inset-inline-end:6px;
  top:50%;
  transform:translateY(-50%);
  width:32px;
  height:32px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#94a3b8;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  padding:0;
  z-index:2;
}
.ff-group-pin:hover{background:#eef6f8;color:#2f7a8a}
.ff-group-pin.is-on{color:#2f7a8a}
.ff-groups-item.is-pinned .ff-group-pin{color:#2f7a8a}

/* Cards layout — description + participant faces */
.ff-groups-hub.is-view-cards .ff-groups-chat-list{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  padding:12px;
  background:#f4f7fa;
}
.ff-groups-hub.is-view-cards .ff-groups-item{
  display:flex;
  flex-direction:column;
  border:1px solid #e6eef3;
  border-radius:14px;
  background:#fff;
  box-shadow:0 1px 2px rgba(15,27,56,.04);
  overflow:hidden;
  transition:box-shadow .12s ease;
}
.ff-groups-hub.is-view-cards .ff-groups-item:hover{
  box-shadow:0 4px 14px rgba(15,27,56,.08);
}
.ff-groups-hub.is-view-cards .ff-groups-item:last-child{border-bottom:1px solid #e6eef3}
.ff-groups-hub.is-view-cards .ff-group-chat-row{
  align-items:flex-start;
  padding:14px 14px 12px;
  padding-inline-end:40px;
}
.ff-groups-hub.is-view-cards .ff-group-chat-avatar{
  width:44px;
  height:44px;
  font-size:14px;
  margin-top:2px;
}
.ff-groups-hub.is-view-cards .ff-group-chat-main{gap:8px}
.ff-groups-hub.is-view-cards .ff-group-chat-name{
  white-space:normal;
  display:-webkit-box;
  -webkit-line-clamp:2;
  line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.ff-groups-hub.is-view-cards .ff-group-chat-preview{display:none}
.ff-groups-hub.is-view-cards .ff-group-chat-bottom{
  display:none;
}
.ff-group-card-badge{display:none}
.ff-groups-hub.is-view-cards .ff-group-card-badge{
  display:inline-flex;
  margin-inline-start:auto;
}
.ff-groups-hub.is-view-cards .ff-group-card-more{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.ff-group-card-desc{
  display:-webkit-box;
  -webkit-line-clamp:3;
  line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  font-size:13px;
  line-height:1.45;
  color:#556170;
  font-weight:500;
}
.ff-group-card-people{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.ff-group-facepile{
  display:inline-flex;
  align-items:center;
  flex-direction:row;
}
.ff-group-facepile .ff-avatar{
  width:28px;
  height:28px;
  font-size:10px;
  box-shadow:0 0 0 2px #fff;
  position:relative;
  overflow:hidden;
}
.ff-group-facepile img.ff-avatar{
  object-fit:cover;
  object-position:center;
  background:#d5e3ea;
}
.ff-group-facepile .ff-avatar + .ff-avatar,
.ff-group-facepile .ff-avatar + .ff-group-face-more{
  margin-inline-start:-8px;
}
.ff-group-face-more{
  width:28px;
  height:28px;
  border-radius:50%;
  background:#e8eef3;
  color:#475569;
  font-size:10px;
  font-weight:800;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 0 0 2px #fff;
  margin-inline-start:-8px;
}
.ff-group-card-count{
  font-size:12px;
  color:#6b7a8b;
  font-weight:600;
  white-space:nowrap;
}
.ff-groups-hub.is-view-cards .ff-group-pin{
  top:10px;
  transform:none;
  inset-inline-end:8px;
}
.ff-groups-hub.is-view-cards .ff-groups-item.is-pinned::before{
  top:12px;
  bottom:12px;
}
@media (min-width:640px){
  .ff-groups-hub.is-view-cards .ff-groups-chat-list{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}
.ff-groups-empty{
  padding:28px 16px;
}
.ff-group-create,
.ff-group-edit{
  margin:0 0 14px;
  padding:14px;
  border:1px solid #d3e3ed;
  border-radius:12px;
  background:#f8fbfd;
  display:grid;
  gap:8px;
}
/* Critical: never show create/edit panels while [hidden] (class display:grid would override UA hidden) */
.ff-group-create[hidden],
.ff-group-edit[hidden]{
  display:none !important;
}
.ff-group-field-label{
  font-size:12px;
  font-weight:700;
  color:#556170;
  margin-top:4px;
}
.ff-group-name,.ff-group-desc{
  width:100%;
  box-sizing:border-box;
  padding:10px 12px;
  border:1px solid #d3e3ed;
  border-radius:10px;
  font:inherit;
  font-size:14px;
  background:#fff;
}
/* Description: multi-line plain (legacy) or rich editor. */
textarea.ff-group-desc{
  min-height:44px;
  max-height:220px;
  line-height:1.45;
  resize:none;
  overflow-y:hidden;
  field-sizing:content;
}
/* Group description RTE (same toolbar as post composer). */
.ff-group-desc-rte{
  background:#fff;
}
.ff-group-desc-rte .ff-rte-body,
.ff-group-desc.ff-rte-body{
  min-height:72px;
  max-height:200px;
  font-size:14px;
  background:#fff;
}
.ff-group-detail-desc{
  margin:0;
  font-size:14px;
  line-height:1.5;
  color:#1a2a3a;
  white-space:normal;
  word-break:break-word;
}
.ff-group-detail-desc p{margin:0 0 .45em}
.ff-group-detail-desc p:last-child{margin-bottom:0}
.ff-group-detail-desc ul,
.ff-group-detail-desc ol{margin:.3em 0 .5em;padding-left:1.3em}
.ff-group-detail-desc a{color:#0b3d5c;text-decoration:underline;font-weight:600}
.ff-group-create-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  margin-top:4px;
}
.ff-group-create-actions .is-danger,
.ff-post-tool.is-danger{
  color:#b91c1c !important;
}
/* WhatsApp-like group chat bar */
.ff-group-chat-bar{
  display:flex;
  align-items:center;
  gap:6px;
  padding:8px 8px !important;
  margin-bottom:10px;
  /* Prevent bar content from forcing horizontal overflow / name cut */
  min-width:0;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  overflow:hidden;
}
.ff-group-back-icon{
  width:36px;height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  color:#2f7a8a !important;
  text-decoration:none !important;
  font-size:18px;
  font-weight:700;
  flex:0 0 auto;
}
.ff-group-back-icon:hover{background:#e8f6f8}
.ff-group-chat-open{
  flex:1 1 auto;
  min-width:0; /* critical: allow title to shrink + ellipsis inside flex */
  max-width:100%;
  display:flex;
  align-items:center;
  gap:8px;
  border:0;
  background:transparent;
  padding:4px 4px;
  border-radius:10px;
  cursor:pointer;
  text-align:left;
  font:inherit;
  overflow:hidden;
}
.ff-group-chat-open:hover{background:#f0f4f8}
.ff-group-avatar{
  width:40px;height:40px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:15px;
  font-weight:800;
  color:#fff;
  background:linear-gradient(145deg,#2f7a8a,#56a9b5);
  flex:0 0 auto;
}
.ff-group-avatar.is-xl{
  width:88px;height:88px;
  font-size:32px;
  margin-bottom:10px;
}
.ff-group-chat-meta{
  flex:1 1 auto;
  min-width:0;
  max-width:100%;
  display:flex;
  flex-direction:column;
  gap:1px;
  overflow:hidden;
}
.ff-group-detail-name,
.ff-group-chat-meta strong{
  margin:0;
  font-size:15px;
  font-weight:800;
  color:#0f1b38;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
  display:block;
}
.ff-group-chat-meta small{
  font-size:12px;
  color:#6b7a8b;
  font-weight:500;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
  display:block;
}
.ff-group-info-btn{
  width:36px;height:36px;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#2f7a8a;
  font-size:18px;
  cursor:pointer;
  flex:0 0 auto;
}
.ff-group-info-btn:hover{background:#e8f6f8}
@media (max-width:560px){
  .ff-group-chat-bar{gap:4px;padding:6px 6px !important}
  .ff-group-back-icon,
  .ff-group-info-btn{width:32px;height:32px;font-size:16px}
  .ff-group-avatar{width:36px;height:36px;font-size:14px}
  .ff-group-detail-name,
  .ff-group-chat-meta strong{font-size:14px}
  .ff-group-chat-meta small{font-size:11px}
}

/* Full group info sheet (WA style) */
.ff-group-info-sheet{
  position:fixed;
  inset:0;
  z-index:240;
  display:flex;
  flex-direction:column;
}
.ff-group-info-sheet[hidden]{display:none !important}
.ff-group-info-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,27,56,0.35);
}
/* —— Edit post: Drive attachments —— */
.ff-edit-drive{
  margin:10px 0 4px;
  padding:10px 12px;
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#f8fafc;
}
.ff-edit-drive-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:6px;
}
.ff-edit-drive-head strong{font-size:13px;color:#0f1b38}
.ff-edit-drive-hint{
  margin:0 0 8px;
  font-size:12px;
  color:#64748b;
  line-height:1.4;
}
.ff-edit-drive-empty{
  margin:0;
  font-size:12px;
  color:#94a3b8;
}
.ff-edit-drive-row{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 0;
  border-top:1px solid #e8eef3;
  font-size:13px;
}
.ff-edit-drive-row:first-child{border-top:0}
.ff-edit-drive-name{
  flex:1;
  min-width:0;
  font-weight:700;
  color:#0f1b38;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ff-edit-drive-kind{
  font-size:11px;
  color:#64748b;
  text-transform:uppercase;
}
.ff-edit-drive-rm{
  border:0;
  background:#fee2e2;
  color:#b91c1c;
  border-radius:8px;
  padding:4px 8px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
}

/* —— Group post read receipts (WhatsApp-style) —— */
.ff-seen-ticks{
  display:inline-flex;
  align-items:center;
  gap:3px;
  margin-left:4px;
  padding:0 4px;
  border:0;
  background:transparent;
  cursor:pointer;
  vertical-align:middle;
  font:inherit;
  line-height:1;
  color:#94a3b8;
}
.ff-seen-ticks .ff-seen-mark{
  font-size:13px;
  font-weight:700;
  letter-spacing:-1px;
}
.ff-seen-ticks .ff-seen-meta{
  font-size:11px;
  font-weight:600;
  opacity:.85;
}
.ff-seen-ticks.is-double{color:#64748b}
.ff-seen-ticks.is-all{
  color:#2563eb;
}
.ff-seen-ticks.is-all .ff-seen-mark{color:#2563eb}
.ff-seen-ticks:hover{opacity:.9}
.ff-seen-popover{
  position:fixed;
  inset:0;
  z-index:10050;
  background:rgba(15,27,56,.35);
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:12px;
}
.ff-seen-popover-card{
  width:100%;
  max-width:380px;
  max-height:min(70vh,480px);
  overflow:auto;
  background:#fff;
  border-radius:16px 16px 12px 12px;
  box-shadow:0 12px 40px rgba(10,35,64,.22);
  padding:0 0 12px;
}
.ff-seen-popover-card header{
  display:flex;
  align-items:center;
  gap:8px;
  padding:12px 14px;
  border-bottom:1px solid #e8eef3;
  position:sticky;
  top:0;
  background:#fff;
}
.ff-seen-popover-card header strong{flex:1;font-size:15px}
.ff-seen-popover-x{
  width:32px;height:32px;border:0;border-radius:50%;
  background:#f1f5f9;cursor:pointer;font-size:16px;
}
.ff-seen-popover-body{padding:10px 14px}
.ff-seen-popover-summary{
  margin:0 0 10px;
  font-size:13px;
  color:#475569;
  font-weight:600;
}
.ff-seen-popover-empty{margin:8px 0;color:#94a3b8;font-size:13px}
.ff-seen-popover-list{list-style:none;margin:0;padding:0}
.ff-seen-popover-list li{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 0;
  border-bottom:1px solid #f1f5f9;
  font-size:14px;
  font-weight:600;
  color:#0f1b38;
}
.ff-seen-popover-list li:last-child{border-bottom:0}
.ff-group-chat-ticks{
  display:inline-block;
  margin-right:4px;
  font-size:12px;
  font-weight:700;
  letter-spacing:-1px;
  color:#94a3b8;
  vertical-align:middle;
}
.ff-group-chat-ticks.is-double{color:#64748b}
.ff-group-chat-ticks.is-all{color:#2563eb}

.ff-group-info-panel{
  position:relative;
  z-index:1;
  margin-top:auto;
  max-height:min(92vh, 820px);
  overflow:auto;
  background:#eef3f7;
  border-radius:16px 16px 0 0;
  box-shadow:0 -8px 32px rgba(10,35,64,0.18);
  padding-bottom:calc(20px + env(safe-area-inset-bottom));
  animation:ff-group-sheet-in .2s ease;
}
@keyframes ff-group-sheet-in{
  from{transform:translateY(24px);opacity:.6}
  to{transform:translateY(0);opacity:1}
}
body.ff-group-info-open{overflow:hidden}
.ff-group-info-top{
  position:sticky;
  top:0;
  z-index:2;
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  background:#0f1b38;
  color:#fff;
}
.ff-group-info-top strong{flex:1;font-size:16px;font-weight:800}
.ff-group-info-close{
  width:36px;height:36px;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#fff;
  font-size:18px;
  cursor:pointer;
}
.ff-group-info-close:hover{background:rgba(255,255,255,0.12)}
.ff-group-info-top-spacer{width:36px}
.ff-group-info-hero{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding:22px 16px 16px;
  background:linear-gradient(180deg,#152447 0%,#1a3358 100%);
  color:#fff;
}
.ff-group-info-name{
  margin:0;
  font-size:20px;
  font-weight:800;
  color:#fff;
}
.ff-group-info-count{
  margin:6px 0 0;
  font-size:13px;
  opacity:.85;
}
.ff-group-info-created{
  margin:4px 0 0;
  font-size:12px;
  opacity:.7;
}
.ff-group-info-card{
  margin:12px 12px 0;
  padding:14px;
  background:#fff;
  border-radius:12px;
  box-shadow:0 1px 2px rgba(10,35,64,0.06);
}
.ff-group-info-card-label{
  display:block;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:#2f7a8a;
  margin-bottom:6px;
}
.ff-group-detail-desc{
  margin:0;
  font-size:14px;
  color:#0f1b38;
  line-height:1.45;
}
.ff-group-info-empty{
  margin:0;
  font-size:13px;
  color:#8a96a3;
  font-style:italic;
}
.ff-group-info-actions{
  margin:12px 12px 0;
  background:#fff;
  border-radius:12px;
  overflow:hidden;
  box-shadow:0 1px 2px rgba(10,35,64,0.06);
}
.ff-group-action-row{
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  border:0;
  border-bottom:1px solid #f0f4f8;
  background:#fff;
  padding:14px 16px;
  font:inherit;
  font-size:15px;
  font-weight:600;
  color:#2f7a8a;
  cursor:pointer;
  text-align:left;
}
.ff-group-action-row:last-child{border-bottom:0}
.ff-group-action-row:hover{background:#f4fafb}
.ff-group-action-ico{font-size:18px;width:28px;text-align:center}
.ff-group-add-block{
  margin:12px 12px 0;
  padding:12px 14px;
  background:#fff;
  border-radius:12px;
}
.ff-group-participants{padding-top:10px}
.ff-group-participants-head{
  display:block;
  font-size:13px;
  font-weight:800;
  color:#556170;
  margin-bottom:8px;
  padding:0 2px;
}
.ff-group-member-list{
  list-style:none;
  margin:0;
  padding:0;
}
.ff-group-member-row{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:10px 2px;
  border-bottom:1px solid #f0f4f8;
  font-size:13px;
}
.ff-group-member-row:last-child{border-bottom:0}
.ff-group-member-main{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
  padding-top:2px;
}
.ff-group-member-name{font-weight:700;color:#0f1b38;font-size:14px}
.ff-group-member-role{
  font-size:11px;
  font-weight:700;
  color:#2f7a8a;
}
.ff-group-member-role.is-owner{color:#0f1b38}
.ff-group-member-role.is-admin{color:#2f7a8a}
.ff-group-member-actions{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:4px;
  flex-shrink:0;
}
.ff-group-member-act,
.ff-group-member-rm{
  border:0;
  background:transparent;
  font-size:11px;
  font-weight:700;
  cursor:pointer;
  padding:2px 4px;
  white-space:nowrap;
}
.ff-group-member-act{color:#2f7a8a}
.ff-group-member-rm{color:#b91c1c}
.ff-group-danger-row{
  display:block;
  width:calc(100% - 24px);
  margin:16px 12px 8px;
  padding:14px;
  border:0;
  border-radius:12px;
  background:#fff;
  color:#b91c1c;
  font:inherit;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  text-align:center;
  box-shadow:0 1px 2px rgba(10,35,64,0.06);
}
.ff-group-danger-row:hover{background:#fef2f2}
.ff-group-edit{
  margin:12px 12px 0;
}
.ff-group-context{
  margin:6px 0 0;
  font-size:12px;
  color:#2f7a8a;
  font-weight:600;
}
.ff-group-context-inline{
  margin:0 0 8px;
  font-size:12px;
  color:#2f7a8a;
  font-weight:600;
}
.ff-post-group-label{
  font-size:12px;
  font-weight:700;
  color:#2f7a8a;
  margin-bottom:6px;
}
.ff-composer-body-wrap{position:relative;overflow:visible}
.ff-mention-results{
  position:absolute;
  left:0;right:0;
  top:100%;
  z-index:40;
  max-height:180px;
  overflow:auto;
  background:#fff;
  border:1px solid #d3e3ed;
  border-radius:10px;
  box-shadow:0 8px 24px rgba(10,35,64,0.14);
}
/* JS switches to fixed when open so lists are not clipped by post/card edges */
.ff-mention-results.is-fixed{
  right:auto;
}
.ff-mention-results .ff-aud-result{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  width:100%;
  text-align:left;
  padding:10px 12px;
}
.ff-mention-results .ff-aud-result-name{
  font-weight:800;
  color:#0f1b38;
}
.ff-mention-results .ff-aud-result-full{
  font-size:12px;
  color:#64748b;
  font-weight:500;
}
/* Full-name mentions may wrap mid-post; keep chip-like color without clipping. */
.ff-mention{
  white-space: normal;

  color:#2f7a8a;
  font-weight:700;
  text-decoration:none;
}
a.ff-mention:hover{
  text-decoration:underline;
}
.ff-comment-form{position:relative;overflow:visible}

/* Collapsed / expanded composer (Facebook style) */
.ff-composer{
  padding:10px 12px;
  overflow:visible;
}
/* Default view: small inbox bar only */
.ff-composer:not(.is-expanded) .ff-composer-expanded{
  display:none !important;
}
.ff-composer-collapsed{
  display:flex;
  align-items:center;
  gap:10px;
  width:100%;
  border:0;
  background:transparent;
  padding:4px 0;
  cursor:pointer;
  text-align:left;
  font:inherit;
}
.ff-composer.is-expanded .ff-composer-collapsed{
  display:none !important;
}
.ff-composer-fake-input{
  flex:1;
  min-width:0;
  padding:10px 14px;
  border-radius:24px;
  background:#f0f2f5;
  color:#65676b;
  font-size:15px;
  font-weight:500;
  line-height:1.3;
}
.ff-composer-collapsed:hover .ff-composer-fake-input{
  background:#e4e6eb;
}
.ff-composer-collapsed-photo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  font-size:20px;
  opacity:.7;
  flex-shrink:0;
  color:#1f4d73;
}
.ff-composer-expanded[hidden]{display:none !important}
.ff-composer-expanded{
  display:block;
}
.ff-composer-expanded-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:10px;
  padding-bottom:10px;
  border-bottom:1px solid #e4e6eb;
}
.ff-composer-expanded-head strong{
  font-size:16px;
  font-weight:800;
  color:#0f1b38;
  flex:1;
  text-align:center;
}
.ff-composer-close{
  width:36px;height:36px;
  border:0;
  border-radius:50%;
  background:#e4e6eb;
  color:#0f1b38;
  font-size:22px;
  line-height:1;
  cursor:pointer;
  flex-shrink:0;
}
.ff-composer-close:hover{background:#d8dadf}
.ff-composer-user-line{
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-width:0;
  flex:1;
}
.ff-composer-user-line strong{
  font-size:15px;
  font-weight:700;
  color:#0f1b38;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ff-composer-voice-tool{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  padding:0;
  flex:0 0 auto;
  border-radius:999px;
  border:1px solid #c5d8e6;
  background:#fff;
  color:#1f4d73;
  cursor:pointer;
}
.ff-composer-voice-tool:hover,
.ff-composer-voice-tool.is-open,
.ff-composer-voice-tool.is-live{
  border-color:#2f7a8a;
  background:#e8f6f8;
  color:#0f1b38;
}
.ff-composer-voice-panel{
  margin:8px 0 4px;
  padding:12px;
  border:1px solid #cfe4ea;
  border-radius:14px;
  background:linear-gradient(180deg,#fbfefe,#f3f8fb);
}
.ff-composer-voice-langs{
  display:flex;
  gap:8px;
  margin:0 0 10px;
}
.ff-composer-voice-lang{
  appearance:none;
  border:1px solid #d3e3ed;
  background:#fff;
  color:#1f4d73;
  border-radius:999px;
  padding:5px 11px;
  font:inherit;
  font-size:12.5px;
  font-weight:700;
  cursor:pointer;
}
.ff-composer-voice-lang.is-on{
  border-color:#2f7a8a;
  background:#e8f6f8;
  color:#0f1b38;
}
.ff-composer-voice-infer{
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin:0 0 10px;
  font-size:12.5px;
  font-weight:600;
  color:#1f4d73;
  line-height:1.35;
  cursor:pointer;
}
.ff-composer-voice-infer input{
  margin-top:2px;
  flex:0 0 auto;
}
.ff-composer-voice-sched{
  margin:0 0 12px;
  padding:0;
  border:0;
}
.ff-composer-voice-sched legend{
  padding:0;
  margin:0 0 6px;
  font-size:12px;
  font-weight:800;
  color:#0f1b38;
}
.ff-composer-voice-sched-opt{
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin:0 0 8px;
  font-size:12.5px;
  font-weight:600;
  color:#1f4d73;
  line-height:1.35;
  cursor:pointer;
}
.ff-composer-voice-sched-opt:last-child{margin-bottom:0}
.ff-composer-voice-sched-opt input{
  margin-top:3px;
  flex:0 0 auto;
}
.ff-composer-voice-sched-opt span{min-width:0}
.ff-composer-voice-sched-opt strong{display:block;font-weight:700;color:#0f1b38}
.ff-composer-voice-sched-opt small{
  display:block;
  margin-top:2px;
  font-size:11.5px;
  font-weight:500;
  color:#556170;
}
.ff-composer-voice-sched.is-disabled,
.ff-composer-voice-sched[disabled]{
  opacity:0.48;
  cursor:not-allowed;
}
.ff-composer-voice-sched.is-disabled .ff-composer-voice-sched-opt,
.ff-composer-voice-sched[disabled] .ff-composer-voice-sched-opt{
  cursor:not-allowed;
}
.ff-plan-box{
  margin:0 0 10px;
  padding:0;
  border:none;
  background:transparent;
}
.ff-plan-bar{
  display:flex;
  align-items:flex-start;
  gap:8px;
}
.ff-plan-lead{
  display:flex;
  align-items:flex-start;
  gap:6px;
  flex:1 1 auto;
  min-width:0;
}
.ff-plan-lead .ff-plan-details{flex:1 1 auto;min-width:0}
.ff-plan-help{
  flex:0 0 auto;
  width:20px;
  height:20px;
  margin-top:8px;
  padding:0;
  border:1px solid #c5d6e2;
  border-radius:50%;
  background:#fff;
  color:#1f4d73;
  font-size:12px;
  font-weight:700;
  line-height:18px;
  text-align:center;
  cursor:pointer;
}
.ff-plan-help:hover{background:#eef6fb}
.ff-plan-guide-ov{
  position:fixed;
  inset:0;
  z-index:100040;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
  background:rgba(15,27,56,.55);
}
.ff-plan-guide-ov[hidden]{display:none !important}
.ff-plan-guide-panel{
  position:relative;
  max-width:min(1100px, 100%);
  max-height:92vh;
  overflow:auto;
  background:#fff;
  border-radius:12px;
  box-shadow:0 12px 40px rgba(15,27,56,.28);
}
.ff-plan-guide-panel img{
  display:block;
  width:100%;
  height:auto;
}
.ff-plan-guide-close{
  position:sticky;
  top:8px;
  float:right;
  z-index:1;
  margin:8px;
  width:32px;
  height:32px;
  border:0;
  border-radius:50%;
  background:#0f1b38;
  color:#fff;
  font-size:20px;
  line-height:32px;
  cursor:pointer;
}
.ff-plan-details{
  flex:1 1 auto;
  min-width:0;
  margin:0;
  border:1px solid #d3e3ed;
  border-radius:10px;
  background:#f6fbff;
}
.ff-plan-summary{
  display:flex;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  list-style:none;
  cursor:pointer;
  user-select:none;
}
.ff-plan-summary::-webkit-details-marker{display:none}
.ff-plan-summary::before{
  content:'▸';
  flex:0 0 auto;
  font-size:11px;
  color:#6a7a88;
  line-height:1;
}
.ff-plan-details[open] > .ff-plan-summary::before{content:'▾'}
.ff-plan-summary-k{
  flex:0 0 auto;
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:#6a7a88;
}
.ff-plan-summary-v{
  min-width:0;
  font-size:12.5px;
  font-weight:650;
  color:#0f1b38;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ff-plan-body{
  padding:0 10px 8px;
  border-top:1px solid #e4eef4;
}
.ff-plan-box .ff-plan-fieldset{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:4px 12px;
  margin:8px 0 0;
}
.ff-plan-box .ff-plan-fieldset legend{
  width:100%;
  margin:0;
  font-size:11px;
  font-weight:700;
  color:#556170;
}
.ff-plan-box .ff-composer-voice-sched-opt{
  margin:0;
  align-items:center;
}
.ff-plan-box .ff-composer-voice-sched-opt input{margin-top:0}
.ff-plan-box .ff-composer-voice-sched-opt strong{
  display:inline;
  font-size:12.5px;
  font-weight:650;
}
.ff-plan-actions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  flex:0 1 auto;
}
.ff-plan-recalc{
  flex:0 0 auto;
  margin:0;
  padding:7px 10px;
  border:1px solid #c5d6e2;
  border-radius:10px;
  background:#fff;
  font-size:12px;
  font-weight:700;
  color:#1f4d73;
  cursor:pointer;
  line-height:1.2;
  white-space:nowrap;
}
.ff-plan-recalc:hover{background:#eef6fb}
.ff-plan-recalc:disabled{opacity:.55;cursor:not-allowed}
.ff-plan-bar .ff-plan-recalc + .ff-plan-recalc{margin-left:0}
.ff-plan-start{
  display:flex;
  align-items:center;
  gap:8px;
  margin:8px 0 0;
}
.ff-plan-start-k{
  flex:0 0 auto;
  font-size:11px;
  font-weight:700;
  color:#556170;
}
.ff-plan-start-input{
  width:auto;
  max-width:11.5em;
  margin:0;
  padding:3px 6px;
  border:1px solid #d3e3ed;
  border-radius:6px;
  background:#fff;
  font-size:12.5px;
  font-weight:650;
  color:#0f1b38;
  line-height:1.3;
}
.ff-plan-hint{
  margin:8px 0 0;
  font-size:11px;
  color:#556170;
  line-height:1.35;
}
.ff-plan-ai{
  margin:10px 0 0;
  padding-top:8px;
  border-top:1px dashed #d3e3ed;
}
.ff-plan-ai-k{
  margin:0;
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:#6a7a88;
}
.ff-plan-ai-btn{
  margin:6px 0 0;
  padding:6px 10px;
  border:1px dashed #b7c9d6;
  border-radius:8px;
  background:transparent;
  font-size:12px;
  font-weight:700;
  color:#1f4d73;
  cursor:pointer;
  line-height:1.2;
}
.ff-plan-ai-btn:hover{background:#eef6fb}
.ff-plan-ai-btn:disabled{opacity:.55;cursor:wait}
.ff-plan-msg{
  margin:6px 0 0;
  font-size:12px;
  font-weight:600;
  color:#1a7f37;
}
.ff-plan-msg.is-error{color:#b32d2e;}
.ff-tasks-list.is-plan-seq .ff-task-step.is-btn,
.ff-tasks-draft.is-plan-seq .ff-task-step.is-btn{pointer-events:none;opacity:.55;}
.ff-composer-tasks .ff-plan-box,
.ff-edit-tasks .ff-plan-box{margin-top:8px;}
@media (max-width:640px){
  .ff-plan-bar{flex-wrap:wrap}
  .ff-plan-recalc{width:100%}
  .ff-plan-summary-v{white-space:normal}
  .ff-plan-help{width:24px;height:24px;margin-top:6px;font-size:13px;line-height:22px}
}
.ff-composer-voice-listen{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:36px;
  margin:0 0 10px;
}
.ff-composer-voice-pulse{
  width:12px;
  height:12px;
  border-radius:50%;
  background:#2f7a8a;
  box-shadow:0 0 0 0 rgba(47,122,138,.45);
  animation:ff-composer-voice-pulse 1.4s ease-out infinite;
  flex:0 0 auto;
}
@keyframes ff-composer-voice-pulse{
  0%{box-shadow:0 0 0 0 rgba(47,122,138,.45);}
  70%{box-shadow:0 0 0 12px rgba(47,122,138,0);}
  100%{box-shadow:0 0 0 0 rgba(47,122,138,0);}
}
@media (prefers-reduced-motion:reduce){
  .ff-composer-voice-pulse{animation:none;}
}
.ff-composer-voice-listen-label{
  margin:0;
  font-size:13px;
  font-weight:700;
  color:#1f4d73;
}
.ff-composer-voice-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:12.5px;
  font-weight:700;
  color:#1f4d73;
}
.ff-composer-voice-field textarea{
  width:100%;
  border:1px solid #d3e3ed;
  border-radius:12px;
  padding:8px 10px;
  font:inherit;
  font-weight:400;
  color:#0f1b38;
  resize:vertical;
  min-height:64px;
}
.ff-composer-voice-hint{
  margin:8px 0 0;
  font-size:12px;
  color:#556170;
  line-height:1.45;
}
.ff-composer-voice-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}
.ff-composer.is-expanded{
  padding:12px 14px 14px;
}
.ff-composer.is-expanded .ff-rte-body.ff-composer-body,
.ff-composer.is-expanded .ff-composer-body{
  min-height:120px;
  font-size:20px;
  background:transparent;
  border:0;
  border-radius:0;
  padding:8px 0;
}
.ff-composer.is-expanded .ff-composer-body:focus{
  box-shadow:none;
  border:0;
  background:transparent;
}
/* Expanded = modal overlay (all viewports, FB create-post dialog).
 * Center with inset + margin — NOT transform. transform makes position:fixed
 * descendants (mention dropdown) use the dialog as containing block, so they
 * jump to the far right on desktop. */
.ff-composer.is-expanded{
  position:fixed;
  z-index:220;
  left:0;
  right:0;
  top:0;
  bottom:0;
  width:min(500px, calc(100vw - 24px));
  height:fit-content;
  max-height:min(90vh, 720px);
  margin:auto;
  transform:none;
  overflow:auto;
  border-radius:12px;
  box-shadow:0 12px 40px rgba(0,0,0,0.28);
  padding:12px 16px 16px;
}
body.ff-composer-open{
  overflow:hidden;
}
body.ff-composer-open::before{
  content:"";
  position:fixed;
  inset:0;
  background:rgba(255,255,255,0.8);
  z-index:210;
  pointer-events:auto;
}
@media (max-width:560px){
  .ff-composer.is-expanded{
    left:0;
    top:0;
    right:0;
    bottom:0;
    transform:none;
    width:100%;
    max-height:100vh;
    border-radius:0;
    padding:12px 14px calc(16px + env(safe-area-inset-bottom));
    box-shadow:none;
  }
  body.ff-composer-open::before{
    display:none;
  }
}

/* Group discussion Active / Archive */
.ff-group-disc-tabs{
  display:flex;
  gap:8px;
  padding:0 2px 4px;
  flex-wrap:wrap;
  align-items:center;
}
.ff-group-posts-view{
  margin-inline-start:auto;
}
.ff-group-disc-tab{
  display:inline-flex;
  align-items:center;
  padding:8px 14px;
  border-radius:999px;
  border:1px solid #c5d8e6;
  background:#fff;
  color:#1f4d73;
  font-size:13px;
  font-weight:700;
  text-decoration:none;
  line-height:1.2;
}
.ff-group-disc-tab:hover{background:#eef6fb;border-color:#1f4d73;color:#0f1b38}
.ff-group-disc-tab.is-active{
  background:#0f1b38;
  border-color:#0f1b38;
  color:#fff;
}

/* Group discussion Cards: work-scan board from the same loaded posts (no extra query).
   First paint uses saved slot classes (m/d) + viewport; JS is-view-* stays for click. */
.ff-card-scan{display:none}
@media (max-width:719px){
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)){
    display:grid;
    gap:10px;
    grid-template-columns:1fr;
    align-items:stretch;
  }
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open){
    cursor:pointer;
    display:flex;
    flex-direction:column;
    min-width:0;
  }
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open):hover{
    box-shadow:0 4px 14px rgba(15,27,56,.08);
  }
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-card-scan{
    display:block;
    padding:2px 16px 10px;
    flex:1;
    min-width:0;
  }
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-body,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-image,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-yt-preview,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-yt-list,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-drive-attach,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-drive-attach-list,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) [data-ff-post-drives],
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-panels,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-tasks,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-shared-card,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-comments,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-discussion-banner,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-more[data-ff-post-more],
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-audience-names,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-stats,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-editor,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-privacy-editor{
    display:none !important;
  }
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-actions{
    margin-top:auto;
  }
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--m-cards:not(.is-view-list)) .ff-post.is-open{
    outline:1px solid #c5d8e6;
  }
}
@media (min-width:720px){
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)){
    display:grid;
    gap:10px;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    align-items:stretch;
  }
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open){
    cursor:pointer;
    display:flex;
    flex-direction:column;
    min-width:0;
  }
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open):hover{
    box-shadow:0 4px 14px rgba(15,27,56,.08);
  }
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-card-scan{
    display:block;
    padding:2px 16px 10px;
    flex:1;
    min-width:0;
  }
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-body,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-image,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-yt-preview,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-yt-list,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-drive-attach,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-drive-attach-list,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) [data-ff-post-drives],
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-panels,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-tasks,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-shared-card,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-comments,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-discussion-banner,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-more[data-ff-post-more],
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-audience-names,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-stats,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-editor,
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-privacy-editor{
    display:none !important;
  }
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post:not(.is-open) .ff-post-actions{
    margin-top:auto;
  }
  :is(#ff-feed.is-view-cards, #ff-feed.ff-feed--d-cards:not(.is-view-list)) .ff-post.is-open{
    outline:1px solid #c5d8e6;
    grid-column:1 / -1;
  }
}
.ff-card-scan-top{
  display:flex;
  align-items:flex-start;
  gap:8px;
  min-width:0;
}
.ff-card-scan-title{
  flex:1;
  min-width:0;
  margin:0;
  font-size:15px;
  font-weight:800;
  line-height:1.3;
  color:#0f1b38;
  display:-webkit-box;
  -webkit-line-clamp:2;
  line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.ff-card-scan-chip{
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  margin-top:1px;
  padding:3px 8px;
  border-radius:999px;
  border:1px solid #e2e8f0;
  background:#f8fafc;
  color:#475569;
  font-size:11px;
  font-weight:800;
  letter-spacing:.01em;
  line-height:1.2;
  white-space:nowrap;
}
.ff-card-scan-chip.is-awaiting{
  background:#fff7ed;
  border-color:#fdba74;
  color:#c2410c;
}
.ff-card-scan-chip.is-blocked{
  background:#fef2f2;
  border-color:#fecaca;
  color:#b91c1c;
}
.ff-card-scan-chip.is-completed{
  background:#ecfdf5;
  border-color:#a7f3d0;
  color:#047857;
}
.ff-card-scan-chip.is-progress{
  background:#eef6fb;
  border-color:#c5d8e6;
  color:#1f4d73;
}
.ff-card-scan-chip.is-discussion{
  background:#f8fafc;
  border-color:#e2e8f0;
  color:#475569;
}
.ff-card-scan-work{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:8px;
  min-width:0;
}
.ff-card-scan-work:not(:has(.ff-card-scan-metric)):not(:has(.ff-card-scan-thumb)){
  display:none;
}
.ff-card-scan-metrics{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px 10px;
  flex:1;
  min-width:0;
  font-size:12px;
  font-weight:700;
  color:#475569;
}
.ff-card-scan-metric{
  display:inline-flex;
  align-items:center;
  gap:4px;
  white-space:nowrap;
}
.ff-card-scan-bar{
  width:44px;
  height:6px;
  border-radius:99px;
  background:#e2e8f0;
  overflow:hidden;
}
.ff-card-scan-bar > span{
  display:block;
  height:100%;
  background:#2f7a8a;
  border-radius:99px;
}
.ff-card-scan:has(.ff-card-scan-chip.is-blocked) .ff-card-scan-bar > span{
  background:#b91c1c;
}
.ff-card-scan:has(.ff-card-scan-chip.is-completed) .ff-card-scan-bar > span{
  background:#047857;
}
.ff-card-scan-thumb{
  flex-shrink:0;
  width:56px;
  height:56px;
  border-radius:8px;
  overflow:hidden;
  background:#e8eef3;
}
.ff-card-scan-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.ff-post-badge--closed{
  background:#f1f5f9;
  color:#475569;
  border:1px solid #e2e8f0;
}
.ff-post.is-discussion-closed{
  opacity:0.98;
  border-color:#e2e8f0;
}
.ff-discussion-banner{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 12px;
  margin:0 12px 10px;
  padding:10px 12px;
  border-radius:10px;
  background:#f8fafc;
  border:1px solid #e2e8f0;
  font-size:13px;
  color:#475569;
  line-height:1.4;
}
.ff-discussion-banner strong{color:#0f1b38;font-weight:800}
.ff-discussion-reopen{
  margin-left:auto;
  border:1px solid #c5d8e6;
  background:#fff;
  border-radius:8px;
  padding:6px 12px;
  font-size:12px;
  font-weight:700;
  color:#1f4d73;
  cursor:pointer;
}
.ff-discussion-reopen:hover{border-color:#1f4d73;background:#eef6fb}
.ff-action.is-disabled{
  opacity:0.55;
  cursor:default;
  pointer-events:none;
}
.ff-group-email-card .ff-group-email-opt{
  display:flex;
  gap:10px;
  align-items:flex-start;
  margin:4px 0 0;
  padding:10px 12px;
  border-radius:12px;
  background:#f4f7fa;
  border:1px solid #e2e8f0;
  font-size:13px;
  cursor:pointer;
}
.ff-group-email-opt input{margin-top:3px;flex:0 0 auto}
.ff-group-email-opt strong{display:block;font-weight:800;color:#0f1b38}
.ff-group-email-opt small{display:block;margin-top:3px;color:#64748b;line-height:1.4;font-weight:500}
.ff-group-email-status{
  margin:6px 0 0;
  font-size:13px;
  font-weight:700;
  color:#0f1b38;
}
#ff-group-email-msg{
  margin:8px 0 0;
  font-size:12px;
}
#ff-group-email-msg.is-ok{color:#0f766e}
#ff-group-email-msg.is-error{color:#b91c1c}
@media (max-width:480px){
  .ff-discussion-reopen{margin-left:0;width:100%}
}

/* �� Group post Tasks �� */
.ff-composer-tasks{
  margin:8px 0 10px;
  padding:10px 12px;
  border:1px solid #d3e3ed;
  border-radius:12px;
  background:#f7fafc;
}
.ff-composer-tasks-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:8px;
  font-size:13px;
  color:#0f1b38;
}
.ff-tasks-draft{list-style:none;margin:0 0 8px;padding:0;display:grid;gap:6px;}
.ff-tasks-draft-item{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:10px;
  background:#fff;
  border:1px solid #e2ebf2;
  font-size:13px;
}
.ff-tasks-draft-item .ff-task-title{flex:1;min-width:0;word-break:break-word;}
.ff-tasks-draft-item .ff-task-step{padding-top:0;align-self:center;}
.ff-tasks-draft-item .ff-task-together{flex:0 0 auto;}
.ff-task-remove{
  appearance:none;border:0;background:transparent;color:#8a97a6;
  font-size:18px;line-height:1;cursor:pointer;padding:0 4px;
}
.ff-tasks-add-row{
  display:flex;flex-wrap:wrap;gap:6px;align-items:center;
}
.ff-tasks-title-input{
  flex:1 1 140px;min-width:0;border:1px solid #c9d7e3;border-radius:8px;
  padding:8px 10px;font:inherit;font-size:13px;
}
.ff-tasks-est-input{
  width:64px;border:1px solid #c9d7e3;border-radius:8px;padding:8px 8px;font:inherit;font-size:13px;
}
.ff-tasks-unit{
  border:1px solid #c9d7e3;border-radius:8px;padding:8px 8px;font:inherit;font-size:13px;background:#fff;
}
.ff-tasks-add-btn{
  appearance:none;border:0;border-radius:8px;padding:8px 12px;font:inherit;font-size:13px;font-weight:700;
  background:#0f1b38;color:#fff;cursor:pointer;
}
.ff-tasks{
  margin:10px 12px 4px;
  padding:10px 12px;
  border:1px solid #e2ebf2;
  border-radius:12px;
  background:linear-gradient(180deg,#fbfcfe,#f4f8fb);
}
.ff-tasks-head{
  display:flex;align-items:center;gap:8px;margin-bottom:8px;
  font-size:13px;color:#0f1b38;
}
.ff-tasks-ico{
  display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;border-radius:999px;background:#0f1b38;color:#fff;font-size:12px;font-weight:800;
}
.ff-tasks-count{margin-inline-start:auto;font-size:12px;color:#556170;font-weight:600;}
.ff-tasks-empty{margin:0;font-size:12.5px;color:#6b7a8b;}
.ff-post-task{display:grid;gap:4px;margin:0 0 10px;}
.ff-post-task-btn{
  appearance:none;justify-self:start;padding:7px 12px;border-radius:999px;
  border:1px solid #c5d5e0;background:#fff;color:#0f1b38;font:inherit;font-size:13px;font-weight:700;cursor:pointer;
}
.ff-post-task-btn.is-on{border-color:#2f7a8a;background:#f4fbfb;box-shadow:0 0 0 2px rgba(47,122,138,.18);}
.ff-post-task-hint{margin:0;font-size:12px;color:#6b7a8b;line-height:1.4;}
.ff-tasks-list{list-style:none;margin:0;padding:0;display:grid;gap:4px;}
.ff-tasks-list.is-collapsed .ff-task-item.is-extra{display:none !important;}
.ff-tasks-more{
  appearance:none;
  display:inline-block;
  margin:4px 0 0;
  padding:2px 0;
  border:0;
  background:transparent;
  font:inherit;
  font-size:12px;
  font-weight:700;
  color:#1f4d73;
  cursor:pointer;
  min-height:0;
  line-height:1.3;
}
.ff-tasks-more:hover{text-decoration:underline;}
.ff-tasks-more:focus-visible{
  outline:2px solid #93c5fd;
  outline-offset:2px;
  border-radius:4px;
}
.ff-task-item{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:4px;
  padding:6px 8px;
  border-radius:8px;
  background:#fff;
  border:1px solid #e8eef4;
}
.ff-task-main{
  display:flex;
  align-items:flex-start;
  gap:6px;
  min-width:0;
  width:100%;
}
.ff-task-chips{
  display:inline-flex;
  align-items:center;
  gap:5px;
  flex-wrap:wrap;
  margin:0;
  padding-inline-start:20px; /* sit under title, past drag column */
}
.ff-task-item:has(.ff-task-drag):has(.ff-task-step) .ff-task-chips{padding-inline-start:42px;}
.ff-task-item:not(:has(.ff-task-drag)) .ff-task-chips{padding-inline-start:0;}
.ff-task-item:not(:has(.ff-task-drag)):has(.ff-task-step) .ff-task-chips{padding-inline-start:22px;}
.ff-task-step{
  flex:0 0 1.2rem;
  min-width:1.2rem;
  font-size:11px;
  font-weight:800;
  color:#556170;
  text-align:center;
  line-height:1.45;
  padding-top:2px;
}
.ff-task-step.is-btn{
  appearance:none;
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;
  font:inherit;
  font-size:11px;
  font-weight:800;
  color:#556170;
}
.ff-task-step.is-btn:hover,
.ff-task-step.is-btn:focus-visible{
  color:#0f1b38;
}
.ff-task-parmark{
  display:inline-block;
  margin-inline-start:1px;
  font-weight:800;
  color:#4a2d6b;
  font-size:12px;
  line-height:1;
}
.ff-task-drag{
  flex:0 0 16px;
  display:inline-flex;
  align-items:flex-start;
  justify-content:center;
  width:16px;
  height:auto;
  min-height:0;
  margin:0;
  padding:2px 0 0;
  border:0;
  background:transparent;
  color:#94a3b8;
  font-size:11px;
  font-weight:800;
  letter-spacing:-1px;
  line-height:1.2;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
  -webkit-user-drag:none;
  touch-action:none;
  opacity:.55;
}
body.ff-task-sorting{
  cursor:grabbing !important;
  user-select:none !important;
}
body.ff-task-sorting *{
  cursor:grabbing !important;
  user-select:none !important;
}
.ff-task-item:hover .ff-task-drag,
.ff-task-item:focus-within .ff-task-drag,
.ff-task-drag:hover,
.ff-task-drag:focus-visible{
  opacity:1;
  color:#1f4d73;
}
@media (hover:none){
  .ff-task-drag{opacity:.65;}
}
.ff-task-item.is-dragging,
.ff-tasks-draft-item.is-dragging{
  opacity:.72;
  box-shadow:0 8px 20px rgba(15,27,56,.12);
  border-color:#93c5fd;
  background:#f8fbff;
  z-index:2;
}
.ff-tasks-list.is-sorting,
.ff-tasks-draft.is-sorting{cursor:grabbing;}
.ff-tasks-list.is-sorting .ff-task-drag,
.ff-tasks-draft.is-sorting .ff-task-drag{cursor:grabbing;}
.ff-tasks-draft-item.is-draggable,
.ff-task-item.is-draggable{position:relative;}
.ff-task-item.is-done{opacity:.72;}
.ff-task-item.is-done .ff-task-title{text-decoration:line-through;color:#6b7a8b;}
.ff-task-check{
  display:flex;align-items:flex-start;gap:8px;flex:1;min-width:0;cursor:pointer;font-size:13px;color:#0f1b38;
}
.ff-task-check input{
  margin-top:2px;width:18px;height:18px;accent-color:#1f4d73;flex:0 0 auto;
}
.ff-task-title{line-height:1.35;word-break:break-word;}
.ff-task-title-wrap{
  flex:1 1 auto;
  min-width:0;
  display:block;
}
.ff-task-title--btn{
  appearance:none;
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  font:inherit;
  font-size:13px;
  font-weight:600;
  color:#0f1b38;
  text-align:start;
  cursor:default;
  display:block;
  width:100%;
  min-width:0;
  line-height:1.35;
  word-break:break-word;
}
.ff-task-title--btn.is-expandable{cursor:pointer;}
.ff-task-title--btn.is-expandable:hover{color:#1f4d73;}
.ff-task-title-short,
.ff-task-title-full{
  display:block;
  text-align:start;
}
.ff-task-title-short{
  /* ~2 lines so AR/EN preview uses available width before expand */
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:normal;
  line-height:1.4;
  max-height:calc(1.4em * 2);
}
.ff-task-title-full{
  white-space:pre-wrap;
  font-weight:600;
}
/* Important: author CSS must not override the HTML hidden attribute. */
.ff-task-title-wrap:not(.is-expanded) .ff-task-title-full,
.ff-task-title-full[hidden],
.ff-task-title-short[hidden]{
  display:none !important;
}
.ff-task-title-wrap.is-expanded .ff-task-title-short{
  display:none !important;
}
.ff-task-title-wrap.is-expanded .ff-task-title-full{
  display:block !important;
}
/* When expanded, let the full text use the whole row under the chips. */

.ff-tasks-title-input{
  min-height:72px !important;
  max-height:220px;
  white-space:pre-wrap;
  line-height:1.45;
  resize:vertical;
}
.ff-task-pop-est-row--stack{flex-direction:column;align-items:stretch;}
.ff-task-pop-est-row--stack .ff-tasks-title-input{width:100%;}
.ff-task-est{
  flex:0 0 auto;font-size:11px;font-weight:700;color:#1f4d73;
  background:#eef5f8;border-radius:999px;padding:3px 8px;white-space:nowrap;
}
@media (max-width:640px){
  .ff-tasks{
    margin:6px 8px 2px;
    padding:8px 9px;
    border-radius:10px;
  }
  .ff-tasks-head{margin-bottom:6px;font-size:12.5px;gap:6px;}
  .ff-tasks-ico{width:18px;height:18px;font-size:10px;}
  .ff-tasks-list{gap:3px;}
  .ff-task-item{
    padding:5px 7px;
    border-radius:8px;
    gap:3px;
  }
  .ff-task-title--btn{font-size:12.5px;}
  .ff-task-chips{padding-inline-start:20px;gap:5px;}
  .ff-task-item:not(:has(.ff-task-drag)) .ff-task-chips{padding-inline-start:0;}
  .ff-composer-tasks,
  .ff-edit-tasks{
    margin:6px 0 8px;
    padding:8px 9px;
    border-radius:10px;
  }
  .ff-composer-tasks-head{margin-bottom:6px;font-size:12.5px;}
  .ff-tasks-draft{gap:4px;margin-bottom:6px;}
  .ff-tasks-draft-item{padding:6px 8px;border-radius:8px;font-size:12.5px;gap:6px;}
  .ff-tasks-add-row{flex-direction:column;align-items:stretch;gap:6px;}
  .ff-tasks-est-input,.ff-tasks-unit,.ff-tasks-add-btn{width:100%;}
  .ff-tasks-title-input,
  .ff-tasks-title-input.ff-comment-input{
    min-height:34px;
    padding:7px 10px;
    font-size:13px;
    border-radius:14px;
  }
  .ff-tasks-add-btn{padding:8px 10px;font-size:12.5px;}
}

/* Task title input � match reply box (grow + bidi) */
.ff-tasks-add-row{
  align-items:flex-end;
}
.ff-tasks-title-input.ff-comment-input{
  flex:1 1 160px;
  width:100%;
  min-height:36px;
  max-height:140px;
  border-radius:18px;
  background:#f0f2f5;
  border:0;
  resize:none;
  overflow-y:hidden;
  unicode-bidi:plaintext;
  text-align:start;
  box-sizing:border-box;
}
.ff-tasks-title-input.ff-comment-input[dir=\"rtl\"]{text-align:right}
.ff-tasks-title-input.ff-comment-input[dir=\"ltr\"]{text-align:left}
.ff-tasks-title-input.ff-comment-input:focus{
  outline:none;
  background:#e4e6eb;
}
.ff-edit-tasks{
  margin-top:12px;
  padding:10px 12px;
  border:1px solid #d3e3ed;
  border-radius:12px;
  background:#f7fafc;
}
.ff-tasks-draft-item.is-done .ff-task-title{
  text-decoration:line-through;
  color:#6b7a8b;
}

/* Inline edit of existing task rows */
.ff-tasks-draft-item--edit{
  flex-direction:column;
  align-items:stretch;
  gap:8px;
}
.ff-tasks-edit-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
}
.ff-tasks-draft-item--edit .ff-tasks-title-input{
  width:100%;
  flex:1 1 auto;
}

/* ── Tasks v2 chips + popover + group board ── */
.ff-task-item{
  display:flex;
  align-items:flex-start;
  gap:8px;
  flex-wrap:wrap;
}
.ff-task-item .ff-task-title{
  flex:1 1 120px;
  min-width:0;
  font-size:13px;
  color:#0f1b38;
  padding-top:2px;
}
.ff-task-chip{
  appearance:none;
  border:1px solid #d7e3ec;
  background:#fff;
  border-radius:999px;
  min-height:28px;
  min-width:28px;
  padding:3px 7px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  font-size:12px;
  font-weight:700;
  color:#1f4d73;
  cursor:pointer;
  line-height:1;
}
.ff-task-chip:disabled{
  cursor:default;
  opacity:.85;
}
.ff-task-chip:not(:disabled):hover{
  border-color:#1f4d73;
  background:#eef6fb;
}
.ff-task-chip--status{
  width:28px;
  min-width:28px;
  min-height:28px;
  padding:2px;
  font-size:13px;
}
.ff-task-chip--status.is-todo{color:#64748b;background:#f8fafc;}
.ff-task-chip--status.is-doing{color:#1d4ed8;background:#eff6ff;border-color:#bfdbfe;}
.ff-task-chip--status.is-blocked{color:#b45309;background:#fffbeb;border-color:#fde68a;}
.ff-task-chip--status.is-done{color:#0f766e;background:#ecfdf5;border-color:#a7f3d0;}
.ff-task-chip--assignee{
  padding:1px 3px 1px 1px;
  min-height:28px;
}
.ff-task-chip--assignee.is-multi{padding-inline-end:3px;}
.ff-task-av-stack{
  display:inline-flex;
  align-items:center;
  flex-direction:row;
}
.ff-task-av-stack .ff-task-chip-av{
  box-shadow:0 0 0 1.5px #fff;
  position:relative;
}
.ff-task-av-stack .ff-task-chip-av + .ff-task-chip-av{
  margin-inline-start:-7px;
}
.ff-task-chip--assignee.is-empty,
.ff-task-chip--est.is-empty,
.ff-task-chip--due.is-empty{
  color:#94a3b8;
  border-style:dashed;
  font-weight:600;
}
.ff-task-chip--est{
  font-variant-numeric:tabular-nums;
  color:#475569;
  background:#f1f5f9;
  min-height:28px;
  font-size:12px;
}
.ff-task-chip.ff-task-chip--completed{
  gap:3px;
  min-height:18px;
  min-width:0;
  padding:1px 5px 1px 6px;
  color:#0f766e;
  background:#ecfdf5;
  border-color:#99f6e4;
  font-size:10px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:0;
  cursor:default;
  border-radius:6px;
}
button.ff-task-chip.ff-task-chip--completed{
  cursor:pointer;
}
button.ff-task-chip.ff-task-chip--completed:hover{
  background:#ccfbf1;
  border-color:#2dd4bf;
}
.ff-task-comp-edit{
  display:inline-block;
  width:8px;
  height:8px;
  flex-shrink:0;
  background:currentColor;
  opacity:.7;
  pointer-events:none;
  /* pencil */
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%23000' d='M8.1 1.2l2.7 2.7-7.2 7.2H.9V8.4l7.2-7.2zm.9-.9l.7-.7c.4-.4 1-.4 1.4 0l.3.3c.4.4.4 1 0 1.4l-.7.7-1.7-1.7z'/%3E%3C/svg%3E") center/contain no-repeat;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%23000' d='M8.1 1.2l2.7 2.7-7.2 7.2H.9V8.4l7.2-7.2zm.9-.9l.7-.7c.4-.4 1-.4 1.4 0l.3.3c.4.4.4 1 0 1.4l-.7.7-1.7-1.7z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.ff-task-chip--due{
  font-size:12.5px;
  font-weight:600;
  color:#64748b;
  background:#f8fafc;
  border-color:#e2e8f0;
  opacity:1;
  letter-spacing:.01em;
  min-height:28px;
  min-width:28px;
  padding:3px 7px;
}
.ff-task-chip--due:not(.is-empty):not(:disabled):hover{
  color:#1f4d73;
  background:#eef6fb;
  border-color:#1f4d73;
  opacity:1;
}
.ff-task-chip--ico{
  width:26px;
  height:26px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.ff-task-chip--google{
  font-size:11px;
  font-weight:700;
  color:#174ea6;
  background:#e8f0fe;
  border-color:#c6dafc;
  padding:3px 8px;
}
.ff-task-chip--google.ff-task-chip--ico{ padding:0; }
.ff-task-chip--google:disabled{
  opacity:.6;
  cursor:wait;
}
.ff-task-chip--google.is-on{
  cursor:pointer;
  color:#0f766e;
  background:#ecfdf5;
  border-color:#a7f3d0;
}
.ff-task-chip--meet{
  color:#0f766e;
  background:#ecfdf5;
  border-color:#a7f3d0;
}
.ff-task-chip--meet:disabled{ opacity:.6; cursor:wait; }
.ff-task-meet{
  position:fixed;
  inset:0;
  z-index:80;
  display:grid;
  place-items:center;
  padding:16px;
  background:rgba(15,27,56,.35);
}
.ff-task-meet[hidden]{ display:none !important; }
.ff-task-meet-card{
  width:min(440px,100%);
  max-height:min(88vh,720px);
  overflow:auto;
  padding:16px;
  border-radius:16px;
  background:#fff;
  box-shadow:0 16px 40px rgba(15,27,56,.18);
  display:grid;
  gap:10px;
}
.ff-task-meet-card h3{ margin:0; font-size:16px; }
.ff-task-meet-kind{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:4px; padding:3px; background:#f4f7fa; border-radius:12px; }
.ff-task-meet-kind label{
  position:relative;
  display:flex; align-items:center; justify-content:center;
  padding:8px 4px; border-radius:10px; font-size:11px; font-weight:700; cursor:pointer; color:#556170;
}
.ff-task-meet-kind label.is-on{ background:#fff; color:#0f1b38; }
.ff-task-meet-kind input{ position:absolute; opacity:0; pointer-events:none; }
.ff-task-meet-people{ display:flex; flex-wrap:wrap; gap:6px; }
.ff-task-meet-people-list{ display:flex; flex-wrap:wrap; gap:6px; width:100%; }
.ff-task-meet-people-list label{
  display:inline-flex; align-items:center; gap:6px;
  padding:4px 8px; border:1px solid #d3e3ed; border-radius:999px; font-size:12px; font-weight:600; cursor:pointer;
}
.ff-task-meet-add{
  width:100%;
  border:0 !important;
  border-radius:0;
  padding:0;
  background:transparent;
  cursor:auto;
}
.ff-task-meet-hits{
  display:grid; gap:2px; width:100%;
}
.ff-task-meet-hits button{
  appearance:none; display:block; width:100%; margin:0; padding:7px 8px;
  border:0; border-radius:8px; background:#f4f7fa; color:#0f1b38;
  font:inherit; font-size:13px; font-weight:600; text-align:start; cursor:pointer;
}
.ff-task-meet-hits button:hover{ background:#e8eef2; }
.ff-task-meet-actions{ display:flex; gap:8px; justify-content:flex-end; margin:0; }
.ff-task-meet-msg{ margin:0; font-size:13px; font-weight:600; color:#1f4d73; }
.ff-task-meet-msg.is-error{ color:#b91c1c; }
.ff-task-meet-card .ff-field{ display:grid; gap:4px; font-size:12px; font-weight:700; color:#0f1b38; }
.ff-task-meet-card .ff-field[hidden]{ display:none !important; }
.ff-task-meet-card .ff-field-label{ display:block; font-size:12px; font-weight:700; color:#0f1b38; margin-bottom:4px; }
.ff-task-meet-card .ff-field input,
.ff-task-meet-card .ff-field textarea{
  font:inherit;
  font-size:15px;
  font-weight:500;
  padding:8px 10px;
  border:1px solid #d3e3ed;
  border-radius:12px;
  background:#f8fafc;
  color:#0f1b38;
  box-sizing:border-box;
  width:100%;
}
.ff-task-meet-card .ff-field textarea{ min-height:72px; resize:vertical; }
.ff-task-meet-times{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.ff-task-meet-people-h{ margin:0 0 4px; width:100%; font-size:12px; font-weight:700; color:#0f1b38; }
.ff-task-meet-people-list label:has(:checked){ background:#ecfdf5; border-color:#a7f3d0; }
.ff-task-meet .ff-btn,
.ff-task-meet .ff-btn-ghost{
  appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0;
  padding:8px 12px;
  border-radius:10px;
  font:inherit;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}
.ff-task-meet .ff-btn{
  border:1px solid #0f1b38;
  background:#0f1b38;
  color:#fff;
}
.ff-task-meet .ff-btn:disabled{ opacity:.55; cursor:wait; }
.ff-task-meet .ff-btn-ghost{
  border:1px solid #d3e3ed;
  background:#fff;
  color:#0f1b38;
}
@media (max-width:480px){
  .ff-task-meet-times{ grid-template-columns:1fr; }
}
.ff-task-chip--due.is-overdue{
  color:#b45309;
  background:#fffbeb;
  border-color:#fde68a;
  opacity:1;
}
.ff-task-due-lock{
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
  color:#64748b;
  opacity:.88;
  line-height:0;
  pointer-events:none;
}
.ff-task-due-lock svg{
  display:block;
}
.ff-task-chip--due.is-overdue .ff-task-due-lock,
.ff-task-chip--due:not(.is-empty):not(:disabled):hover .ff-task-due-lock{
  color:currentColor;
}
.ff-task-chip-av{
  width:20px;
  height:20px;
  border-radius:50%;
  object-fit:cover;
  display:inline-block;
  vertical-align:middle;
}
.ff-task-chip-av--init{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#0f1b38;
  color:#fff;
  font-size:9px;
  font-weight:800;
}
.ff-task-item.is-doing{border-color:#bfdbfe;background:#f8fbff;}
.ff-task-item.is-blocked{border-color:#fde68a;background:#fffdf5;}
.ff-task-item.is-done{opacity:.72;}
.ff-task-item.is-done .ff-task-title{text-decoration:line-through;color:#6b7a8b;}
.ff-tasks-draft-item{
  flex-wrap:wrap;
}
.ff-tasks-draft-main{
  display:flex;
  align-items:flex-start;
  gap:8px;
  width:100%;
}
.ff-tasks-draft-main .ff-tasks-title-input{flex:1;min-width:0;}
.ff-tasks-add-hint{margin:8px 0 0;font-size:12px;color:#64748b;}

.ff-task-popover{
  position:fixed;
  z-index:10060;
  min-width:180px;
  max-width:min(320px, calc(100vw - 20px));
  max-height:min(70vh, 420px);
  overflow:auto;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:12px;
  box-shadow:0 12px 32px rgba(15,27,56,.18);
  padding:6px;
  box-sizing:border-box;
  -webkit-overflow-scrolling:touch;
}
.ff-task-popover--sheet{
  min-width:0;
  max-width:none;
  border-radius:14px;
  padding:10px;
  max-height:min(75vh, 480px);
}
.ff-task-popover--sheet .ff-task-pop-est-row{
  flex-wrap:wrap;
}
.ff-task-popover--sheet .ff-tasks-due-input,
.ff-task-popover--sheet .ff-tasks-est-input{
  width:100%;
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}
.ff-task-popover--sheet .ff-task-pop-unit-toggle{
  width:100%;
}
.ff-task-popover--sheet .ff-task-pop-unit{
  flex:1;
}
.ff-task-popover-inner{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.ff-task-popover-inner--list{max-height:280px;overflow:auto;}
.ff-task-popover-assignees{gap:4px;}
.ff-task-pop-assignee-head{
  padding:6px 10px 4px;
  font-size:12px;
  font-weight:800;
  color:#475569;
  letter-spacing:.01em;
}
.ff-task-pop-assignee-cap{font-weight:600;color:#94a3b8;}
.ff-task-pop-check{
  width:14px;
  flex:0 0 14px;
  text-align:center;
  color:#1d4ed8;
  font-size:12px;
  font-weight:800;
}
.ff-task-pop-btn{
  appearance:none;
  border:0;
  background:transparent;
  border-radius:8px;
  padding:8px 10px;
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  text-align:start;
  font:inherit;
  font-size:13px;
  font-weight:600;
  color:#0f1b38;
  cursor:pointer;
  min-height:40px;
}
.ff-task-pop-btn:hover{background:#eef6fb;}
.ff-task-pop-btn.is-active{background:#eef6fb;}
.ff-task-popover-assignees .ff-task-pop-btn.is-active{
  background:#dbeafe;
  box-shadow:inset 0 0 0 1.5px #3b82f6;
  color:#1e3a8a;
}
.ff-task-popover-assignees .ff-task-pop-btn.is-active .ff-task-pop-check{
  color:#1d4ed8;
  font-size:13px;
}
.ff-task-popover-est{padding:6px;gap:8px;}
.ff-task-pop-est-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  font-size:12px;
  font-weight:700;
  color:#475569;
}
.ff-task-pop-est-row .ff-tasks-est-input,
.ff-task-pop-est-row .ff-tasks-unit,
.ff-task-pop-est-row .ff-tasks-due-input{width:auto;min-width:72px;}
.ff-tasks-due-input{
  border:1px solid #c9d7e3;
  border-radius:8px;
  padding:8px 8px;
  font:inherit;
  font-size:13px;
  background:#fff;
  max-width:100%;
}
.ff-task-pop-unit-toggle{
  display:inline-flex;
  border:1px solid #c9d7e3;
  border-radius:8px;
  overflow:hidden;
  background:#fff;
}
.ff-task-pop-unit{
  appearance:none;
  border:0;
  background:transparent;
  padding:7px 12px;
  font:inherit;
  font-size:12px;
  font-weight:700;
  color:#64748b;
  cursor:pointer;
  min-height:36px;
}
.ff-task-pop-unit + .ff-task-pop-unit{border-inline-start:1px solid #c9d7e3;}
.ff-task-pop-unit.is-active{
  background:#0f1b38;
  color:#fff;
}
.ff-task-pop-est-actions{
  display:flex;
  gap:6px;
  justify-content:flex-end;
  align-items:center;
}
.ff-task-pop-apply{
  appearance:none;
  border:0;
  border-radius:8px;
  padding:8px 12px;
  font:inherit;
  font-size:12px;
  font-weight:700;
  background:#0f1b38;
  color:#fff;
  cursor:pointer;
}

.ff-group-files-board{
  margin:0 0 16px;
  padding:12px 14px 16px;
  border:1px solid #e2ebf2;
  border-radius:14px;
  background:#fff;
}
.ff-group-files-board-head{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:6px;
  font-size:15px;
  color:#0f1b38;
}
.ff-group-files-lead{
  margin:0 0 12px;
  font-size:13px;
  color:#6b7a8b;
  line-height:1.45;
}
.ff-group-files-empty{
  margin:12px 0 4px;
  font-size:13px;
  color:#6b7a8b;
}
.ff-group-files-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:8px;
}
.ff-group-file-row{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid #e8eef4;
  background:#fbfcfe;
}
.ff-group-file-kind{
  flex:0 0 auto;
  font-size:18px;
  line-height:1.2;
}
.ff-group-file-main{
  flex:1 1 160px;
  min-width:0;
}
.ff-group-file-name{
  display:block;
  font-size:14px;
  color:#0f1b38;
  word-break:break-word;
}
.ff-group-file-meta{
  display:block;
  margin-top:3px;
  font-size:12px;
  color:#6b7a8b;
  line-height:1.4;
}
.ff-group-file-open{
  flex:0 0 auto;
  align-self:center;
  font-size:12px;
  font-weight:700;
  color:#1f4d73;
  text-decoration:none;
  white-space:nowrap;
}
.ff-group-file-open:hover{text-decoration:underline;}
.ff-group-files-more{
  margin:10px 0 0;
  font-size:12px;
  color:#6b7a8b;
}
.ff-group-tasks-board{
  margin:0 0 16px;
  padding:12px 14px 16px;
  border:1px solid #e2ebf2;
  border-radius:14px;
  background:#fff;
}
.ff-group-tasks-board-head{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
  font-size:15px;
  color:#0f1b38;
}
.ff-group-tasks-filters{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-bottom:12px;
}
.ff-group-tasks-filter{
  appearance:none;
  border:1px solid #c5d8e6;
  background:#fff;
  color:#1f4d73;
  border-radius:999px;
  padding:7px 12px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  min-height:36px;
}
.ff-group-tasks-filter:hover{background:#eef6fb;border-color:#1f4d73;}
.ff-group-tasks-filter.is-active{
  background:#0f1b38;
  border-color:#0f1b38;
  color:#fff;
}
.ff-group-tasks-loading{
  margin:8px 0;
  font-size:13px;
  color:#64748b;
  font-weight:600;
}
.ff-group-tasks-empty{
  margin:12px 0 4px;
  font-size:13px;
  color:#6b7a8b;
}
.ff-group-tasks-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:8px;
}
.ff-group-task-row{
  display:flex;
  align-items:flex-start;
  gap:8px;
  flex-wrap:wrap;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid #e8eef4;
  background:#fbfcfe;
}
.ff-group-task-row.is-doing{border-color:#bfdbfe;background:#f8fbff;}
.ff-group-task-row.is-blocked{border-color:#fde68a;background:#fffdf5;}
.ff-group-task-row.is-done{opacity:.75;}
.ff-group-task-row.is-done .ff-task-title{text-decoration:line-through;color:#6b7a8b;}
.ff-group-task-main{
  flex:1 1 160px;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.ff-group-task-from{
  font-size:11.5px;
  color:#64748b;
  text-decoration:none;
  font-weight:600;
}
.ff-group-task-from:hover{color:#1f4d73;text-decoration:underline;}
.ff-group-task-error{
  padding:12px;
  color:#b91c1c;
  font-size:13px;
  font-weight:600;
  list-style:none;
}

@media (max-width:640px){
  /* Compact chips — tappable without bloating a 10-task list. */
  .ff-task-chip{
    min-height:28px;
    min-width:28px;
    padding:3px 7px;
    font-size:11.5px;
  }
  .ff-task-chip.ff-task-chip--completed{
    min-height:20px;
    min-width:0;
    padding:2px 6px;
    font-size:10px;
  }
  .ff-task-chip--status{width:28px;min-height:28px;font-size:13px;}
  .ff-task-chip-av{width:20px;height:20px;}
  .ff-task-chips{
    gap:5px;
    width:100%;
    justify-content:flex-start;
    margin-top:0;
    padding-inline-start:20px;
  }
  .ff-task-item:not(:has(.ff-task-drag)) .ff-task-chips{padding-inline-start:0;}
  .ff-group-tasks-filter{min-height:34px;padding:6px 10px;font-size:12.5px;}
  .ff-task-pop-btn{min-height:40px;padding:7px 9px;font-size:12.5px;}
  .ff-task-popover{
    max-width:min(300px, calc(100vw - 16px));
    border-radius:10px;
    padding:5px;
  }
  .ff-task-popover--sheet{
    padding:8px;
    border-radius:12px;
    max-height:min(70vh, 420px);
  }
  .ff-tasks-draft-item--edit{gap:6px;}
  .ff-tasks-edit-meta{gap:4px;}
}