/* ══════════════════════════════════════════════════════════════════════════════
   community-room.css — THE TWO COMMUNITY TRACKS, DRESSED.
   ────────────────────────────────────────────────────────────────────────────
   These rules stood inside index.html as two separate <style> blocks, one above
   each section, and they moved here unchanged when the sections moved to
   /community. Both were already written scoped and self-contained — the comment
   at the top of the first one said so, and it was true of the second — so the
   move is a cut, not a rewrite: every selector is #community-exchange, #open-forum,
   .cee-* or .fbd-*, and nothing in this file reaches outside those four names.

   WHY THE SHEET IS ITS OWN FILE AND NOT INLINE. /community is a document now,
   and a document that inlines 20 KB of CSS pays for it on every visit; a file
   is cached once and precached by sw.js with the rest of the room. It also
   means index.html cannot accidentally inherit these rules again: the front page
   does not link this sheet, so the day someone re-adds a .cee-* class there it
   will be visibly unstyled instead of quietly half-styled.

   WHAT IS NOT HERE. The bar, the account chip and the page's ground colour.
   The bar and chip are /shell-chrome.css, shared with /me, /mandate, /voice and
   /money so one row cannot become five rows. The ground colour and the chrome
   offset are declared in community.html's own small inline <style>, the same
   way every other inner shell declares them, because they are properties of the
   document rather than of the two rooms inside it.

   NO TAILWIND UTILITY IS ASSUMED. The original note is worth keeping: these
   sections never depended on a utility class that the build's purge might drop,
   which is exactly why they could be lifted whole.
   ════════════════════════════════════════════════════════════════════════════════ */

/* ══ TRACK ONE — THE COMMUNITY EVIDENCE EXCHANGE (the verified track) ══════ */
/* Scoped Community Exchange styles — self-contained so the section never
   depends on a Tailwind utility that may have been purged from the build. */
#community-exchange { padding: 4rem 1rem 5rem; position: relative; }
#community-exchange .cee-shell { max-width: 64rem; margin: 0 auto; }
.cee-head { text-align: center; margin-bottom: 1.75rem; }
.cee-badge {
  display: inline-flex; align-items: center; gap: 0.45rem;
  background: rgba(245,200,66,0.1); border: 1px solid rgba(245,200,66,0.4);
  color: #f5c842; font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.66rem; letter-spacing: 0.18em; text-transform: uppercase;
  padding: 0.35rem 0.85rem; border-radius: 999px; margin-bottom: 0.9rem;
}
.cee-title {
  font-family: 'Oswald','Barlow Condensed',sans-serif; font-weight: 700;
  font-size: clamp(1.9rem, 5vw, 3rem); letter-spacing: 0.02em; color: #eaf1fb;
  line-height: 1.05; margin-bottom: 0.6rem;
}
.cee-title .cee-accent { color: #60a5fa; }
.cee-sub { color: #9fb1cd; font-size: 0.95rem; max-width: 40rem; margin: 0 auto; line-height: 1.55; }
.cee-note {
  margin: 0.9rem auto 0; max-width: 42rem; font-size: 0.78rem; color: #7e93b4;
  background: rgba(96,165,250,0.07); border: 1px solid rgba(96,165,250,0.18);
  border-radius: 0.6rem; padding: 0.55rem 0.8rem; line-height: 1.5;
}

.cee-toolbar {
  display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center;
  justify-content: space-between; margin: 1.5rem 0 1.25rem;
}
.cee-tabs { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.cee-tab {
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
  color: #9fb1cd; font-family: 'Barlow Condensed',sans-serif; font-weight: 700;
  font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase;
  padding: 0.45rem 0.85rem; border-radius: 0.55rem; cursor: pointer; transition: all .15s;
}
.cee-tab:hover { color: #fff; border-color: rgba(255,255,255,0.22); }
.cee-tab.active { color: #0b1220; background: #f5c842; border-color: #f5c842; }
.cee-controls { display: flex; gap: 0.6rem; align-items: center; flex-wrap: wrap; }
.cee-select, .cee-input, .cee-textarea {
  background: rgba(7,11,22,0.85); color: #e7eefb; border: 1px solid rgba(255,255,255,0.13);
  border-radius: 0.55rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; font-family: inherit;
  transition: border-color .15s, box-shadow .15s; width: 100%;
}
.cee-select:focus, .cee-input:focus, .cee-textarea:focus {
  outline: none; border-color: rgba(96,165,250,0.6); box-shadow: 0 0 0 3px rgba(96,165,250,0.15);
}
.cee-textarea { resize: vertical; min-height: 4.5rem; line-height: 1.5; }

.cee-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
  font-family: 'Barlow Condensed',sans-serif; font-weight: 700; font-size: 0.74rem;
  letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer;
  border-radius: 0.55rem; padding: 0.55rem 0.95rem; transition: all .15s; border: 1px solid transparent;
}
.cee-btn-primary { background: linear-gradient(135deg,#3b82f6,#60a5fa); color: #fff; box-shadow: 0 4px 14px rgba(59,130,246,0.3); }
.cee-btn-primary:hover { filter: brightness(1.08); transform: translateY(-1px); }
.cee-btn-gold { background: #f5c842; color: #0b1220; }
.cee-btn-gold:hover { filter: brightness(1.06); }
.cee-btn-ghost { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.13); color: #c3d2ea; }
.cee-btn-ghost:hover { color: #fff; border-color: rgba(255,255,255,0.25); }

.cee-card {
  background: rgba(13,21,38,0.72); border: 1px solid rgba(255,255,255,0.08);
  border-radius: 0.95rem; padding: 1.1rem 1.15rem; margin-bottom: 1rem;
  backdrop-filter: blur(8px); transition: border-color .15s, transform .15s;
}
.cee-card:hover { border-color: rgba(96,165,250,0.35); }
.cee-card-top { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.55rem; }
.cee-pill {
  font-family: 'Barlow Condensed',sans-serif; font-weight: 700; font-size: 0.6rem;
  letter-spacing: 0.14em; text-transform: uppercase; padding: 0.22rem 0.55rem;
  border-radius: 999px; white-space: nowrap;
}
.cee-pill-community { background: rgba(245,200,66,0.13); color: #f5c842; border: 1px solid rgba(245,200,66,0.35); }
.cee-pill-cat { background: rgba(96,165,250,0.13); color: #93c5fd; border: 1px solid rgba(96,165,250,0.3); }
.cee-pill-mom { background: rgba(251,146,60,0.13); color: #fdba74; border: 1px solid rgba(251,146,60,0.3); margin-left: auto; }
.cee-pill-imported { background: rgba(74,222,128,0.13); color: #86efac; border: 1px solid rgba(74,222,128,0.3); }
.cee-pill-removed { background: rgba(248,113,113,0.13); color: #fca5a5; border: 1px solid rgba(248,113,113,0.3); }
.cee-card-headline {
  font-family: 'Oswald','Barlow Condensed',sans-serif; font-weight: 600; font-size: 1.2rem;
  color: #eaf1fb; line-height: 1.25; cursor: pointer; margin-bottom: 0.3rem;
}
.cee-card-headline:hover { color: #93c5fd; }
.cee-meta { font-size: 0.72rem; color: #7e93b4; margin-bottom: 0.55rem; display: flex; gap: 0.65rem; flex-wrap: wrap; align-items: center; }
.cee-summary { color: #c3d2ea; font-size: 0.9rem; line-height: 1.55; margin-bottom: 0.6rem; white-space: pre-wrap; }
.cee-issue-chips { display: flex; gap: 0.35rem; flex-wrap: wrap; margin-bottom: 0.6rem; }
.cee-chip {
  font-size: 0.66rem; color: #9fb1cd; background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1); border-radius: 999px; padding: 0.18rem 0.55rem;
}
.cee-source { font-size: 0.78rem; color: #60a5fa; text-decoration: none; word-break: break-all; }
.cee-source:hover { text-decoration: underline; }

.cee-reactions { display: flex; gap: 0.4rem; flex-wrap: wrap; align-items: center; margin-top: 0.7rem; padding-top: 0.7rem; border-top: 1px solid rgba(255,255,255,0.06); }
.cee-react-btn {
  display: inline-flex; align-items: center; gap: 0.35rem; cursor: pointer;
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
  border-radius: 999px; padding: 0.3rem 0.65rem; font-size: 0.74rem; color: #c3d2ea;
  transition: all .12s; font-family: 'Barlow Condensed',sans-serif; font-weight: 600; letter-spacing: 0.02em;
}
.cee-react-btn:hover { border-color: rgba(255,255,255,0.28); color: #fff; }
.cee-react-btn.active { background: rgba(96,165,250,0.16); border-color: rgba(96,165,250,0.5); color: #dbeafe; }
.cee-react-btn .cee-rc { font-variant-numeric: tabular-nums; opacity: 0.85; }
.cee-react-lowvis { font-size: 0.68rem; color: #6b7d99; background: none; border: none; cursor: pointer; padding: 0.3rem 0.4rem; }
.cee-react-lowvis:hover { color: #fca5a5; text-decoration: underline; }
.cee-react-lowvis.active { color: #fca5a5; }

.cee-card-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-top: 0.7rem; }
.cee-link-btn { background: none; border: none; color: #7e93b4; cursor: pointer; font-size: 0.74rem; font-family: 'Barlow Condensed',sans-serif; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 0.25rem 0.3rem; }
.cee-link-btn:hover { color: #93c5fd; }
.cee-link-btn.cee-flag:hover { color: #fca5a5; }
.cee-link-btn.cee-suggest:hover { color: #f5c842; }
.cee-link-btn.done { color: #4ade80; }

/* "Suggest for Review" call-to-action. Gold-tinted to echo the Evidence
   Locker's accent (the direction the suggestion travels), prominent enough
   to be found at a glance but quiet enough not to compete with Discuss.
   The .done state flips to a calm green "Suggested ✓" once the viewer has
   nominated the post. */
.cee-suggest-cta {
  display: inline-flex; align-items: center; gap: 0.4rem; cursor: pointer;
  background: rgba(245,200,66,0.12); border: 1px solid rgba(245,200,66,0.4);
  color: #f5c842; border-radius: 999px; padding: 0.32rem 0.75rem;
  font-family: 'Barlow Condensed',sans-serif; font-weight: 700; font-size: 0.74rem;
  letter-spacing: 0.06em; text-transform: uppercase; transition: all .14s;
}
.cee-suggest-cta:hover { background: rgba(245,200,66,0.2); border-color: rgba(245,200,66,0.65); color: #ffe08a; }
.cee-suggest-cta.done { background: rgba(74,222,128,0.13); border-color: rgba(74,222,128,0.42); color: #86efac; cursor: default; }
.cee-suggest-cta.done:hover { background: rgba(74,222,128,0.13); border-color: rgba(74,222,128,0.42); color: #86efac; }
.cee-suggest-n {
  font-variant-numeric: tabular-nums; background: rgba(255,255,255,0.14);
  border-radius: 999px; padding: 0.02rem 0.4rem; font-size: 0.9em; line-height: 1.3;
}
/* Helper / feedback line under the suggest action in the detail view. */
.cee-suggest-hint { font-size: 0.76rem; color: #8aa0c0; margin: 0.45rem 0 0; line-height: 1.45; }
.cee-suggest-hint.ok { color: #86efac; }
.cee-suggest-hint.err { color: #fca5a5; }

/* Subtle, optional bridge from a community post to the curated Evidence
   Locker. Hidden until the post's issue is confirmed to actually hold
   evidence (see enhanceLockerLinks) — the mirror of the Locker's own
   gold-tinted "See community discussion" link. Blue-tinted to echo the
   Evidence Locker's accent, so the direction of travel reads at a glance.
   Never embeds Locker content; it only deep-links across. */
.cee-locker-link {
  display: inline-flex; align-items: center; gap: 0.32rem;
  background: rgba(96,165,250,0.12); border: 1px solid rgba(96,165,250,0.34);
  color: #aacbff; cursor: pointer; font-family: 'Barlow Condensed',sans-serif;
  font-size: 0.74rem; font-weight: 700; letter-spacing: 0.04em; line-height: 1.2;
  border-radius: 999px; padding: 0.34rem 0.74rem; margin-top: 0.6rem;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.cee-locker-link:hover { background: rgba(96,165,250,0.2); border-color: rgba(96,165,250,0.55); color: #cfe1ff; }
.cee-locker-link[hidden] { display: none !important; }
/* Full-width, slightly larger variant for the detail modal's connected-actions area. */
.cee-locker-link-modal { width: 100%; justify-content: center; margin-top: 0.9rem; padding: 0.55rem 0.7rem; font-size: 0.8rem; }
/* Evidence-volume hint — a small blue pill mirroring the Locker's gold
   discussion-count badge, so "how much evidence is waiting" reads at a glance
   without competing with the link. Only ever shown when real evidence exists
   (see enhanceLockerLinks), so the Exchange stays uncluttered. */
.cee-locker-count {
  display: inline-flex; align-items: center; line-height: 1;
  font-weight: 700; font-size: 0.62rem; letter-spacing: 0.02em;
  color: #d7e6ff; background: rgba(96,165,250,0.2);
  border: 1px solid rgba(96,165,250,0.46); border-radius: 999px;
  padding: 0.14rem 0.44rem; margin-left: 0.1rem;
}
.cee-locker-link:hover .cee-locker-count { background: rgba(96,165,250,0.3); border-color: rgba(96,165,250,0.62); }
.cee-locker-link-modal .cee-locker-count { font-size: 0.66rem; padding: 0.16rem 0.48rem; }
.cee-locker-count[hidden] { display: none !important; }

/* Contextual header shown only when the Exchange is filtered to a single
   issue — e.g. arriving via a gold activity pill from the Evidence Locker.
   Muted/translucent in the same gold accent language as the pills (this is
   the community side of the bridge) and carries the blue Evidence-return
   link that closes the round-trip back to the curated Digital Library.
   Quiet by design: a lightweight cue, not a heavy banner. */
.cee-issue-banner {
  display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap;
  background: rgba(245,200,66,0.08); border: 1px solid rgba(245,200,66,0.28);
  border-radius: 0.7rem; padding: 0.5rem 0.85rem; margin-bottom: 0.9rem;
  font-size: 0.82rem; color: #e8d9b0;
}
.cee-issue-banner-label strong { color: #f5e3b3; font-weight: 700; }
/* The blue return pill is the standard Evidence-blue treatment; just drop the
   block link's top margin so it sits inline within the banner row. */
.cee-issue-banner .cee-issue-banner-link { margin-top: 0; }
.cee-issue-banner-clear {
  margin-left: auto; background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.18); color: #dbe7fb;
  border-radius: 0.5rem; padding: 0.25rem 0.65rem; font-size: 0.72rem;
  cursor: pointer; font-family: inherit;
}
.cee-issue-banner-clear:hover { background: rgba(255,255,255,0.14); color: #fff; }

/* Compose + detail overlay */
.cee-overlay {
  position: fixed; inset: 0; z-index: 120; background: rgba(4,8,17,0.78);
  backdrop-filter: blur(6px); display: none; align-items: flex-start; justify-content: center;
  padding: 4.5rem 1rem 2rem; overflow-y: auto;
}
.cee-overlay.open { display: flex; }
.cee-modal {
  background: #0d1526; border: 1px solid rgba(255,255,255,0.1); border-radius: 1rem;
  max-width: 42rem; width: 100%; padding: 1.5rem; box-shadow: 0 24px 64px rgba(0,0,0,0.5);
}
.cee-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.cee-modal-title { font-family: 'Oswald','Barlow Condensed',sans-serif; font-weight: 600; font-size: 1.4rem; color: #eaf1fb; line-height: 1.2; }
.cee-close { background: none; border: none; color: #7e93b4; font-size: 1.5rem; cursor: pointer; line-height: 1; }
.cee-close:hover { color: #fff; }
.cee-field { margin-bottom: 0.9rem; }
.cee-field label { display: block; font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase; color: #7e93b4; font-weight: 700; margin-bottom: 0.35rem; }
.cee-tag-grid { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.cee-tag {
  font-size: 0.72rem; color: #9fb1cd; background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.12); border-radius: 999px; padding: 0.3rem 0.6rem; cursor: pointer; transition: all .12s;
}
.cee-tag.on { background: rgba(96,165,250,0.18); border-color: rgba(96,165,250,0.5); color: #dbeafe; }
.cee-form-msg { font-size: 0.8rem; margin-top: 0.5rem; min-height: 1rem; }
.cee-form-msg.err { color: #fca5a5; }
.cee-form-msg.ok { color: #86efac; }

/* Comments */
.cee-comments { margin-top: 1.25rem; border-top: 1px solid rgba(255,255,255,0.08); padding-top: 1rem; }
.cee-comment { padding: 0.6rem 0; }
.cee-comment-meta { font-size: 0.72rem; color: #7e93b4; margin-bottom: 0.2rem; }
.cee-comment-meta b { color: #c3d2ea; font-weight: 700; }
.cee-comment-body { color: #d4deef; font-size: 0.88rem; line-height: 1.5; white-space: pre-wrap; }
.cee-comment-reply { background: none; border: none; color: #7e93b4; cursor: pointer; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; padding: 0.2rem 0; }
.cee-comment-reply:hover { color: #93c5fd; }
.cee-thread { margin-left: 1.1rem; border-left: 2px solid rgba(96,165,250,0.18); padding-left: 0.9rem; }

.cee-empty { text-align: center; color: #7e93b4; padding: 2.5rem 1rem; font-size: 0.95rem; }
.cee-skel { height: 7rem; border-radius: 0.95rem; margin-bottom: 1rem; background: linear-gradient(90deg, rgba(255,255,255,0.04), rgba(255,255,255,0.08), rgba(255,255,255,0.04)); background-size: 200% 100%; animation: ceeShimmer 1.4s infinite; }
@keyframes ceeShimmer { 0%{background-position:200% 0;} 100%{background-position:-200% 0;} }

/* Moderation panel */
.cee-mod {
  margin-top: 2rem; background: rgba(40,16,16,0.4); border: 1px solid rgba(248,113,113,0.3);
  border-radius: 1rem; padding: 1.25rem;
}
.cee-mod-head { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.9rem; }
.cee-mod-tag { font-family: 'Barlow Condensed',sans-serif; font-weight: 700; font-size: 0.7rem; letter-spacing: 0.16em; text-transform: uppercase; color: #fca5a5; }
.cee-mod-item { background: rgba(7,11,22,0.6); border: 1px solid rgba(255,255,255,0.08); border-radius: 0.7rem; padding: 0.85rem; margin-bottom: 0.75rem; }
.cee-mod-reasons { font-size: 0.76rem; color: #fdba74; margin: 0.4rem 0; }
.cee-mod-actions { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-top: 0.5rem; }
.cee-ai-box { margin-top: 0.5rem; font-size: 0.8rem; color: #c4b5fd; background: rgba(139,92,246,0.1); border: 1px solid rgba(139,92,246,0.3); border-radius: 0.5rem; padding: 0.5rem 0.65rem; line-height: 1.5; display: none; }

/* ── Contribution pipeline additions ─────────────────────────────────── */
/* Compose: pick what the contribution IS — a lead or a piece of evidence. */
.cee-kind-toggle { display: flex; gap: 0.5rem; }
.cee-kind-opt {
  flex: 1; cursor: pointer; border: 1px solid rgba(255,255,255,0.13); border-radius: 0.6rem;
  padding: 0.6rem 0.7rem; background: rgba(7,11,22,0.85); transition: all .14s;
}
.cee-kind-opt:hover { border-color: rgba(96,165,250,0.4); }
.cee-kind-opt.on { border-color: rgba(96,165,250,0.6); background: rgba(96,165,250,0.12); box-shadow: 0 0 0 3px rgba(96,165,250,0.12); }
.cee-kind-opt .cee-kind-name { display: block; font-family: 'Barlow Condensed',sans-serif; font-weight: 700; font-size: 0.92rem; letter-spacing: 0.04em; color: #eaf1fb; }
.cee-kind-opt .cee-kind-desc { display: block; font-size: 0.72rem; color: #8aa0c0; line-height: 1.4; margin-top: 0.15rem; }
.cee-req { color: #fca5a5; }
.cee-hint { font-size: 0.72rem; color: #7e93b4; margin-top: 0.3rem; line-height: 1.45; }

/* "Evidence" vs "Lead" pill shown on cards + queue items. */
.cee-pill-kind-evidence { background: rgba(96,165,250,0.14); color: #93c5fd; border: 1px solid rgba(96,165,250,0.34); }
.cee-pill-kind-lead { background: rgba(148,163,184,0.14); color: #cbd5e1; border: 1px solid rgba(148,163,184,0.3); }

/* ── Coverage-gap context (Suggest-a-Lead) ──────────────────────────────
   A lead's source state and the gap it answers. Neither is a verification
   badge: "has source" only means the submitter attached a link for a curator
   to check. Kept visually quieter than the imported/locker pills so a lead
   can never be mistaken for curated evidence. */
.cee-pill-lead-sourced { background: rgba(74,222,128,0.1); color: #86efac; border: 1px solid rgba(74,222,128,0.3); }
.cee-pill-lead-needs { background: rgba(148,163,184,0.1); color: #9fb1cd; border: 1px dashed rgba(148,163,184,0.35); }
/* The moderator-set review states. Blue-grey rather than green: "answered"
   means a curator looked, and must not read as a verdict or a strength grade.
   Dashed borders throughout keep every lead state quieter than the solid
   imported/locker pills. */
.cee-pill-lead-checking { background: rgba(96,165,250,0.1); color: #93c5fd; border: 1px dashed rgba(96,165,250,0.4); }
.cee-pill-lead-answered { background: rgba(148,163,184,0.12); color: #cbd5e1; border: 1px dashed rgba(203,213,225,0.4); }
.cee-pill-lead-dead { background: rgba(148,163,184,0.06); color: #8496b0; border: 1px dashed rgba(132,150,176,0.3); }
.cee-pill-gap { background: rgba(245,200,66,0.08); color: #d9a44a; border: 1px dashed rgba(217,164,74,0.4); }

/* The locked context block at the top of a gap-scoped compose. Read-only by
   design — the submitter chooses the claim, never which record it lands on. */
.cee-gap-lock {
  border: 1px dashed rgba(217,164,74,0.4); background: rgba(60,44,16,0.22);
  border-radius: 0.6rem; padding: 0.6rem 0.7rem; margin-bottom: 1rem;
}
.cee-gap-lock-h {
  font-family: 'Barlow Condensed',sans-serif; font-weight: 700; font-size: 0.68rem;
  letter-spacing: 0.08em; text-transform: uppercase; color: #d9a44a; margin-bottom: 0.4rem;
}
.cee-gap-chips { display: flex; gap: 0.3rem; flex-wrap: wrap; }
.cee-chip-lock { border-style: dashed; color: #e6d7bb; }
.cee-gap-lock-detail, .cee-gap-lock-ask {
  margin: 0.45rem 0 0; font-size: 0.78rem; line-height: 1.5; color: #b9c6dc;
}
.cee-gap-lock-ask strong { color: #e8c07d; }
.cee-issue-banner-gap { border-color: rgba(217,164,74,0.35); }

/* Stored AI triage, shown automatically in the moderation queue. */
.cee-ai-triage { margin-top: 0.55rem; font-size: 0.78rem; border-radius: 0.5rem; padding: 0.5rem 0.65rem; line-height: 1.5; background: rgba(139,92,246,0.1); border: 1px solid rgba(139,92,246,0.3); color: #c4b5fd; }
.cee-ai-triage .cee-ai-rec { font-weight: 700; letter-spacing: 0.04em; }
.cee-ai-rec.keep { color: #86efac; }
.cee-ai-rec.review { color: #fcd34d; }
.cee-ai-rec.remove { color: #fca5a5; }
.cee-ai-dupe { margin-top: 0.35rem; color: #fca5a5; }
.cee-ai-note { font-size: 0.68rem; color: #8aa0c0; margin-top: 0.3rem; font-style: italic; }
.cee-ai-pending { color: #8aa0c0; font-style: italic; }

/* Inline "Promote to Locker" panel — where the moderator sets the verified
   strength grade and a note before graduating a contribution with credit. */
.cee-promote { margin-top: 0.6rem; border: 1px solid rgba(74,222,128,0.35); background: rgba(16,40,24,0.5); border-radius: 0.6rem; padding: 0.75rem; display: none; }
.cee-promote.open { display: block; }
.cee-promote label { display: block; font-size: 0.62rem; letter-spacing: 0.12em; text-transform: uppercase; color: #8aa0c0; font-weight: 700; margin-bottom: 0.3rem; }
.cee-promote-row { display: flex; gap: 0.6rem; flex-wrap: wrap; align-items: flex-end; }
.cee-promote-row .cee-field { flex: 1; min-width: 8rem; margin-bottom: 0; }

/* ── Gap context + lead lifecycle in the moderation queue ──────────────────
   The queue's job for a gap lead is different from its job for evidence: not
   "is this good enough to publish" but "who is this about and what question
   does it answer". This strip is that context, and the state row below it is
   research bookkeeping only — slate/blue throughout, never the gold of the
   Locker or the green of a verdict, so a research note can never be misread
   as a graded receipt. */
.cee-mod-gap { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; margin: 0 0 0.4rem;
  padding: 0.4rem 0.5rem; border-left: 2px dashed rgba(217,164,74,0.45);
  background: rgba(245,200,66,0.05); border-radius: 0 0.4rem 0.4rem 0; }
.cee-mod-gap-none { border-left-color: rgba(148,163,184,0.35); background: rgba(148,163,184,0.05);
  font-size: 0.74rem; color: #8fa2bf; }
.cee-mod-gap-pol { font-size: 0.76rem; font-weight: 700; color: #cbd5e1; text-decoration: none;
  border-bottom: 1px dotted rgba(203,213,225,0.5); }
.cee-mod-gap-pol:hover { color: #eaf1fb; }
.cee-mod-gap-key { flex: 1 0 100%; font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.64rem; color: #7e93b4; word-break: break-all; }
.cee-lead-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem; margin: 0.5rem 0 0;
  padding-top: 0.5rem; border-top: 1px dashed rgba(148,163,184,0.2); }
.cee-lead-actions-k { font-size: 0.62rem; letter-spacing: 0.12em; text-transform: uppercase;
  color: #7e93b4; font-weight: 700; margin-right: 0.15rem; }
.cee-lead-actions-note { flex: 1 0 100%; font-size: 0.68rem; color: #7e93b4; font-style: italic; }
.cee-lead-state.on { border-color: rgba(96,165,250,0.55); color: #bfdbfe; background: rgba(96,165,250,0.14); }
.cee-mod-dup { font-size: 0.74rem; color: #9fb1cd; margin-top: 0.4rem; }
.cee-dup-panel { border-color: rgba(148,163,184,0.35); background: rgba(14,20,34,0.6); }
.cee-dup-msg { font-size: 0.72rem; color: #fca5a5; margin: 0.4rem 0 0; min-height: 1em; }

/* Graduated credit wall — the public, transparent end of the pipeline. */
.cee-grad { margin-top: 2.5rem; }
.cee-grad-head { display: flex; align-items: baseline; gap: 0.6rem; flex-wrap: wrap; margin-bottom: 0.9rem; }
.cee-grad-title { font-family: 'Oswald','Barlow Condensed',sans-serif; font-weight: 600; font-size: 1.3rem; color: #eaf1fb; }
.cee-grad-sub { font-size: 0.8rem; color: #8aa0c0; }
.cee-grad-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: 0.85rem; }
.cee-grad-card { background: rgba(13,28,20,0.6); border: 1px solid rgba(74,222,128,0.24); border-radius: 0.8rem; padding: 0.9rem 1rem; }
.cee-grad-card-top { display: flex; align-items: center; gap: 0.45rem; flex-wrap: wrap; }
.cee-grad-hl { font-family: 'Oswald','Barlow Condensed',sans-serif; font-weight: 600; font-size: 1rem; color: #eaf1fb; line-height: 1.3; margin: 0.45rem 0 0.3rem; }
.cee-grad-credit { font-size: 0.78rem; color: #86efac; }
.cee-grad-credit b { color: #bbf7d0; }
.cee-grad-src { font-size: 0.74rem; color: #60a5fa; text-decoration: none; word-break: break-all; }
.cee-grad-src:hover { text-decoration: underline; }
.cee-strength { font-size: 0.58rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; padding: 0.18rem 0.5rem; border-radius: 999px; white-space: nowrap; }
.cee-strength-strong { background: rgba(74,222,128,0.16); color: #86efac; border: 1px solid rgba(74,222,128,0.4); }
.cee-strength-moderate { background: rgba(245,200,66,0.14); color: #f5c842; border: 1px solid rgba(245,200,66,0.36); }
.cee-strength-limited { background: rgba(148,163,184,0.14); color: #cbd5e1; border: 1px solid rgba(148,163,184,0.3); }

/* Mobile: stack the toolbar, form toggle and credit wall into one column. */
@media (max-width: 640px) {
  #community-exchange { padding: 2.5rem 0.75rem 3.5rem; }
  .cee-toolbar { flex-direction: column; align-items: stretch; }
  .cee-controls { flex-direction: column; align-items: stretch; }
  .cee-controls .cee-select, .cee-controls .cee-btn { width: 100%; }
  .cee-kind-toggle { flex-direction: column; }
  .cee-modal { padding: 1.15rem; }
  .cee-grad-grid { grid-template-columns: 1fr; }
  .cee-promote-row { flex-direction: column; align-items: stretch; }
}

/* ══ TRACK TWO — THE OPEN DISCUSSION BOARD (the open track) ════════════════
   The OPEN track of the two-track community system. Where the Exchange above is
   the VERIFIED pipeline (triage → moderate → graduate to the curated Locker with
   attribution), this board is for free, low-friction conversation: post anything,
   up/down vote, and reply. It is backed by its own Netlify Function + tables
   (/api/forum, pdx_forum_*) and shares NOTHING with the verified layer — there is
   no promotion path from here into the Evidence Locker. Moderation is reactive
   (spam/hate) only. That banner stood above this block in index.html and it is
   reproduced here because it explains the colour split the rules below encode:
   the Exchange is gold, the board is teal, and the two are never the same green. */
#open-forum { padding: 4rem 1rem 5rem; position: relative; background: linear-gradient(180deg,rgba(8,20,20,0.35) 0%,rgba(6,14,16,0.15) 100%); }
#open-forum .fbd-shell { max-width: 64rem; margin: 0 auto; }
.fbd-head { text-align: center; margin-bottom: 1.5rem; }
.fbd-badge {
  display: inline-flex; align-items: center; gap: 0.45rem;
  background: rgba(45,212,191,0.1); border: 1px solid rgba(45,212,191,0.4);
  color: #5eead4; font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 0.66rem; letter-spacing: 0.18em; text-transform: uppercase;
  padding: 0.35rem 0.85rem; border-radius: 999px; margin-bottom: 0.9rem;
}
.fbd-title {
  font-family: 'Oswald','Barlow Condensed',sans-serif; font-weight: 700;
  font-size: clamp(1.9rem, 5vw, 3rem); letter-spacing: 0.02em; color: #eafbf6;
  line-height: 1.05; margin-bottom: 0.6rem;
}
.fbd-title .fbd-accent { color: #2dd4bf; }
.fbd-sub { color: #9fc3bd; font-size: 0.95rem; max-width: 40rem; margin: 0 auto; line-height: 1.55; }
/* The two-track notice + the civility floor — the promise and the rules. */
.fbd-tracks {
  display: flex; gap: 0.75rem; flex-wrap: wrap; justify-content: center;
  max-width: 46rem; margin: 1rem auto 0;
}
.fbd-track-note {
  flex: 1; min-width: 15rem; text-align: left; font-size: 0.78rem; line-height: 1.5;
  border-radius: 0.6rem; padding: 0.6rem 0.8rem;
}
.fbd-track-open { background: rgba(45,212,191,0.08); border: 1px solid rgba(45,212,191,0.25); color: #9fd8cf; }
.fbd-track-verified { background: rgba(245,200,66,0.07); border: 1px solid rgba(245,200,66,0.22); color: #d9c78e; }
.fbd-track-note strong { color: #eafbf6; }
.fbd-track-note a { color: #f5c842; font-weight: 700; text-decoration: underline; }
.fbd-rules {
  max-width: 46rem; margin: 0.75rem auto 0; font-size: 0.74rem; color: #7fa39c;
  background: rgba(255,255,255,0.03); border: 1px dashed rgba(45,212,191,0.25);
  border-radius: 0.6rem; padding: 0.5rem 0.8rem; line-height: 1.5;
}

.fbd-toolbar { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; justify-content: space-between; margin: 1.5rem 0 1.25rem; }
.fbd-tabs { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.fbd-tab {
  background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.1);
  color: #9fc3bd; font-family: 'Barlow Condensed',sans-serif; font-weight: 700;
  font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase;
  padding: 0.45rem 0.85rem; border-radius: 0.55rem; cursor: pointer; transition: all .15s;
}
.fbd-tab:hover { color: #fff; border-color: rgba(255,255,255,0.22); }
.fbd-tab.active { color: #06201c; background: #2dd4bf; border-color: #2dd4bf; }
.fbd-controls { display: flex; gap: 0.6rem; align-items: center; flex-wrap: wrap; }
.fbd-select, .fbd-input, .fbd-textarea {
  background: rgba(6,14,16,0.85); color: #e7f6f2; border: 1px solid rgba(255,255,255,0.13);
  border-radius: 0.55rem; padding: 0.5rem 0.7rem; font-size: 0.85rem; font-family: inherit;
  transition: border-color .15s, box-shadow .15s; width: 100%;
}
.fbd-select:focus, .fbd-input:focus, .fbd-textarea:focus { outline: none; border-color: rgba(45,212,191,0.6); box-shadow: 0 0 0 3px rgba(45,212,191,0.15); }
.fbd-textarea { resize: vertical; min-height: 5rem; line-height: 1.5; }
.fbd-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
  font-family: 'Barlow Condensed',sans-serif; font-weight: 700; font-size: 0.74rem;
  letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer;
  border-radius: 0.55rem; padding: 0.55rem 0.95rem; transition: all .15s; border: 1px solid transparent;
}
.fbd-btn-primary { background: linear-gradient(135deg,#14b8a6,#2dd4bf); color: #052420; box-shadow: 0 4px 14px rgba(20,184,166,0.3); }
.fbd-btn-primary:hover { filter: brightness(1.08); transform: translateY(-1px); }
.fbd-btn-ghost { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.13); color: #bfe0da; }
.fbd-btn-ghost:hover { color: #fff; border-color: rgba(255,255,255,0.25); }

/* Thread card: a vote rail on the left, content on the right. */
.fbd-card { display: flex; gap: 0.85rem; background: rgba(10,24,24,0.7); border: 1px solid rgba(255,255,255,0.08); border-radius: 0.95rem; padding: 1rem 1.1rem; margin-bottom: 0.85rem; transition: border-color .15s; }
.fbd-card:hover { border-color: rgba(45,212,191,0.35); }
.fbd-card-main { flex: 1; min-width: 0; }
.fbd-vote { display: flex; flex-direction: column; align-items: center; gap: 0.1rem; flex-shrink: 0; }
.fbd-arrow {
  background: none; border: none; cursor: pointer; color: #6f938c; font-size: 1.05rem;
  line-height: 1; padding: 0.15rem 0.25rem; border-radius: 0.35rem; transition: color .12s, background .12s;
}
.fbd-arrow:hover { background: rgba(255,255,255,0.06); color: #cfeee8; }
.fbd-arrow.up.active { color: #2dd4bf; }
.fbd-arrow.down.active { color: #f87171; }
.fbd-score { font-variant-numeric: tabular-nums; font-weight: 700; font-size: 0.9rem; color: #cfeee8; }
.fbd-card-top { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.35rem; }
.fbd-pill { font-family: 'Barlow Condensed',sans-serif; font-weight: 700; font-size: 0.6rem; letter-spacing: 0.14em; text-transform: uppercase; padding: 0.22rem 0.55rem; border-radius: 999px; white-space: nowrap; }
.fbd-pill-topic { background: rgba(45,212,191,0.13); color: #5eead4; border: 1px solid rgba(45,212,191,0.32); }
.fbd-pill-removed { background: rgba(248,113,113,0.13); color: #fca5a5; border: 1px solid rgba(248,113,113,0.3); }
.fbd-ref {
  display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.66rem; color: #93c5fd;
  background: rgba(96,165,250,0.12); border: 1px solid rgba(96,165,250,0.3); border-radius: 999px;
  padding: 0.18rem 0.55rem; text-decoration: none; max-width: 100%;
}
.fbd-ref:hover { border-color: rgba(96,165,250,0.55); color: #cfe1ff; }
.fbd-card-title { font-family: 'Oswald','Barlow Condensed',sans-serif; font-weight: 600; font-size: 1.15rem; color: #eafbf6; line-height: 1.25; cursor: pointer; margin-bottom: 0.25rem; }
.fbd-card-title:hover { color: #5eead4; }
.fbd-meta { font-size: 0.72rem; color: #7fa39c; margin-bottom: 0.45rem; display: flex; gap: 0.6rem; flex-wrap: wrap; align-items: center; }
.fbd-body { color: #c3ded8; font-size: 0.9rem; line-height: 1.55; margin-bottom: 0.5rem; white-space: pre-wrap; word-break: break-word; }
.fbd-actions { display: flex; gap: 0.6rem; flex-wrap: wrap; margin-top: 0.4rem; }
.fbd-link-btn { background: none; border: none; color: #7fa39c; cursor: pointer; font-size: 0.74rem; font-family: 'Barlow Condensed',sans-serif; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 0.25rem 0.3rem; }
.fbd-link-btn:hover { color: #5eead4; }
.fbd-link-btn.fbd-flag:hover { color: #fca5a5; }
.fbd-link-btn.done { color: #4ade80; }

/* Overlay + modal (own classes so it never collides with the Exchange modal). */
.fbd-overlay { position: fixed; inset: 0; z-index: 120; background: rgba(3,10,10,0.8); backdrop-filter: blur(6px); display: none; align-items: flex-start; justify-content: center; padding: 4.5rem 1rem 2rem; overflow-y: auto; }
.fbd-overlay.open { display: flex; }
.fbd-modal { background: #071616; border: 1px solid rgba(255,255,255,0.1); border-radius: 1rem; max-width: 42rem; width: 100%; padding: 1.5rem; box-shadow: 0 24px 64px rgba(0,0,0,0.5); }
.fbd-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.fbd-modal-title { font-family: 'Oswald','Barlow Condensed',sans-serif; font-weight: 600; font-size: 1.4rem; color: #eafbf6; line-height: 1.2; }
.fbd-close { background: none; border: none; color: #7fa39c; font-size: 1.5rem; cursor: pointer; line-height: 1; }
.fbd-close:hover { color: #fff; }
.fbd-field { margin-bottom: 0.9rem; }
.fbd-field label { display: block; font-size: 0.66rem; letter-spacing: 0.14em; text-transform: uppercase; color: #7fa39c; font-weight: 700; margin-bottom: 0.35rem; }
.fbd-hint { font-size: 0.72rem; color: #6f938c; margin-top: 0.3rem; line-height: 1.45; }
.fbd-form-msg { font-size: 0.8rem; margin-top: 0.5rem; min-height: 1rem; }
.fbd-form-msg.err { color: #fca5a5; }
.fbd-form-msg.ok { color: #86efac; }
.fbd-row { display: flex; gap: 0.6rem; flex-wrap: wrap; }
.fbd-row .fbd-field { flex: 1; min-width: 8rem; }

/* Replies */
.fbd-replies { margin-top: 1.25rem; border-top: 1px solid rgba(255,255,255,0.08); padding-top: 1rem; }
.fbd-reply { display: flex; gap: 0.6rem; padding: 0.55rem 0; }
.fbd-reply-main { flex: 1; min-width: 0; }
.fbd-reply-meta { font-size: 0.72rem; color: #7fa39c; margin-bottom: 0.2rem; }
.fbd-reply-meta b { color: #c3ded8; font-weight: 700; }
.fbd-reply-body { color: #d4efe9; font-size: 0.88rem; line-height: 1.5; white-space: pre-wrap; word-break: break-word; }
.fbd-reply-actions { display: flex; gap: 0.7rem; margin-top: 0.15rem; }
.fbd-reply-btn { background: none; border: none; color: #7fa39c; cursor: pointer; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; padding: 0.2rem 0; }
.fbd-reply-btn:hover { color: #5eead4; }
.fbd-reply-btn.fbd-flag:hover { color: #fca5a5; }
.fbd-thread-nest { margin-left: 0.9rem; border-left: 2px solid rgba(45,212,191,0.18); padding-left: 0.8rem; }
.fbd-vote-sm .fbd-arrow { font-size: 0.85rem; }
.fbd-vote-sm .fbd-score { font-size: 0.78rem; }

.fbd-empty { text-align: center; color: #7fa39c; padding: 2.5rem 1rem; font-size: 0.95rem; }
.fbd-skel { height: 5.5rem; border-radius: 0.95rem; margin-bottom: 0.85rem; background: linear-gradient(90deg, rgba(255,255,255,0.04), rgba(255,255,255,0.08), rgba(255,255,255,0.04)); background-size: 200% 100%; animation: fbdShimmer 1.4s infinite; }
@keyframes fbdShimmer { 0%{background-position:200% 0;} 100%{background-position:-200% 0;} }

/* Moderator panel (reactive removal only). */
.fbd-mod { margin-top: 2rem; background: rgba(40,16,16,0.4); border: 1px solid rgba(248,113,113,0.3); border-radius: 1rem; padding: 1.25rem; }
.fbd-mod-head { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.9rem; }
.fbd-mod-tag { font-family: 'Barlow Condensed',sans-serif; font-weight: 700; font-size: 0.7rem; letter-spacing: 0.16em; text-transform: uppercase; color: #fca5a5; }
.fbd-mod-item { background: rgba(6,14,16,0.6); border: 1px solid rgba(255,255,255,0.08); border-radius: 0.7rem; padding: 0.85rem; margin-bottom: 0.75rem; }
.fbd-mod-reasons { font-size: 0.76rem; color: #fdba74; margin: 0.4rem 0; }
.fbd-mod-actions { display: flex; gap: 0.4rem; flex-wrap: wrap; margin-top: 0.5rem; }

@media (max-width: 640px) {
  #open-forum { padding: 2.5rem 0.75rem 3.5rem; }
  .fbd-toolbar { flex-direction: column; align-items: stretch; }
  .fbd-controls { flex-direction: column; align-items: stretch; }
  .fbd-controls .fbd-select, .fbd-controls .fbd-btn { width: 100%; }
  .fbd-tracks { flex-direction: column; }
  .fbd-modal { padding: 1.15rem; }
}