/* VOLURR Community — channels/rooms/bots styles (.cmx 3-pane + institutional restyle).
   Split from market.css (orig lines 1028-2169). Loads right AFTER market.css to preserve cascade.
   Bump ?v=N in index.html after editing. */
/* ═══════════════════ COMMUNITY INSTITUTIONAL RESTYLE (session 16) ═══════════════════ */

/* ── header ── */
/* ════════════ Community header / wrap / footer restyle (institutional light) ════════════ */
/* WIDTH FIX: fill the content area (user: use the empty side gutters) */
.cmwrap{max-width:none;margin:0 auto}

/* Top bar: white card-feel header row */
.cmhd{display:flex;align-items:center;gap:16px;margin-bottom:18px;padding:10px 14px;
  background:var(--card);border:1px solid var(--line);border-radius:14px;
  box-shadow:0 4px 18px rgba(40,55,90,.06)}

/* LEFT — logo + wordmark on one line */
.cmlogo{width:30px;height:30px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}
.cmlogo img{width:100%;height:100%;object-fit:contain;display:block}
.cmhd-b{flex-shrink:0;display:flex;flex-direction:column;justify-content:center;min-width:0}
.cmtitle{font-size:20px;font-weight:900;line-height:1.05;white-space:nowrap;letter-spacing:.2px}
.cmtitle .cmw1{color:var(--txt)}
.cmtitle .cmw2{color:var(--gold);margin-inline-start:6px}
/* subtitle folded to small secondary line */
.cmhsub{font-size:10.5px;color:var(--muted);margin-top:2px;font-weight:700;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;max-width:240px}

/* CENTER — large rounded search pill fills the middle */
.cmhd-search{flex:1 1 auto;display:flex;align-items:center;gap:9px;min-width:0;
  height:42px;background:var(--card2);border:1px solid var(--line);border-radius:24px;
  padding-inline:16px;transition:border-color .18s,box-shadow .18s,background .18s}
.cmhd-search:focus-within{border-color:var(--gold);background:var(--card);
  box-shadow:0 0 0 3px rgba(214,47,47,.12)}
.cmhd-search .cmhd-si{width:18px;height:18px;flex-shrink:0;color:var(--muted);transition:color .18s}
.cmhd-search:focus-within .cmhd-si{color:var(--gold)}
.cmhd-search input{flex:1 1 auto;min-width:0;border:0;outline:0;background:transparent;
  font-family:inherit;font-size:13.5px;font-weight:600;color:var(--txt)}
.cmhd-search input::placeholder{color:var(--muted);font-weight:600}

/* RIGHT — keep live badge, restore pill look inside community header */
.cmhd .ai-live{margin-inline-start:0;flex-shrink:0;display:inline-flex;align-items:center;gap:5px;
  font-size:10.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;
  color:var(--gold);border:1px solid rgba(214,47,47,.4);border-radius:20px;padding:4px 11px}
.cmhd .ai-live i{width:6px;height:6px;border-radius:50%;background:var(--gold);
  box-shadow:0 0 6px var(--gold);animation:lvp 2s infinite}

/* FOOTER — centered muted credit line */
.cmfoot{text-align:center;color:var(--muted);font-size:11.5px;font-weight:600;
  padding:18px 12px 6px;margin-top:22px;border-top:1px solid var(--line)}

/* Responsive: stack search below the title row on narrow viewports */
@media(max-width:760px){
  .cmhd{flex-wrap:wrap;gap:12px 14px}
  .cmhd-search{order:3;flex-basis:100%;height:40px}
  .cmhd .ai-live{margin-inline-start:auto}
  .cmhsub{max-width:none}
}

/* ── kpi ── */
/* ===== KPI STAT CARDS + GRADIENT SPARKLINE — institutional restyle (APPENDED OVERRIDE) ===== */
.cmkpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}
/* HORIZONTAL layout (reference): icon+label on top, big value+delta on the LEFT, area sparkline on the RIGHT */
.cmkpi{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:12px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px 13px;overflow:hidden;box-shadow:0 4px 18px rgba(40,55,90,.06);transition:box-shadow .16s ease,transform .16s ease,border-color .16s ease}
.cmkpi:hover{box-shadow:0 9px 26px rgba(40,55,90,.11);transform:translateY(-2px)}
.cmkpi::before{content:none}
/* legacy accent classes (home cards also pass an inline --kc which wins) */
.cmkpi.k-blue{--kc:#3aa0ff}.cmkpi.k-purple{--kc:#b06bff}.cmkpi.k-green{--kc:#26d07c}.cmkpi.k-gold{--kc:#e8a33d}
/* header row spans both columns */
.cmkpi-top{grid-column:1/-1;display:flex;align-items:center;gap:9px;margin-bottom:10px}
.cmkpi-ic{width:32px;height:32px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--kc,var(--gold)) 13%,transparent);color:var(--kc,var(--gold));flex-shrink:0}
.cmkpi-ic .cmtab-ic{display:inline-flex}
.cmkpi-ic .cmtab-ic svg,.cmkpi-ic svg{width:17px;height:17px;display:block}
.cmkpi-lb{font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* left column: big value + REAL "+N this week" delta */
.cmkpi-body{grid-column:1;min-width:0}
.cmkpi-v{font-size:30px;font-weight:900;color:var(--txt);font-variant-numeric:tabular-nums;line-height:1.04}
.cmkpi-chg{font-size:11.5px;font-weight:800;color:var(--up);margin-top:4px;white-space:nowrap}
.cmkpi-chg.neutral{color:var(--muted)}
/* right column: gradient-area sparkline */
.cmkpi-sp{grid-column:2;display:block;width:120px;height:48px;align-self:center;overflow:visible}
@media(max-width:1180px){.cmkpi-sp{width:88px}}
@media(max-width:900px){.cmkpis{grid-template-columns:repeat(2,1fr)}.cmkpi-v{font-size:26px}.cmkpi-sp{width:78px;height:42px}}
/* circular accuracy ring (Overall Accuracy KPI) — red, centered % */
.cmkpi-ring{grid-column:2;align-self:center;position:relative;width:56px;height:56px;flex-shrink:0}
.cmkpi-ring svg{width:100%;height:100%;display:block}
.cmkpi-ring circle{transition:stroke-dashoffset .6s ease}
.cmkpi-ringv{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;color:var(--txt);font-variant-numeric:tabular-nums}
.cmkpi-ringv i{font-size:9px;font-style:normal;margin-inline-start:1px;color:var(--muted)}
@media(max-width:900px){.cmkpi-ring{width:48px;height:48px}.cmkpi-ringv{font-size:12px}}
/* RED-only brand: force all hub gateway accents to theme red (was blue/purple/green) */
.cmgate.g-blue,.cmgate.g-purple,.cmgate.g-green{--gc:var(--gold)}

/* ── list ── */
/* ============================================================
   VOLURR Community — Channel list sidebar restyle (override)
   Appended to END of market.css. Re-declares every property.
   ============================================================ */

/* --- search pill (single, top) --- */
.cmtg-search{display:flex;align-items:center;gap:8px;padding:11px 12px 9px;border-bottom:1px solid var(--line)}
.cmtg-search span{display:none}
.cmtg-si{width:16px;height:16px;color:var(--muted);flex-shrink:0;position:absolute;inset-inline-start:21px;pointer-events:none}
.cmtg-search{position:relative}
.cmtg-search input{flex:1;background:var(--card2);border:1px solid var(--line);color:var(--txt);border-radius:10px;padding:9px 12px;padding-inline-start:34px;font-size:13px;font-family:inherit;font-weight:600;outline:none;transition:border-color .16s,box-shadow .16s}
.cmtg-search input::placeholder{color:var(--muted);font-weight:600}
.cmtg-search input:focus{border-color:var(--gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 12%,transparent)}

/* --- segmented control: All / Following / My channels --- */
.cmtg-tabs{display:flex;gap:0;padding:8px 12px 10px;border-bottom:1px solid var(--line)}
.cmtg-tabs{position:relative}
.cmtg-tabs::before{content:none}
.cmtg-tabs{background:transparent}
.cmtg-tabs{box-sizing:border-box}
/* the inner pill wrapper effect via the row itself */
.cmtg-tabs{display:flex}
.cmtg-tabs{gap:0}
.cmtg-tabs{padding:8px 12px 10px}
.cmtg-tabs{border-radius:0}
/* segmented pill background lives on .cmtg-tabs inner spacing */
.cmtg-tabs{align-items:stretch}
.cmtg-tabs{justify-content:stretch}
/* the segmented track */
.cmtg-tabs{}
.cmtg-tabs > .cmtgt:first-child{margin-inline-start:0}
.cmtgt{flex:1 1 0;min-width:0;border:0;background:transparent;color:var(--muted);border-radius:8px;padding:7px 4px;margin:0;cursor:pointer;font-size:11px;font-weight:800;font-family:inherit;letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;transition:color .16s,background .16s,box-shadow .16s}
.cmtgt:hover{color:var(--txt)}
.cmtgt.on{background:var(--gold);color:#fff;box-shadow:0 2px 7px color-mix(in srgb,var(--gold) 34%,transparent)}
.cmtgt.on:hover{color:#fff}
/* wrap the three tabs in a track look */
.cmtg-tabs{}
/* segmented track container: applied via a padded pill on .cmtg-tabs using a pseudo wrapper */
.cmtg-tabs{background:transparent}
/* Build the visible track as an inset behind the tabs */
.cmtg-tabs{position:relative}
.cmtg-tabs::after{content:"";position:absolute;inset:8px 12px 10px;background:var(--card2);border:1px solid var(--line);border-radius:10px;z-index:0}
.cmtgt{position:relative;z-index:1}
.cmtg-tabs{padding:8px 12px 10px;gap:3px;box-sizing:border-box}
/* nudge tabs to sit inside the track padding */
.cmtgt:first-child{margin-inline-start:3px}
.cmtgt:last-child{margin-inline-end:3px}
.cmtg-tabs{align-items:center}
.cmtg-tabs{min-height:36px}

/* --- rows scroller --- */
.cmtg-rows{flex:1;overflow-y:auto;min-height:0;padding:4px 0}

/* --- channel row --- */
.cmtgl{display:flex;align-items:flex-start;gap:11px;padding:11px 13px;cursor:pointer;border-bottom:1px solid var(--line);border-inline-start:3px solid transparent;transition:background .16s,border-color .16s}
.cmtgl:hover{background:var(--card2)}
.cmtgl.on{background:color-mix(in srgb,var(--gold) 8%,transparent);border-inline-start:3px solid var(--gold);box-shadow:none}
.cmtgl.on:hover{background:color-mix(in srgb,var(--gold) 11%,transparent)}

/* avatar — circular, tinted by per-channel hue (set inline) */
.cmtgl-av{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:14px;flex-shrink:0;text-transform:uppercase;letter-spacing:.3px;border:1px solid color-mix(in srgb,var(--avc,var(--gold)) 28%,var(--line));background:color-mix(in srgb,var(--avc,var(--gold)) 13%,var(--card));color:color-mix(in srgb,var(--avc,var(--gold)) 78%,var(--txt));margin-top:1px}

/* body */
.cmtgl-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.cmtgl-th{display:flex;align-items:center;gap:7px;min-width:0}
.cmtgl-t{flex:1;min-width:0;font-size:13.5px;font-weight:800;color:var(--txt2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25}
.cmtgl.on .cmtgl-t{color:var(--txt)}
.cmtgl-m{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmtgl-m b{font-weight:900;color:var(--txt2)}

/* count badge (real posts value only) */
.cmtgl-cnt{flex-shrink:0;min-width:18px;height:18px;border-radius:9px;padding:0 6px;background:var(--card2);border:1px solid var(--line);color:var(--muted);font-size:10px;font-weight:800;display:grid;place-items:center;font-variant-numeric:tabular-nums;line-height:1}
.cmtgl.on .cmtgl-cnt{background:var(--gold);border-color:transparent;color:#fff}

/* timestamp pinned trailing-top */
.cmtgl-ago{font-size:10.5px;color:var(--muted);flex-shrink:0;font-variant-numeric:tabular-nums;margin-top:2px;white-space:nowrap}

/* --- create button --- */
.cmtg-create{margin:10px;border:1px dashed var(--gold);background:transparent;color:var(--gold);border-radius:10px;padding:10px;cursor:pointer;font-size:13px;font-weight:800;font-family:inherit;flex-shrink:0;transition:background .16s,box-shadow .16s,transform .16s}
.cmtg-create:hover{background:color-mix(in srgb,var(--gold) 8%,transparent);box-shadow:0 3px 12px color-mix(in srgb,var(--gold) 18%,transparent);transform:translateY(-1px)}

/* empty state inside rows */
.cmtg-rows .empty{padding:26px 18px;font-size:12.5px;color:var(--muted);text-align:center}

/* ── feed ── */
/* ════════════════════════════════════════════════════════════════
   VOLURR Community — CENTER FEED restyle (light institutional)
   Appended override block. Re-declares every property each selector
   needs so it does not depend on the original rules above.
   --gold / --accent are the RED brand accent.
   ════════════════════════════════════════════════════════════════ */

/* ── center card shell ── */
.cmtg-feed{display:flex;flex-direction:column;min-height:0;height:100%;background:var(--card)}
.cmtg-feedtop{flex-shrink:0;border-bottom:1px solid var(--line);background:var(--card)}

/* ── cover strip (keep inline hue gradient set in JS) ── */
.cmtg-cover{height:56px;border-radius:14px 14px 0 0;background:linear-gradient(120deg,color-mix(in srgb,var(--gold) 30%,var(--card2)),var(--card2) 78%)}

/* ── header row: avatar overlaps the cover ── */
.cmtg-head{display:flex;align-items:center;gap:12px;padding:8px 18px 14px;position:relative}
.cmtg-hav{width:46px;height:46px;border-radius:50%;background:var(--card2);border:1px solid var(--line);display:grid;place-items:center;font-weight:900;font-size:16px;color:var(--gold);flex-shrink:0;text-transform:uppercase}
.cmtg-hav.ov{margin-top:-30px;border:3px solid var(--card);box-shadow:0 4px 14px rgba(40,55,90,.18)}
.cmtg-hav.lg{width:64px;height:64px;font-size:22px;margin:0 auto 8px}

.cmtg-hb{flex:1;min-width:0}
.cmtg-ht{font-size:16px;font-weight:900;color:var(--txt);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmtg-hm{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums;margin-top:2px}
.cmtg-hm b{color:var(--txt2);font-weight:800}

/* ── trailing action cluster ── */
.cmtg-hacts{display:flex;align-items:center;gap:8px;margin-inline-start:auto;flex-shrink:0}

/* Follow (secondary, turns red brand on follow) */
.cmsub{flex-shrink:0;border:1px solid var(--line);background:var(--card);color:var(--txt);border-radius:10px;padding:7px 16px;cursor:pointer;font-size:12.5px;font-weight:800;font-family:inherit;transition:border-color .16s,color .16s,background .16s}
.cmsub:hover{border-color:var(--gold);color:var(--gold)}
.cmsub.on{background:transparent;border-color:var(--gold);color:var(--gold)}
.cmsub.on:hover{filter:brightness(1.02)}

/* settings gear (owner) */
.cmtg-gear{flex-shrink:0;width:36px;height:36px;border-radius:10px;background:var(--card);border:1px solid var(--line);color:var(--muted);cursor:pointer;display:grid;place-items:center;transition:border-color .16s,color .16s,transform .16s}
.cmtg-gear:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-1px)}
.cmtg-gear .cmi{width:17px;height:17px}

/* Invite (RED primary per DS) */
.cmtg-invite{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,var(--gold),var(--gold2));border:0;color:#fff;border-radius:10px;padding:8px 14px;cursor:pointer;font-size:12.5px;font-weight:800;font-family:inherit;flex-shrink:0;transition:filter .15s,transform .15s}
.cmtg-invite:hover{filter:brightness(1.08);transform:translateY(-1px)}
.cmtg-invite .cmi{width:15px;height:15px}

/* info toggle */
.cmtg-infobtn{flex-shrink:0;width:36px;height:36px;border-radius:10px;background:var(--card);border:1px solid var(--line);color:var(--muted);cursor:pointer;display:grid;place-items:center;transition:border-color .16s,color .16s,transform .16s}
.cmtg-infobtn:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-1px)}
.cmtg-infobtn svg{width:18px;height:18px}

@media(max-width:560px){.cmtg-invite span{display:none}.cmtg-invite{padding:8px 11px}}

/* ── pinned band (red-tinted) ── */
.cmtg-pin{display:flex;gap:10px;align-items:flex-start;padding:10px 18px;background:rgba(214,47,47,.055);border-top:1px solid var(--line)}
.cmtg-pinic{font-style:normal;display:inline-flex;align-items:center;flex-shrink:0;margin-top:1px}
.cmtg-pinic .cmi{width:14px;height:14px;color:var(--gold)}
.cmtg-pinl{font-size:10.5px;font-weight:800;color:var(--gold);text-transform:uppercase;letter-spacing:.3px;margin-bottom:2px}
.cmtg-pint{font-size:12px;color:var(--txt2);line-height:1.5}

/* ── messages list ── */
.cmtg-msgs{flex:1;overflow-y:auto;min-height:0;padding:16px 18px;display:flex;flex-direction:column;gap:16px;background:var(--card)}

.cmmsg{display:flex;gap:11px}
.cmmsg-av{width:38px;height:38px;border-radius:50%;background:var(--card2);border:1px solid var(--line);display:grid;place-items:center;font-weight:800;font-size:12.5px;color:var(--gold);flex-shrink:0;text-transform:uppercase}
.cmmsg-w{flex:1;min-width:0;max-width:82%}
.cmmsg-h{display:flex;align-items:center;gap:8px;margin-bottom:5px;font-size:12.5px}
.cmmsg-h b{font-weight:800;color:var(--txt)}

/* red-tinted Admin chip */
.cmmsg-adm{font-size:9.5px;font-weight:800;color:var(--gold);background:rgba(214,47,47,.10);border:1px solid rgba(214,47,47,.18);border-radius:5px;padding:1px 7px;text-transform:uppercase;letter-spacing:.3px}
.cmmsg-t{color:var(--muted);font-size:11px;margin-inline-start:auto;font-variant-numeric:tabular-nums}

/* white bubble */
.cmmsg-bub{background:var(--card);border:1px solid var(--line);border-radius:4px 14px 14px 14px;padding:12px 14px;cursor:pointer;box-shadow:0 2px 10px rgba(40,55,90,.05);transition:border-color .16s,box-shadow .16s}
.cmmsg-bub:hover{border-color:var(--gold);box-shadow:0 5px 18px rgba(40,55,90,.09)}

.cmmsg-tt{font-size:14px;font-weight:800;line-height:1.45;color:var(--txt)}
.cmmsg-d{font-size:12.5px;color:var(--txt2);line-height:1.55;margin-top:5px;white-space:pre-wrap}


.cmmsg-img{width:100%;border-radius:10px;margin-top:11px;border:1px solid var(--line);display:block}

/* VOLURR AGI score line */
.cmmsg-score{display:flex;align-items:center;gap:6px;margin-top:11px;padding-top:9px;border-top:1px solid var(--line);font-size:11.5px;color:var(--muted);font-weight:600}
.cmmsg-score .hic{color:var(--gold);width:15px;height:15px}
.cmmsg-score b{color:var(--gold);font-weight:900}

/* ── reaction row: subtle rounded pills ── */
.cmmsg-rx{display:flex;align-items:center;gap:8px;margin-top:8px}
.cmrx{display:inline-flex;align-items:center;gap:6px;background:var(--card2);border:1px solid var(--line);color:var(--muted);border-radius:16px;padding:5px 13px;cursor:pointer;font-size:12px;font-weight:800;font-family:inherit;font-variant-numeric:tabular-nums;transition:border-color .16s,color .16s,background .16s}
.cmrx .cmi{width:15px;height:15px}
.cmrx:hover{border-color:var(--gold);color:var(--gold)}
.cmrx.on{background:rgba(214,47,47,.10);border-color:var(--gold);color:var(--gold)}
/* views: passive, no hover affordance */
.cmrx-v{cursor:default;background:transparent;border-color:transparent;padding-inline:5px}
.cmrx-v:hover{border-color:transparent;color:var(--muted)}

/* ════════════════ COMPOSE ════════════════ */
.cmtg-cw{flex-shrink:0;border-top:1px solid var(--line);padding:12px 16px;background:var(--card)}
.cmtg-cw .cmcompose{margin:0;border:0;padding:0;background:transparent}

.cmcompose{background:transparent;border:0;border-radius:14px;padding:0;margin-bottom:0}

/* pill text input + trailing red circular send button */
.cmcompose-tawrap{position:relative;display:block}
.cmcompose-ta{width:100%;background:var(--card2);border:1px solid var(--line);color:var(--txt);border-radius:22px;padding:12px 52px 12px 16px;font-size:14px;font-family:inherit;outline:none;resize:vertical;min-height:46px;line-height:1.5;box-sizing:border-box;transition:border-color .15s,box-shadow .15s}
.cmcompose-ta:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(214,47,47,.08)}
/* RED circular send (paper-plane) on the trailing side */
.cmcompose-send{position:absolute;inset-block-start:6px;inset-inline-end:6px;width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--gold),var(--gold2));border:0;color:#fff;cursor:pointer;display:grid;place-items:center;transition:filter .15s,transform .15s}
.cmcompose-send:hover{filter:brightness(1.08);transform:translateY(-1px)}
.cmcompose-send:disabled{opacity:.55;cursor:default;transform:none}
.cmcompose-send .cmi{width:17px;height:17px}

#cmpImgPrev:not(:empty){margin-top:10px}

/* trade setup panel */
.cmcompose-trade{margin-top:11px;padding:12px;background:var(--card2);border:1px solid var(--line);border-radius:12px}
.cmcompose-row{display:flex;gap:8px;margin-bottom:8px}
.cmcompose-row:last-child{margin-bottom:0}
.cmcompose-in{flex:1;min-width:0;background:var(--card);border:1px solid var(--line);color:var(--txt);border-radius:9px;padding:9px 12px;font-size:13px;font-family:inherit;outline:none;font-variant-numeric:tabular-nums;box-sizing:border-box;transition:border-color .15s}
.cmcompose-in:focus{border-color:var(--gold)}
.cmcompose-dir{display:flex;gap:6px;flex-shrink:0}
.cmpd{border:1px solid var(--line);background:var(--card);color:var(--muted);border-radius:9px;padding:9px 13px;cursor:pointer;font-size:12.5px;font-weight:800;font-family:inherit;transition:.14s}
.cmpd.up.on{background:rgba(18,160,95,.12);border-color:var(--up);color:var(--up)}
.cmpd.down.on{background:rgba(221,58,68,.12);border-color:var(--down);color:var(--down)}

/* action bar */
.cmcompose-act{display:flex;align-items:center;gap:9px;margin-top:11px}
.cmcompose-tog{display:inline-flex;align-items:center;gap:6px;background:var(--card);border:1px solid var(--line);color:var(--txt2);border-radius:10px;padding:8px 14px;cursor:pointer;font-size:12.5px;font-weight:800;font-family:inherit;transition:border-color .15s,color .15s}
.cmcompose-tog:hover,.cmcompose-tog.on{border-color:var(--gold);color:var(--gold)}
.cmcompose-tog span{font-weight:900;font-size:14px;line-height:1}
.cmcompose-tog .cmi{width:14px;height:14px}
/* secondary Post (kept; send arrow is the primary action) */
.cmcompose-post{margin-inline-start:auto;background:linear-gradient(135deg,var(--gold),var(--gold2));border:0;color:#fff;border-radius:10px;padding:9px 24px;cursor:pointer;font-size:13px;font-weight:800;font-family:inherit;transition:filter .15s,transform .15s}
.cmcompose-post:hover{filter:brightness(1.08);transform:translateY(-1px)}
.cmcompose-post:disabled{opacity:.6;cursor:default;transform:none}

/* compose image preview chip */
.cmpimg{position:relative;display:inline-block;margin-top:10px}
.cmpimg img{max-width:100%;max-height:200px;border-radius:10px;border:1px solid var(--line);display:block}
.cmpimg button{position:absolute;top:6px;inset-inline-end:6px;width:24px;height:24px;border-radius:50%;background:rgba(20,22,28,.6);color:#fff;border:0;cursor:pointer;font-size:12px;font-weight:800}

/* ── info ── */
/* ===== Channel info panel restyle (append to END of market.css; overrides ~459-497) ===== */
.cmtg-info{padding:0;overflow-y:auto;background:var(--card)}

/* header */
.cmtg-info-h{font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;padding:14px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}
.cmtg-x{background:transparent;border:0;color:var(--muted);cursor:pointer;font-size:14px;width:28px;height:28px;border-radius:8px;line-height:1;display:grid;place-items:center;transition:background .15s,color .15s,border-color .15s}
.cmtg-x:hover{background:var(--card2);color:var(--gold)}

/* hero */
.cmtg-info-hero{text-align:center;padding:20px 16px 16px;border-bottom:1px solid var(--line)}
.cmtg-hav.lg{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;margin:0 auto 10px;font-size:25px;font-weight:900;color:#fff;text-transform:uppercase;border:0;background:linear-gradient(140deg,hsl(var(--chue,0) 64% 56%),hsl(var(--chue,0) 58% 40%));box-shadow:0 6px 18px hsl(var(--chue,0) 50% 40% / .28);flex-shrink:0}
.cmtg-info-hero .cmtg-ht{font-size:16.5px;font-weight:800;color:var(--txt);margin-top:2px;line-height:1.3}
.cmtg-info-hero .cmtg-hm{font-size:12px;color:var(--muted);margin-top:3px;font-variant-numeric:tabular-nums}
.cmtg-info-hero .cmtg-hm b{color:var(--txt);font-weight:900}
.cmtg-info-bio{font-size:12.5px;color:var(--txt2);line-height:1.6;padding:12px 4px 0;margin:12px auto 0;text-align:center;border-top:1px solid var(--line);max-width:none}

/* info rows */
.cmtg-info-rows{padding:6px 0}
.cmtg-irow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 16px;border-top:0;font-size:12.5px}
.cmtg-irl{display:inline-flex;align-items:center;gap:9px;color:var(--muted);text-transform:uppercase;font-weight:800;font-size:10.5px;letter-spacing:.3px;min-width:0}
.cmtg-iric{width:16px;height:16px;flex-shrink:0;color:var(--muted);opacity:.9}
.cmtg-irow b{font-weight:800;color:var(--txt);font-variant-numeric:tabular-nums;text-align:end;white-space:nowrap}

/* notifications pill toggle (honest local preference) */
.cmtg-notif{flex-shrink:0;width:38px;height:21px;border-radius:11px;border:1px solid var(--line);background:var(--card2);cursor:pointer;padding:0;position:relative;transition:background .18s,border-color .18s}
.cmtg-notif i{position:absolute;inset-block-start:50%;inset-inline-start:3px;transform:translateY(-50%);width:15px;height:15px;border-radius:50%;background:var(--card);box-shadow:0 1px 3px rgba(40,55,90,.25);transition:inset-inline-start .18s,background .18s}
.cmtg-notif:hover{border-color:var(--gold)}
.cmtg-notif.on{background:linear-gradient(135deg,var(--gold),var(--gold2));border-color:transparent}
.cmtg-notif.on i{inset-inline-start:20px;background:#fff}

/* section header */
.cmtg-info-sec{font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;padding:15px 16px 9px;display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid var(--line)}
.cmtg-secn{min-width:18px;height:18px;border-radius:9px;background:var(--gold);color:#fff;font-size:10.5px;font-weight:800;display:grid;place-items:center;padding:0 5px}

/* admins */
.cmtg-adm{display:flex;align-items:center;gap:11px;padding:7px 16px}
.cmtg-av.sm{position:relative;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:12.5px;color:#fff;text-transform:uppercase;flex-shrink:0;border:0;background:linear-gradient(140deg,hsl(var(--chue,0) 64% 56%),hsl(var(--chue,0) 58% 40%))}
.cmtg-av.sm.ai{background:radial-gradient(circle at 38% 30%,#c9a6ff,#7c4dff 60%,#4a1f9e);color:#fff;font-size:11px}
.cmtg-dot{position:absolute;inset-block-end:-1px;inset-inline-end:-1px;width:11px;height:11px;border-radius:50%;background:var(--up);border:2px solid var(--card);box-shadow:0 0 0 1px var(--up)}
.cmtg-admb{min-width:0}
.cmtg-admb b{display:block;font-size:13px;font-weight:800;color:var(--txt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmtg-admb span{font-size:11px;color:var(--muted)}

/* media gallery — clean 3-col grid per DS; tiles/overflow/empty preserved functionally */
.cmtg-media-empty{font-size:12px;color:var(--muted);padding:6px 16px 16px}
.cmtg-media{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:6px 16px 18px}
.cmtg-mt{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;border:1px solid var(--line);cursor:pointer;background:var(--card2);transition:transform .16s,border-color .16s,box-shadow .16s}
.cmtg-mt:hover{transform:translateY(-2px);border-color:var(--gold);box-shadow:0 9px 26px rgba(40,55,90,.11)}
.cmtg-mt img{width:100%;height:100%;object-fit:cover;display:block}
.cmtg-mt-more{position:absolute;inset:0;display:grid;place-items:center;background:rgba(8,12,20,.72);color:#fff;font-weight:800;font-size:14px;letter-spacing:.3px}


/* ── message card: Entry/Target table + role chip + share (reference design) ── */
.cmmsg-role{font-size:9.5px;font-weight:800;color:var(--muted);background:var(--card2);border:1px solid var(--line);border-radius:5px;padding:1px 7px;font-variant-numeric:tabular-nums}
.cmmsg-tbl{margin-top:10px;border:1px solid var(--line);border-radius:9px;overflow:hidden;font-variant-numeric:tabular-nums}
.cmmsg-tbl-r{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}
.cmmsg-tbl-r:first-child{border-top:0}
.cmmsg-tbl-r>span,.cmmsg-tbl-r>b{padding:8px 12px;font-size:13px;min-width:0}
.cmmsg-tbl-r>span:first-child,.cmmsg-tbl-r>b:first-child{border-inline-end:1px solid var(--line)}
.cmmsg-tbl-r.head>span{background:color-mix(in srgb,var(--gold) 6%,var(--card2));font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.3px;color:var(--muted)}
.cmmsg-tbl-r.val>b{font-size:15px;font-weight:800;color:var(--txt)}
.cmmsg-tbl-r.val>b.up{color:var(--up)}
.cmmsg-tbl-r.meta>span{font-size:11.5px;color:var(--muted)}
.cmmsg-tbl-r.meta b{font-weight:800;color:var(--txt2)}.cmmsg-tbl-r.meta b.down{color:var(--down)}
.cmmsg-rx{display:flex;gap:7px;align-items:center}
.cmrx-share{margin-inline-start:auto;padding:5px 9px!important}
.cmrx-share .cmi{width:15px;height:15px}


/* ═══════════ INSTITUTIONAL REFINEMENT — terminal-grade: sharper corners, denser ═══════════ */
/* sharper corners (14 → 10/8) — consumer-round → enterprise */
.cmtg>div,.cmkpi,.cmside-card,.cmgate,.cmhd{border-radius:16px}
.cmtg-cover{border-radius:10px 10px 0 0}
.cmmsg-bub{border-radius:3px 10px 10px 10px}
.cmtg-search input,.cmtg-create,.cmtgt,.cmmsg-tbl,.cmtg-invite,.cmsub,.cmtg-gear,.cmtg-infobtn,.cmkpi-ic,.cmtg-mt,.cmcreate-in,.cmcompose-post{border-radius:8px}
.cmtg-tabs{border-radius:9px}
/* denser layout — tighter gutters, less airy */
.cmtg{gap:10px}
.cmchstats{gap:10px;margin-bottom:12px}
.cmkpi{padding:13px 15px}
.cmtg-head{padding:7px 15px 11px}
.cmtg-msgs{padding:13px 15px;gap:13px}
.cmtg-search{padding:11px 13px 9px}
/* crisper hairline dividers (institutional uses 1px subtle lines, not heavy) */
.cmtg-irow{padding:9px 15px}
.cmmsg-tbl-r>span,.cmmsg-tbl-r>b{padding:7px 12px}
/* refined author meta */
.cmmsg-adm{font-size:9px;padding:1px 6px;letter-spacing:.3px}
.cmmsg-h{font-size:12px}


/* ════════ COMMUNITY CHANNELS (.cmx) — Signal & analysis channels ════════
   Restyled to match the user reference image: clean cards · red accents ·
   white message cards · red pinned bar · channel-info side panel.
   ADAPTIVE: every surface uses app theme tokens → follows light/dark.
   DATA: everything rendered is REAL — this section is styling only. */

.cmx{
  --red:var(--gold); --red-2:var(--gold2); --red-soft:var(--glow);
  --green:var(--up); --green-bright:var(--up);
  --ink:var(--txt); --ink-strong:var(--txt); --body:var(--txt2);
  --mute:var(--muted); --mute-2:var(--muted);
  --card-2:var(--card2); --card-lift:var(--card2); --line-soft:var(--line);
  --r:18px; --r-sm:12px;
  font-family:inherit; color:var(--txt);
  position:relative; background:transparent; border-radius:12px;
  padding:2px 0; margin-top:4px;
}
.cmx *,.cmx *::before,.cmx *::after{margin:0;padding:0;box-sizing:border-box}
/* decorative dark mesh — off on the adaptive theme */
.cmx .net{display:none}

/* ── MERGED HEADER (channels tab): back + search injected INSIDE the global topbar — one bar ── */
.cmx-hdrbar{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:10px;max-width:680px}
.cmx-hback{display:inline-flex;align-items:center;gap:6px;background:var(--card);border:1px solid var(--line);color:var(--txt);border-radius:999px;padding:8px 15px;cursor:pointer;font-family:inherit;font-size:12.5px;font-weight:700;flex-shrink:0;white-space:nowrap;transition:border-color .15s,color .15s}
.cmx-hback:hover{border-color:var(--gold);color:var(--gold)}
.cmx-hsearch{flex:1;min-width:120px;display:flex;align-items:center;gap:9px;background:var(--card2);border:1px solid var(--line);border-radius:24px;padding:8px 16px;transition:border-color .15s,box-shadow .15s}
.cmx-hsearch:focus-within{border-color:var(--gold);box-shadow:0 0 0 3px var(--glow)}
.cmx-hsearch svg{width:15px;height:15px;color:var(--muted);flex-shrink:0}
.cmx-hsearch input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-family:inherit;font-size:13px;font-weight:600;color:var(--txt)}
.cmx-hsearch input::placeholder{color:var(--muted);font-weight:500}
/* live badge inside the merged bar (matches the reference search card's LIVE pill) */
.cmx-hlive{display:inline-flex;align-items:center;gap:6px;flex-shrink:0;font-size:11px;font-weight:800;letter-spacing:.5px;color:var(--gold);background:color-mix(in srgb,var(--gold) 10%,transparent);border:1px solid color-mix(in srgb,var(--gold) 32%,transparent);border-radius:999px;padding:5px 11px;text-transform:uppercase}
.cmx-hlive i{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 7px var(--gold);animation:cmxpulse 1.8s ease-in-out infinite}
@keyframes cmxpulse{0%,100%{opacity:1}50%{opacity:.35}}
/* while merged (ANY community tab): title hugs content, drop the redundant topbar search icon */
body:has(#cmxHdrBar) .hdrL{flex:0 1 auto;min-width:130px}
body:has(#cmxHdrBar) #btnSearch{display:none}
@media(max-width:900px){.cmx-hdrbar{display:none}body:has(#cmxHdrBar) #btnSearch{display:inline-flex}}

/* ── STAT CARDS — SLIM strip · mouse-controlled boxes (drag to reorder · ✕ to close) ── */
.cmx .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:8px;margin-top:0}
.cmx .stat-card{
  background:var(--cardgrad);border:1px solid var(--line);border-radius:16px;
  box-shadow:var(--shadow);position:relative;cursor:grab;
  padding:7px 12px 6px;display:flex;align-items:stretch;gap:8px;overflow:hidden;min-height:50px;
}
.cmx .stat-card:active{cursor:grabbing}
.cmx .stat-card.dragging{opacity:.45}
.cmx .stat-card .stat-x{
  position:absolute;top:5px;inset-inline-end:5px;width:19px;height:19px;
  border-radius:50%;border:1px solid var(--line);background:var(--card-2);color:var(--mute);
  font-size:9.5px;line-height:1;cursor:pointer;font-family:inherit;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transition:opacity .15s,color .15s,border-color .15s;z-index:2;
}
.cmx .stat-card:hover .stat-x{opacity:1}
.cmx .stat-card .stat-x:hover{color:var(--red);border-color:var(--red)}
.cmx .stat-restore{
  border:1.5px dashed var(--line);background:transparent;color:var(--mute);
  border-radius:16px;min-height:50px;cursor:pointer;font-family:inherit;
  font-size:11.5px;font-weight:700;transition:color .15s,border-color .15s;
}
.cmx .stat-restore:hover{color:var(--red);border-color:var(--red)}
/* slim strip: label on top · value + delta on ONE line (keeps the box ~50px) */
.cmx .stat-left{flex:1;min-width:0;display:grid;grid-template-columns:auto 1fr;align-items:baseline;column-gap:8px}
.cmx .stat-label{
  grid-column:1/-1;line-height:1.25;
  display:flex;align-items:center;gap:6px;
  font-size:9.5px;font-weight:800;letter-spacing:.7px;
  color:var(--mute);text-transform:uppercase;white-space:nowrap;
}
.cmx .stat-label .dot{
  width:16px;height:16px;border-radius:5px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.cmx .dot.red{background:color-mix(in srgb,var(--red) 13%,transparent);color:var(--red)}
.cmx .dot.green{background:color-mix(in srgb,var(--green) 14%,transparent);color:var(--green)}
.cmx .stat-value{grid-row:2;font-size:17px;line-height:1.25;font-weight:800;color:var(--ink);margin-top:2px;letter-spacing:-.3px}
.cmx .stat-delta{grid-row:2;font-size:9.5px;line-height:1.25;font-weight:600;color:var(--mute);margin-top:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmx .stat-spark{width:74px;align-self:flex-end;flex-shrink:0}
.cmx .stat-spark svg{display:block;width:100%;height:28px}

/* ── MAIN GRID: channels list · feed · info panel — FIXED HEIGHT (Telegram 3-pane) ── */
/* NOTE: the app shell also styles a global `.main` (margin-inline-start 208/62px for the nav)
   — that margin leaked INTO this inner grid and created a dead strip. Reset it explicitly. */
.cmx .main{
  display:grid;grid-template-columns:226px minmax(0,1fr) 290px;
  gap:8px;margin:8px 0 0;margin-inline-start:0;
  align-items:stretch;
  height:calc(100dvh - 158px);min-height:440px;
}
body.sidecollapsed .cmx .main{margin-inline-start:0}
.cmx .card{
  background:var(--cardgrad);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:var(--shadow);
}

/* ── SIDEBAR (channel list — own scroll, like Telegram's chat list) ── */
.cmx .sidebar{padding:10px;display:flex;flex-direction:column;gap:9px;min-height:0;overflow:hidden}
.cmx .side-search{
  display:flex;align-items:center;gap:8px;
  background:var(--card-2);border:1px solid var(--line);border-radius:9px;
  padding:9px 12px;color:var(--mute);
}
.cmx .side-search input{flex:1;min-width:0;background:none;border:none;outline:none;color:var(--ink);font-size:12.5px;font-family:inherit}
.cmx .side-search input::placeholder{color:var(--mute)}
/* one search lives in the section header — hide the duplicate inside the sidebar */
.cmx .sidebar .side-search{display:none}

.cmx .side-tabs{display:flex;gap:7px}
.cmx .tab{
  font-size:11.5px;font-weight:700;padding:6px 13px;
  border-radius:999px;cursor:pointer;white-space:nowrap;font-family:inherit;
  background:var(--card-2);border:1px solid var(--line);color:var(--body);
  transition:background .15s,border-color .15s,color .15s;
}
.cmx .tab.active{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 2px 8px var(--red-soft)}
.cmx .tab:not(.active):hover{border-color:var(--red);color:var(--red)}

.cmx .channel-list{display:flex;flex-direction:column;gap:4px;flex:1;min-height:0;overflow-y:auto}
.cmx .channel{
  display:flex;align-items:center;gap:10px;
  padding:10px 8px;border-radius:14px;cursor:pointer;
  border:1px solid transparent;position:relative;transition:background .15s;
}
.cmx .channel:hover{background:var(--card-lift)}
.cmx .channel.active{
  background:linear-gradient(90deg,color-mix(in srgb,var(--red) 12%,transparent),color-mix(in srgb,var(--red) 4%,transparent));
  border-color:color-mix(in srgb,var(--red) 26%,transparent);
}
.cmx .channel.active::before{
  content:"";position:absolute;inset-inline-start:-12px;top:8px;bottom:8px;
  width:3px;border-radius:3px;background:var(--red);
}
.cmx .ch-avatar{
  width:38px;height:38px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:800;
  background:color-mix(in srgb,var(--red) 9%,var(--card-2));color:var(--red);
  border:1px solid color-mix(in srgb,var(--red) 28%,transparent);
}
.cmx .ch-body{flex:1;min-width:0}
.cmx .ch-name{
  font-size:12.5px;font-weight:700;color:var(--ink);
  display:flex;align-items:center;gap:6px;
  white-space:nowrap;overflow:hidden;
}
.cmx .ch-name .ch-nm{min-width:0;overflow:hidden;text-overflow:ellipsis}
.cmx .ch-meta{font-size:11px;color:var(--mute);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* richer channel rows: quality rating · "You" tag · symbol tags */
.cmx .ch-name .ch-q{flex-shrink:0;font-size:10px;font-weight:800;color:var(--gold);background:color-mix(in srgb,var(--gold) 12%,transparent);border:1px solid color-mix(in srgb,var(--gold) 28%,transparent);border-radius:999px;padding:2px 7px;font-variant-numeric:tabular-nums}
.cmx .ch-name .ch-you{flex-shrink:0;font-size:8.5px;font-weight:800;color:#fff;background:var(--gold);border:1px solid transparent;border-radius:4px;padding:2.5px 5px;letter-spacing:.3px}
.cmx .ch-tags{display:flex;gap:5px;margin-top:4px;flex-wrap:wrap}
.cmx .ch-tags span{font-size:9px;font-weight:700;color:var(--body);background:var(--card-2);border:1px solid var(--line);border-radius:5px;padding:1px 6px;font-variant-numeric:tabular-nums}
.cmx .ch-right{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex-shrink:0}
.cmx .ch-time{font-size:10.5px;color:var(--mute)}
.cmx .ch-count{
  min-width:18px;height:18px;border-radius:999px;
  background:color-mix(in srgb,var(--muted) 22%,transparent);color:var(--body);
  font-size:10px;font-weight:700;
  display:flex;align-items:center;justify-content:center;padding:0 5px;
}
.cmx .ch-count.new{background:var(--red);color:#fff}
/* emoji room avatar (groups) */
.cmx .ch-avatar.emoji{background:var(--card-2);border-color:var(--line);font-size:17px;line-height:1}

.cmx .vip-tag{
  background:var(--red);color:#fff;
  font-size:8.5px;font-weight:800;letter-spacing:.5px;
  padding:2px 6px;border-radius:4px;flex-shrink:0;
}
.cmx .create-channel{
  margin-top:auto;width:100%;
  border:1px solid color-mix(in srgb,var(--red) 55%,transparent);color:var(--red);
  background:color-mix(in srgb,var(--red) 4%,transparent);border-radius:999px;
  padding:11px;font-size:13px;font-weight:700;
  text-align:center;cursor:pointer;font-family:inherit;
  transition:background .15s;
}
.cmx .create-channel:hover{background:color-mix(in srgb,var(--red) 11%,transparent)}

/* ── CENTER — ONE Telegram pane: header / pinned strip / scrolling feed / composer ── */
.cmx .center{display:flex;flex-direction:column;min-width:0;min-height:0;height:100%}
.cmx .chatpane{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden;padding:0}

/* Telegram-style chat header — soft, rounded, clean avatar + name + status */
.cmx .tg-head{display:flex;align-items:center;gap:11px;padding:9px 14px;border-bottom:1px solid var(--line);flex-shrink:0;border-radius:16px 16px 0 0}
.cmx .vip-medal{
  width:42px;height:42px;border-radius:50%;flex-shrink:0;overflow:hidden;
  background:linear-gradient(135deg,var(--red),var(--red-2));border:0;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-weight:800;font-size:13px;letter-spacing:.5px;
  box-shadow:0 2px 8px color-mix(in srgb,var(--red) 30%,transparent);
}
.cmx .vip-medal img{width:100%;height:100%;object-fit:cover}
.cmx .ov-titles{flex:1;min-width:0}
.cmx .ov-title{font-size:15.5px;font-weight:800;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.2px}
.cmx .ov-sub{font-size:11.5px;color:var(--mute);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmx .ov-actions{display:flex;gap:8px;flex-shrink:0;align-items:center}

.cmx .btn{font-family:inherit;font-size:11px;font-weight:800;letter-spacing:.7px;text-transform:uppercase;padding:8px 16px;border-radius:999px;cursor:pointer}
.cmx .btn-ghost{background:var(--card-2);border:1px solid var(--line);color:var(--ink);transition:border-color .15s,color .15s}
.cmx .btn-ghost:hover{border-color:var(--red);color:var(--red)}
.cmx .btn-red{background:linear-gradient(180deg,var(--red),var(--red-2));border:1px solid var(--red);color:#fff;box-shadow:0 3px 10px var(--red-soft)}
.cmx .btn-red:hover{filter:brightness(1.06)}
.cmx .iconbtn{width:34px;height:34px;border-radius:50%;background:var(--card-2);border:1px solid var(--line);color:var(--body);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:border-color .15s,color .15s}
.cmx .iconbtn:hover{border-color:var(--red);color:var(--red)}
.cmx .iconbtn .cmi{width:15px;height:15px}

/* pinned messages — flat strip under the header (Telegram) */
.cmx .pinned{
  flex-shrink:0;border-radius:0;padding:8px 14px;
  display:flex;align-items:center;gap:10px;
  background:linear-gradient(90deg,color-mix(in srgb,var(--red) 11%,transparent),color-mix(in srgb,var(--red) 4%,transparent));
  border-bottom:1px solid color-mix(in srgb,var(--red) 18%,transparent);overflow:hidden;
}
.cmx .pinned .cmi{width:14px;height:14px;color:var(--red);flex-shrink:0}
.cmx .pinned .pin-label{font-size:11.5px;font-weight:800;color:var(--red);white-space:nowrap;display:flex;align-items:center;gap:7px}
.cmx .pinned .pin-text{font-size:11.5px;color:var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}

/* floating jump-to-latest button */
.cmx .chatpane{position:relative}
.cmx .tg-down{
  position:absolute;inset-inline-end:14px;bottom:88px;width:40px;height:40px;border-radius:50%;
  background:var(--card);border:1px solid var(--line);color:var(--body);
  display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:5;
  box-shadow:0 4px 14px rgba(0,0,0,.16);
  opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity .2s,transform .2s,color .15s,border-color .15s;
}
.cmx .tg-down.show{opacity:1;pointer-events:auto;transform:none}
.cmx .tg-down:hover{color:var(--red);border-color:var(--red)}

/* the scrolling feed — clearly tinted chat background so the bubbles stand out (Telegram) */
.cmx .tg-feed{
  flex:1;min-height:0;overflow-y:auto;
  display:flex;flex-direction:column;gap:9px;
  padding:11px 12px;background:var(--bg);
}
html[data-theme="light"] .cmx .tg-feed{background:#e8ecf2}
html[data-theme="light"] .cmx .msg-meta{box-shadow:0 1px 2px rgba(30,42,70,.10)}

/* day separator chip + "new messages" divider (Telegram) */
.cmx .tg-day{display:flex;justify-content:center;margin:3px 0 1px;flex-shrink:0}
.cmx .tg-day span{background:color-mix(in srgb,var(--muted) 16%,transparent);color:var(--body);font-size:10.5px;font-weight:700;padding:3px 12px;border-radius:999px}
.cmx .tg-new{display:flex;align-items:center;gap:10px;margin:3px 0;color:var(--red);font-size:10.5px;font-weight:800;flex-shrink:0}
.cmx .tg-new::before,.cmx .tg-new::after{content:"";flex:1;height:1px;background:color-mix(in srgb,var(--red) 35%,transparent)}

/* message — avatar + BUBBLE (Telegram style) · grouped messages stack tighter without name/avatar */
.cmx .message{background:transparent;border:0;box-shadow:none;padding:0;cursor:pointer;flex-shrink:0}
.cmx .message.grp{margin-top:-5px}
.cmx .avatar.ghost{background:transparent;border:0;height:0;pointer-events:none}
.cmx .msg-head{display:flex;align-items:flex-end;gap:8px}
.cmx .avatar{
  width:33px;height:33px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:800;
  background:var(--card-2);color:var(--red);
  border:1px solid var(--line);
}
.cmx .avatar.person{overflow:hidden}
.cmx .avatar.person img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}
.cmx .avatar.ai{background:color-mix(in srgb,var(--red) 14%,var(--card-2));color:var(--red);border-color:color-mix(in srgb,var(--red) 35%,transparent)}

.cmx .msg-meta{
  flex:0 1 auto;min-width:0;max-width:min(620px,94%);
  background:var(--cardgrad);border:1px solid var(--line);
  border-radius:18px;border-end-start-radius:5px;
  padding:9px 14px 10px;box-shadow:0 1px 3px rgba(0,0,0,.07);
}
/* media sizing — balanced bubble (Telegram media size): charts wide but capped, squares modest */
.cmx .msg-img{display:block;max-width:100%;max-height:300px;width:auto;height:auto;border-radius:13px;margin-top:9px;cursor:pointer}
/* in MAXIMIZED mode the chat owns the screen → let media breathe bigger there */
.cmx.maximized .msg-meta{max-width:min(860px,96%)}
.cmx.maximized .msg-img{max-height:480px}
.cmx .msg-author{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cmx .msg-name{font-size:13.5px;font-weight:800;color:var(--ink)}
.cmx .msg-name.red{color:var(--red)}
.cmx .chip{font-size:9.5px;font-weight:700;padding:2.5px 7px;border-radius:4px;letter-spacing:.3px}
.cmx .chip.admin{background:var(--red);color:#fff}
.cmx .chip.role{background:var(--card-2);color:var(--body);border:1px solid var(--line)}
.cmx .chip.ai{background:var(--card-2);color:var(--ink);border:1px solid var(--line)}
.cmx .msg-time{margin-inline-start:auto;font-size:11px;color:var(--mute);flex-shrink:0}
.cmx .msg-title{font-size:15px;font-weight:800;color:var(--ink);margin-top:9px;letter-spacing:.2px}



/* ── institutional SIGNAL CARD (channels): levels grid + measured distances + R:R proportion bar ── */
.cmx .sig-card{margin-top:12px;border:1px solid var(--line);border-radius:13px;overflow:hidden;background:var(--card-2)}
.cmx .sig-levels{display:grid;grid-template-columns:repeat(3,1fr)}
.cmx .sig-lv{display:flex;flex-direction:column;gap:3px;padding:10px 13px;border-inline-end:1px solid var(--line-soft);min-width:0}
.cmx .sig-lv:last-child{border-inline-end:0}
.cmx .sig-lv-l{font-size:9.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--mute)}
.cmx .sig-lv-v{font-size:15px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmx .sig-lv-d{font-size:10.5px;font-weight:700;font-variant-numeric:tabular-nums}
.cmx .sig-lv.tp .sig-lv-d{color:var(--green)} .cmx .sig-lv.tp .sig-lv-v{color:var(--green)}
.cmx .sig-lv.sl .sig-lv-d{color:var(--red)} .cmx .sig-lv.sl .sig-lv-v{color:var(--red)}
.cmx .sig-rr{padding:10px 13px;border-top:1px solid var(--line-soft)}
.cmx .sig-rr-bar{display:flex;height:7px;border-radius:999px;overflow:hidden;background:var(--line)}
.cmx .sig-rr-bar i{display:block;height:100%}
.cmx .sig-rr-bar i.risk{background:var(--red)} .cmx .sig-rr-bar i.reward{background:var(--green)}
.cmx .sig-rr-meta{display:flex;align-items:center;justify-content:space-between;margin-top:7px;gap:10px}
.cmx .sig-rr-val{font-size:11.5px;font-weight:700;color:var(--body)} .cmx .sig-rr-val b{color:var(--ink);font-weight:900}
.cmx .sig-rr-posted{font-size:10.5px;color:var(--mute);white-space:nowrap}

.cmx .msg-arabic{direction:rtl;text-align:right;font-size:13px;line-height:22px;color:var(--body);margin-top:13px}

.cmx .reactions{display:flex;align-items:center;gap:7px;margin-top:9px}
.cmx .react{
  display:flex;align-items:center;gap:5px;
  font-size:11px;font-weight:700;color:var(--body);
  background:var(--card-2);border:1px solid var(--line);border-radius:999px;
  padding:4px 10px;cursor:pointer;font-family:inherit;transition:border-color .15s,color .15s;
}
.cmx .react:hover{border-color:var(--red);color:var(--red)}
.cmx .react.on{background:var(--red-soft);border-color:color-mix(in srgb,var(--red) 45%,transparent);color:var(--red)}
.cmx .react.views{background:none;border:none;color:var(--mute);padding:4px 2px}
.cmx .react-share{
  margin-inline-start:auto;width:28px;height:28px;border-radius:50%;
  background:var(--card-2);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
  color:var(--body);cursor:pointer;transition:border-color .15s,color .15s;
}
.cmx .react-share:hover{border-color:var(--red);color:var(--red)}
.cmx .react .cmi,.cmx .react-share .cmi{width:13px;height:13px}

/* AGI card */
.cmx .agi{padding:16px}

/* composer — Telegram style (emoji · input · trade · attach · big round red send) */
/* the strip under the composer = SAME chat background (no white band — Telegram) */
.cmx .cmp-wrap{flex-shrink:0;display:flex;flex-direction:column;gap:8px;margin:0;padding:6px 10px 12px;background:var(--bg)}
html[data-theme="light"] .cmx .cmp-wrap{background:#e8ecf2}
.cmx .cmp-wrap .cmcompose-trade{margin-top:0;border-radius:16px}
.cmx .cmp-wrap .cmcompose-in{border-radius:11px}
.cmx .cmp-wrap .cmpd{border-radius:11px}
.cmx .cmp-wrap #cmpImgPrev:empty{display:none}
.cmx .cmp-wrap .cmpimg{margin-top:0}
.cmx .cmp-ic{
  width:34px;height:34px;border-radius:50%;flex-shrink:0;border:0;background:transparent;
  color:var(--mute);display:flex;align-items:center;justify-content:center;cursor:pointer;
  font-family:inherit;transition:color .15s,background .15s;
}
.cmx .cmp-ic:hover{color:var(--red);background:var(--card-2)}
.cmx .cmp-ic.dim{cursor:default}
.cmx .cmp-ic.dim:hover{color:var(--mute);background:transparent}
.cmx .cmp-ic.on{color:var(--red);background:var(--red-soft)}
/* Telegram-style input pill — soft, fully rounded, roomy */
.cmx .composer{
  display:flex;align-items:center;gap:6px;flex-shrink:0;
  background:var(--card-2);border:1px solid var(--line);border-radius:999px;
  padding:5px;padding-inline-start:15px;
}
.cmx .composer:focus-within{border-color:color-mix(in srgb,var(--red) 45%,var(--line))}
.cmx .cmp-wrap .composer{margin:0}
.cmx .send-btn.busy{opacity:.55;pointer-events:none}
.cmx .composer input{font-size:13.5px;padding:6px 0}
/* visitor bottom bar — real follow/unfollow (Telegram "JOIN") */
.cmx .tg-join{
  flex-shrink:0;margin:0;padding:11px;border-radius:999px;
  background:linear-gradient(180deg,var(--red),var(--red-2));border:1px solid var(--red);color:#fff;
  font-family:inherit;font-size:12.5px;font-weight:800;letter-spacing:.4px;cursor:pointer;
  box-shadow:0 3px 12px var(--red-soft);transition:filter .15s;
}
.cmx .tg-join:hover{filter:brightness(1.06)}
.cmx .tg-join.on{background:var(--card-2);border-color:var(--line);color:var(--body);box-shadow:none}
.cmx .composer input{flex:1;min-width:0;background:none;border:none;outline:none;color:var(--ink);font-size:13px;font-family:inherit}
.cmx .composer input::placeholder{color:var(--mute)}
.cmx .composer .emoji{color:var(--mute);flex-shrink:0;cursor:pointer;display:flex}
.cmx .send-btn{
  width:46px;height:46px;border-radius:50%;flex-shrink:0;border:none;cursor:pointer;
  background:linear-gradient(180deg,var(--red),var(--red-2));color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 3px 10px var(--red-soft);transition:filter .15s;
}
.cmx .send-btn .cmi{width:18px;height:18px}
/* owner: delete-post button — appears on bubble hover */
.cmx .msg-del{
  width:28px;height:28px;border-radius:50%;flex-shrink:0;
  background:var(--card-2);border:1px solid var(--line);color:var(--mute);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  opacity:0;transition:opacity .15s,color .15s,border-color .15s;
}
.cmx .message:hover .msg-del{opacity:1}
.cmx .msg-del:hover{color:var(--red);border-color:var(--red)}
.cmx .send-btn:hover{filter:brightness(1.1)}
.cmx .btn .cmi{width:15px;height:15px;vertical-align:-2px}

/* ── RIGHT COLUMN: Channel Info · Admins · Media Gallery (own scroll) ── */
.cmx .right{display:flex;flex-direction:column;gap:8px;min-width:0;min-height:0;overflow-y:auto;padding-bottom:2px}
.cmx .right .panel{flex-shrink:0}
.cmx .panel{padding:16px}
.cmx .panel-head{display:flex;align-items:center;justify-content:space-between}
.cmx .panel-title{font-size:11.5px;font-weight:800;letter-spacing:1px;color:var(--ink);text-transform:uppercase;white-space:nowrap}
.cmx .panel-x{color:var(--mute);cursor:pointer;font-size:15px;line-height:1;background:none;border:none;font-family:inherit;transition:color .15s}
.cmx .panel-x:hover{color:var(--red)}

.cmx .info-rows{margin-top:8px}
.cmx .info-row{
  display:flex;align-items:center;gap:10px;
  padding:11px 0;border-bottom:1px solid var(--line-soft);
  font-size:12.5px;color:var(--body);
}
.cmx .info-row:last-of-type{border-bottom:none}
.cmx .info-row .ico{color:var(--mute);display:flex;flex-shrink:0}
.cmx .info-row .val{margin-inline-start:auto;color:var(--ink);font-weight:700;display:flex;align-items:center;gap:8px}

.cmx .toggle{
  width:38px;height:21px;border-radius:999px;background:var(--red);
  position:relative;flex-shrink:0;cursor:pointer;transition:background .15s;
}
.cmx .toggle::after{
  content:"";position:absolute;top:2px;inset-inline-end:2px;
  width:17px;height:17px;border-radius:50%;background:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.25);
}
.cmx .info-note{
  margin-top:12px;padding-top:13px;border-top:1px solid var(--line-soft);
  font-size:12px;line-height:19px;color:var(--mute);text-align:center;
}

.cmx .admins-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 10px;margin-top:14px}
.cmx .admin{display:flex;align-items:center;gap:9px;min-width:0}
.cmx .admin .avatar{width:34px;height:34px;font-size:11px;position:relative;overflow:visible}
.cmx .admin .avatar.online::after{
  content:"";position:absolute;top:-1px;inset-inline-end:-1px;
  width:9px;height:9px;border-radius:50%;
  background:var(--green);border:2px solid var(--card);
}
.cmx .admin-body{min-width:0}
.cmx .admin-name{font-size:11.5px;font-weight:700;color:var(--ink);display:flex;align-items:center;gap:5px;white-space:nowrap;overflow:hidden}
.cmx .admin-name .chip{font-size:8px;padding:1.5px 5px}
.cmx .admin-role{font-size:10px;color:var(--mute);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.cmx .filter-link{font-size:12px;font-weight:600;color:var(--body);cursor:pointer;display:flex;align-items:center;gap:4px;background:none;border:none;font-family:inherit;transition:color .15s}
.cmx .filter-link:hover{color:var(--red)}
.cmx .gallery{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:13px}
.cmx .g-tile{
  background:var(--card-2);border:1px solid var(--line);border-radius:13px;overflow:hidden;
  height:84px;display:flex;align-items:center;justify-content:center;
}
.cmx .gallery-bottom{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:10px}
.cmx .g-small{
  background:var(--card-2);border:1px solid var(--line);border-radius:13px;overflow:hidden;
  height:84px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;text-align:center;padding:0;
}
.cmx .g-tile img,.cmx .g-small img{width:100%;height:100%;object-fit:cover;display:block;cursor:pointer}
.cmx .g-small.more .plus{font-size:18px;font-weight:800;color:var(--ink)}

.cmx .footer{text-align:center;font-size:9.5px;color:var(--mute-2);padding:5px 0 0}

/* ── info-panel toggle + responsive ── */
.cmx.info-closed .right{display:none}
.cmx.info-closed .main{grid-template-columns:226px minmax(0,1fr)}
/* maximized channel — the chat pane takes the whole section (boxes & side panels hidden) */
.cmx .iconbtn .ic-min{display:none}
.cmx.maximized .maxbtn .ic-max{display:none}
.cmx.maximized .maxbtn .ic-min{display:block}
.cmx.maximized .stats,.cmx.maximized .sidebar,.cmx.maximized .right{display:none}
.cmx.maximized .main{grid-template-columns:1fr;height:calc(100dvh - 96px);margin-top:0}
@media(max-width:1280px){
  .cmx .main{grid-template-columns:200px minmax(0,1fr) 258px}
  .cmx.info-closed .main{grid-template-columns:200px minmax(0,1fr)}
}
@media(max-width:1080px){
  .cmx .main{grid-template-columns:1fr;height:calc(100dvh - 210px)}
  .cmx .sidebar,.cmx .right{display:none}
  .cmx .stats{grid-template-columns:1fr 1fr}
}

/* ── page chrome while on this tab (scoped to the VISIBLE view — leaving the tab restores it) ── */
/* no market ticker on the channels tab + pull the whole page up to reclaim its 34px strip */
body:has(.view.on .cmx) .ticker{display:none!important}
body:has(.view.on .cmx) .app{padding-top:0}
body:has(.view.on .cmx) .topbar{top:0}
body:has(.view.on .cmx) .side{top:0}
/* tighter view paddings on this tab — the section needs the space (user request) */
body:has(.view.on .cmx) #views .view.on{padding:6px 10px 6px}
.cmx{margin-top:0;padding:0}
/* brand already in the global top bar — hide the duplicate cmShell header/footer/breadcrumb */
/* ONE bar: the cmShell header card is merged into the global topbar on EVERY community tab (incl. hub) */
.cmwrap .cmhd{display:none}
.cmwrap:has(.cmx) .cmfoot{display:none}
.cmwrap:has(.cmx) .cmbackbar{display:none}


/* ════════════════════ DEEP INSTITUTIONAL PASS — clean · flat · precise (last word) ════════════════════ */
/* 1) remove the page-wide haze + heavy decorative layers (also un-chokes the renderer) */
#v-copy > .cmwrap::before{display:none!important}
#v-copy .cmca::after{display:none!important}

/* 2) flat terminal-grade surfaces — crisp hairline borders, NO corner-glow gradients/inner glows */
#v-copy .cmkpi,
#v-copy .cmbcard,
#v-copy .cmside-card{background:var(--card)!important}   /* depth restored by community-pro.css (Pro theme) */
/* adaptive surfaces — theme tokens, NOT hardcoded dark (so light mode renders correctly) */
#v-copy .cmgate{background:linear-gradient(160deg,var(--card2),var(--card))!important}   /* depth restored by community-pro.css (Pro theme) */
#v-copy .cmgate-agi{background:var(--card)!important;border-color:color-mix(in srgb,var(--gold) 30%,var(--line))!important}
#v-copy .cmkpi::before{box-shadow:none!important;height:2px}

/* 3) precise, still hover — accent border only (no lift, no glow), adapts to theme */
#v-copy .cmgate:hover,
#v-copy .cmkpi:hover,
#v-copy .stat-card:hover,
#v-copy .cmgate-agi:hover{background:var(--card2)!important;border-color:color-mix(in srgb,var(--gold) 50%,var(--line))!important}   /* lift+glow restored by community-pro.css */

/* 4) calm the decorative art — subtle static texture, no animation glow */
#v-copy .cmgate-art{opacity:.32;filter:none!important}
#v-copy .cmgate-art.bot{opacity:.5}

/* 5) clean AGI orb — minimal halo (no mega-glow) */
#v-copy .cmagi-orb,
.cmagi-mbox .cmagi-morb,
.cmagi-mbox .cmagi-worb{box-shadow:0 0 0 5px color-mix(in srgb,var(--gold) 9%,transparent),0 4px 16px rgba(255,45,45,.22)!important}

/* 6) solid, flat red action buttons (no heavy drop-glow) */
#v-copy .create-channel,
.cmagi-mbox .cmagi-msend{box-shadow:none!important}   /* gate/agi buttons get 3D depth from community-pro.css */

/* 7) tighter, aligned institutional typography */
#v-copy .cmkpi-lb,
#v-copy .stat-label,
#v-copy .cmbcard-h,
#v-copy .cmx .stat-label{letter-spacing:.5px}
#v-copy .cmkpi-v,
#v-copy .cmca-v,
#v-copy .cmx .stat-value{font-variant-numeric:tabular-nums;letter-spacing:-.3px}


/* ════════════ CHANNEL MICRO TRADING HUB — tabbed (Overview·Feed·Signals·Media·AI·About) ════════════ */
.cmx .cmx-tabs{display:flex;gap:7px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;flex-shrink:0;
  padding:9px 12px;border-bottom:1px solid var(--line);
  -webkit-mask:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent);mask:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent)}
.cmx .cmx-tabs::-webkit-scrollbar{display:none}
.cmx .cmx-tab{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;font-family:inherit;font-size:12.5px;font-weight:700;white-space:nowrap;
  padding:7px 14px;border-radius:999px;cursor:pointer;background:var(--card-2);border:1px solid var(--line);color:var(--body);
  transition:background .15s ease,border-color .15s ease,color .15s ease}
.cmx .cmx-tab:not(.is-active):hover{border-color:var(--red);color:var(--red)}
.cmx .cmx-tab.is-active{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 2px 10px var(--red-soft)}
.cmx .cmx-tab-c{font-size:10px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;padding:2px 6px;border-radius:999px;background:color-mix(in srgb,var(--mute) 22%,transparent);color:var(--body)}
.cmx .cmx-tab.is-active .cmx-tab-c{background:rgba(255,255,255,.24);color:#fff}

.cmx .cmx-feedwrap{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.cmx .cmx-panel.scroll{flex:1;min-height:0;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:12px}
.cmx .cmx-enter{animation:cmxRise .16s ease-out both}
@keyframes cmxRise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.cmx .cmx-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:9px;margin:auto;padding:34px 22px;min-height:160px;background:var(--card-2);border:1px dashed var(--line);border-radius:14px}
.cmx .cmx-empty-ic{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--mute) 14%,transparent);color:var(--mute)}
.cmx .cmx-empty-ic svg{width:22px;height:22px;display:block}
.cmx .cmx-empty-t{font-size:14px;font-weight:800;color:var(--ink)}
.cmx .cmx-empty-h{font-size:12px;font-weight:600;line-height:1.55;color:var(--body);max-width:300px}
.cmx .cmx-empty-cta{margin-top:4px;font-family:inherit;font-size:12px;font-weight:700;padding:8px 16px;border-radius:999px;cursor:pointer;background:var(--card);border:1px solid var(--line);color:var(--ink);transition:border-color .15s,color .15s}
.cmx .cmx-empty-cta:hover{border-color:var(--red);color:var(--red)}
.cmx .cmx-empty.is-locked{border-style:solid}
.cmx .cmx-empty.is-locked .cmx-empty-ic{background:color-mix(in srgb,var(--red) 11%,transparent);color:color-mix(in srgb,var(--red) 78%,var(--ink))}

.cmx .cmx-ident{display:flex;align-items:center;gap:12px}
.cmx .cmx-ident-av{width:48px;height:48px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;font-size:14px;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--red),var(--red-2));box-shadow:0 2px 10px var(--red-soft)}
.cmx .cmx-ident-n{font-size:16px;font-weight:900;color:var(--ink);display:flex;align-items:center;gap:7px}
.cmx .cmx-ident-m{font-size:11.5px;color:var(--mute);margin-top:2px}
.cmx .cmx-ident-bio{font-size:12.5px;line-height:1.6;color:var(--body);background:var(--card-2);border:1px solid var(--line);border-radius:12px;padding:11px 13px}
.cmx .cmx-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.cmx .cmx-kpi{background:var(--card-2);border:1px solid var(--line);border-radius:12px;padding:11px 8px;text-align:center;min-width:0}
.cmx .cmx-kpi b{display:block;font-size:18px;font-weight:900;color:var(--ink);font-variant-numeric:tabular-nums;letter-spacing:-.3px}
.cmx .cmx-kpi span{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--mute);margin-top:3px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmx .cmx-ov-sec{display:flex;flex-direction:column;gap:8px}
.cmx .cmx-ov-h{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--mute)}
.cmx .cmx-dirbar{display:flex;height:9px;border-radius:999px;overflow:hidden;background:var(--line)}
.cmx .cmx-dirbar i.up{background:var(--green)} .cmx .cmx-dirbar i.dn{background:var(--red)}
.cmx .cmx-dirl{display:flex;justify-content:space-between;font-size:11.5px;font-weight:800}
.cmx .cmx-dirl .up{color:var(--green)} .cmx .cmx-dirl .dn{color:var(--red)}
.cmx .cmx-tags{display:flex;gap:6px;flex-wrap:wrap}
.cmx .cmx-tags span{font-size:11px;font-weight:700;color:var(--body);background:var(--card-2);border:1px solid var(--line);border-radius:7px;padding:3px 10px;font-variant-numeric:tabular-nums}
.cmx .cmx-latest{background:var(--card-2);border:1px solid var(--line);border-radius:12px;padding:12px;cursor:pointer;transition:border-color .15s}
.cmx .cmx-latest:hover{border-color:var(--red)}
.cmx .cmx-latest-t{font-size:13.5px;font-weight:800;color:var(--ink);margin:7px 0}
.cmx .cmx-latest-m{font-size:11px;color:var(--mute);margin-top:8px;display:flex;align-items:center;gap:5px}
.cmx .cmx-latest-m .cmi{width:13px;height:13px}
.cmx .cmx-ov-traction{display:flex;align-items:center;gap:6px;justify-content:center;font-size:11.5px;color:var(--mute);font-weight:600;padding-top:2px}
.cmx .cmx-ov-traction .cmi{width:14px;height:14px}

.cmx .cmx-sigfilters{display:flex;gap:7px;flex-wrap:wrap}
.cmx .cmx-sigchip{font-family:inherit;font-size:11.5px;font-weight:700;padding:6px 13px;border-radius:999px;cursor:pointer;background:var(--card-2);border:1px solid var(--line);color:var(--body);transition:.15s}
.cmx .cmx-sigchip.on{background:var(--red);border-color:var(--red);color:#fff}
.cmx .cmx-sigchip:not(.on):hover{border-color:var(--red);color:var(--red)}
.cmx .cmx-sig-foot{font-size:11px;color:var(--mute);font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cmx .cmx-sig-note{font-size:10px;font-weight:600;color:var(--mute);opacity:.85}
.cmx .cmx-siggrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.cmx .cmx-sig{background:var(--card-2);border:1px solid var(--line);border-radius:13px;padding:11px 12px;cursor:pointer;transition:border-color .15s,transform .16s ease-out}
.cmx .cmx-sig:hover{border-color:var(--red);transform:translateY(-2px)}
.cmx .cmx-sig-h{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.cmx .cmx-sig-sym{font-size:12px;font-weight:800;color:var(--ink)} .cmx .cmx-sig-tf{font-size:10px;font-weight:700;color:var(--body);background:var(--card);border:1px solid var(--line);border-radius:5px;padding:1px 6px}
.cmx .cmx-sig-age{margin-inline-start:auto;font-size:10.5px;color:var(--mute)}
.cmx .cmx-sig-t{font-size:12.5px;font-weight:700;color:var(--ink);margin:7px 0 0}
.cmx .cmx-sig .sig-card{margin-top:9px}
.cmx .cmx-sig-rx{font-size:10.5px;color:var(--mute);margin-top:9px;display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.cmx .cmx-sig-rx .cmi{width:12px;height:12px;vertical-align:-1px}

.cmx .cmx-mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.cmx .cmx-mtile{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line);cursor:pointer;aspect-ratio:1;background:var(--card-2)}
.cmx .cmx-mtile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .2s ease}
.cmx .cmx-mtile:hover img{transform:scale(1.05)}
.cmx .cmx-mtile-cap{position:absolute;inset-inline:0;bottom:0;display:flex;justify-content:space-between;gap:6px;padding:7px 9px;font-size:10px;font-weight:700;color:#fff;background:linear-gradient(0deg,rgba(0,0,0,.72),transparent)}

.cmx .cmx-abrows{display:flex;flex-direction:column}
.cmx .cmx-abrow{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px solid var(--line-soft);font-size:12.5px;color:var(--body)}
.cmx .cmx-abrow:last-child{border-bottom:0} .cmx .cmx-abrow b{color:var(--ink);font-weight:800}
.cmx .cmx-ab-empty{font-size:12.5px;color:var(--mute);background:var(--card-2);border:1px dashed var(--line);border-radius:12px;padding:13px;text-align:center}
.cmx .cmx-abacts{display:flex;gap:9px;flex-wrap:wrap;margin-top:4px}
.cmx .cmx-abacts .btn{display:inline-flex;align-items:center;gap:6px}
.cmx .cmx-abacts .btn .cmi{width:14px;height:14px}

.cmx .cmx-aipanel{flex:1;min-height:0;display:flex;flex-direction:column}
.cmx .cmx-ainote{display:flex;align-items:center;gap:9px;padding:10px 14px;border-bottom:1px solid var(--line);font-size:11px;font-weight:600;color:var(--body);background:radial-gradient(120% 140% at 0 0,color-mix(in srgb,var(--red) 9%,transparent),transparent 60%)}
.cmx .cmx-ainote svg{width:18px;height:18px;flex-shrink:0;color:var(--red)}
.cmx .cmx-aibody{flex:1;min-height:0;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:11px;background:var(--bg)}
html[data-theme="light"] .cmx .cmx-aibody{background:#eef1f6}
.cmx .cmx-aiwelcome{margin:auto;text-align:center;color:var(--mute);display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px}
.cmx .cmx-aiwelcome svg{width:34px;height:34px;color:var(--red);opacity:.8}
.cmx .cmx-aiwt{font-size:13px;font-weight:700;color:var(--body);max-width:280px;line-height:1.5}
.cmx .cmx-aichips{display:flex;gap:7px;flex-wrap:wrap;padding:11px 14px 0}
.cmx .cmx-aichip{display:inline-flex;align-items:center;gap:6px;font-family:inherit;font-size:11.5px;font-weight:700;color:var(--body);background:var(--card-2);border:1px solid var(--line);border-radius:999px;padding:7px 13px;cursor:pointer;transition:border-color .15s,color .15s}
.cmx .cmx-aichip:hover{border-color:var(--red);color:var(--red)}
.cmx .cmx-aiinput{display:flex;gap:9px;align-items:center;padding:12px 14px}
.cmx .cmx-aiinput input{flex:1;min-width:0;background:var(--card-2);border:1px solid var(--line);border-radius:999px;padding:11px 16px;font-family:inherit;font-size:13px;color:var(--ink);outline:none;transition:border-color .15s}
.cmx .cmx-aiinput input:focus{border-color:var(--red)}
.cmx .cmx-aisend{width:42px;height:42px;border-radius:50%;flex-shrink:0;border:0;cursor:pointer;background:linear-gradient(180deg,var(--red),var(--red-2));color:#fff;display:grid;place-items:center}
.cmx .cmx-aisend .cmi{width:17px;height:17px}

.cmx .cmx-aiassist{display:flex;align-items:center;gap:8px;margin-top:12px;padding-top:11px;border-top:1px solid var(--line-soft);font-size:11px;font-weight:600;color:var(--mute)}
.cmx .cmx-aiassist .hi,.cmx .cmx-aiassist svg{width:15px;height:15px;flex-shrink:0;color:var(--red)}

@media(max-width:1280px){.cmx .cmx-kpis{grid-template-columns:repeat(2,1fr)}}
@media(prefers-reduced-motion:reduce){.cmx .cmx-enter{animation:none!important}.cmx .cmx-mtile img{transition:none}}


/* ════════════ GROUP TRADING-COLLAB HUB — sentiment gauge · discovery · live presence ════════════ */
.cmx .cmxg-live{display:inline-flex;align-items:center;gap:5px;color:var(--green);font-weight:800}
.cmx .cmxg-live i{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green);animation:cmxpulse 1.8s ease-in-out infinite}

/* overview extras */
.cmx .cmxg-ovmini{font-size:11px;color:var(--mute);font-weight:600}
.cmx .cmxg-ovmini a{color:var(--red);cursor:pointer;font-weight:800}
.cmx .cmxg-last{display:flex;gap:10px;align-items:flex-start;background:var(--card-2);border:1px solid var(--line);border-radius:12px;padding:11px}
.cmx .cmxg-last .avatar{width:34px;height:34px;flex-shrink:0}
.cmx .cmxg-last-b{min-width:0}
.cmx .cmxg-last-a{font-size:12px;font-weight:800;color:var(--ink)} .cmx .cmxg-last-a span{color:var(--mute);font-weight:600;margin-inline-start:5px}
.cmx .cmxg-last-t{font-size:12px;color:var(--body);line-height:1.5;margin-top:3px}

/* SENTIMENT — the differentiator (honest crowd gauge) */
.cmx .cmxg-sent-head{text-align:center}
.cmx .cmxg-sent-t{font-size:16px;font-weight:900;color:var(--ink)}
.cmx .cmxg-sent-sub{font-size:11px;font-weight:600;color:var(--mute);margin-top:3px}
.cmx .cmxg-gauge{margin-top:4px}
.cmx .cmxg-gauge-bar{display:flex;height:16px;border-radius:999px;overflow:hidden;background:var(--line)}
.cmx .cmxg-gauge-bar i{display:block;height:100%;transition:width .4s ease}
.cmx .cmxg-gauge-bar i.up{background:var(--up)} .cmx .cmxg-gauge-bar i.dn{background:var(--down)}
.cmx .cmxg-gauge-l{display:flex;justify-content:space-between;margin-top:7px;font-size:12.5px;font-weight:700;color:var(--body)}
.cmx .cmxg-gauge-l .up{color:var(--up)} .cmx .cmxg-gauge-l .dn{color:var(--down)}
.cmx .cmxg-gauge-l b{font-size:16px;font-weight:900;font-variant-numeric:tabular-nums}
.cmx .cmxg-sent-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.cmx .cmxg-dirlabel{font-size:12px;font-weight:800;color:var(--mute)}
.cmx .cmxg-dirlabel.up{color:var(--up)} .cmx .cmxg-dirlabel.dn{color:var(--down)}
.cmx .cmxg-votes{font-size:11px;color:var(--mute);font-weight:700}
.cmx .cmxg-conf{background:color-mix(in srgb,var(--mute) 18%,transparent);color:var(--body);border-radius:999px;padding:2px 8px;font-size:10px;font-weight:800}
.cmx .cmxg-sample{margin-top:2px}
.cmx .cmxg-sample-h{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--mute);margin-bottom:5px}
.cmx .cmxg-sample-bar{height:5px;border-radius:999px;background:var(--line);overflow:hidden}
.cmx .cmxg-sample-bar i{display:block;height:100%;background:var(--mute);opacity:.7}
.cmx .cmxg-votebar{display:flex;gap:9px;margin-top:4px}
.cmx .cmxg-vb{flex:1;padding:12px;border-radius:12px;font-family:inherit;font-size:13px;font-weight:800;cursor:pointer;border:1px solid var(--line);background:var(--card-2);transition:.15s}
.cmx .cmxg-vb.up{color:var(--up)} .cmx .cmxg-vb.up:hover,.cmx .cmxg-vb.up.on{background:color-mix(in srgb,var(--up) 15%,transparent);border-color:var(--up)}
.cmx .cmxg-vb.down{color:var(--down)} .cmx .cmxg-vb.down:hover,.cmx .cmxg-vb.down.on{background:color-mix(in srgb,var(--down) 15%,transparent);border-color:var(--down)}
.cmx .cmxg-myvote{font-size:11px;color:var(--mute);text-align:center;font-weight:600}
.cmx .cmxg-sent-foot{font-size:10.5px;line-height:1.5;color:var(--mute);text-align:center;border-top:1px solid var(--line-soft);padding-top:11px;margin-top:2px}

/* DISCOVERY — room grid (real stats) */
.cmx .cmxg-disc-h2{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--mute)}
.cmx .cmxg-discgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.cmx .cmxg-disc{background:var(--card-2);border:1px solid var(--line);border-radius:13px;padding:13px;cursor:pointer;transition:border-color .15s,transform .16s ease-out}
.cmx .cmxg-disc:hover{border-color:var(--red);transform:translateY(-2px)}
.cmx .cmxg-disc.active{border-color:var(--red);box-shadow:inset 0 0 0 1px var(--red)}
.cmx .cmxg-disc-h{display:flex;align-items:center;gap:9px}
.cmx .cmxg-disc-ic{font-size:22px;line-height:1}
.cmx .cmxg-disc-nm{flex:1;min-width:0;font-size:13.5px;font-weight:800;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmx .cmxg-disc-sent{font-size:10.5px;font-weight:800;color:var(--mute);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:2px 8px;flex-shrink:0;font-variant-numeric:tabular-nums}
.cmx .cmxg-disc-sent.up{color:var(--up);border-color:color-mix(in srgb,var(--up) 40%,transparent)} .cmx .cmxg-disc-sent.dn{color:var(--down);border-color:color-mix(in srgb,var(--down) 40%,transparent)}
.cmx .cmxg-disc-m{font-size:11px;color:var(--mute);font-weight:600;margin-top:9px;display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.cmx .cmxg-disc-last{font-size:11px;color:var(--body);margin-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.85}
.cmx .cmx-aichip.is-off{opacity:.45;cursor:not-allowed}
/* crowd-vs-gold-news divergence ribbon (Gold room Sentiment hero) — real /api/sentiment tape vs crowd vote */
.cmx .cmxg-diverge{margin-top:12px;padding:11px 12px;border:1px solid var(--line);border-radius:13px;background:var(--card-2)}
.cmx .cmxg-dv-h{font-size:10.5px;font-weight:800;color:var(--mute);letter-spacing:.3px;margin-bottom:9px;text-transform:uppercase;text-align:center}
.cmx .cmxg-dv-row{display:flex;align-items:center;justify-content:center;gap:14px}
.cmx .cmxg-dv-side{display:flex;align-items:center;gap:6px}
.cmx .cmxg-dv-cap{font-size:10.5px;font-weight:700;color:var(--body)}
.cmx .cmxg-dv-row b{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--ink)}
.cmx .cmxg-dv-row b.up{color:var(--up)}
.cmx .cmxg-dv-vs{font-size:9.5px;font-weight:800;color:var(--mute);text-transform:uppercase}
.cmx .cmxg-dv-tag{margin-top:9px;text-align:center;font-size:11.5px;font-weight:800;padding:5px 10px;border-radius:999px;font-variant-numeric:tabular-nums}
.cmx .cmxg-dv-tag.ok{color:var(--body);background:color-mix(in srgb,var(--muted) 16%,transparent)}
.cmx .cmxg-dv-tag.up{color:var(--up);background:color-mix(in srgb,var(--up) 13%,transparent)}
.cmx .cmxg-dv-tag.dn{color:var(--down);background:color-mix(in srgb,var(--down) 13%,transparent)}
.cmx .cmxg-dv-note{margin-top:7px;font-size:10px;line-height:1.5;color:var(--mute);text-align:center}
/* most-active symbols hot strip (real community_stats.most_active — count + latest post direction) */
.cmx .cmx-hot{display:flex;align-items:center;gap:10px;margin:0 0 8px;padding:6px 11px;background:var(--card-2);border:1px solid var(--line);border-radius:12px}
.cmx .cmx-hot-lbl{font-size:11px;font-weight:800;color:var(--body);white-space:nowrap;flex-shrink:0}
.cmx .cmx-hot-row{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none}
.cmx .cmx-hot-row::-webkit-scrollbar{display:none}
.cmx .cmx-hot-chip{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;background:var(--card);border:1px solid var(--line);white-space:nowrap;flex-shrink:0;cursor:default}
.cmx .cmx-hot-chip b{font-size:11px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.cmx .cmx-hot-chip i{font-size:9px;font-style:normal;font-weight:800;line-height:1}
.cmx .cmx-hot-chip i.up{color:var(--up)} .cmx .cmx-hot-chip i.dn{color:var(--down)}
.cmx .cmx-hot-n{font-size:10px;font-weight:700;color:var(--mute);font-variant-numeric:tabular-nums}
/* discussion direction filter (real per-message m.dir) */
.cmx .cmxg-mfbar{display:flex;gap:6px;padding:8px 12px 2px;flex-shrink:0}
.cmx .cmxg-mf{font-size:11px;font-weight:800;padding:4px 11px;border-radius:999px;cursor:pointer;font-family:inherit;background:var(--card-2);border:1px solid var(--line);color:var(--body);transition:.13s;font-variant-numeric:tabular-nums}
.cmx .cmxg-mf:hover{border-color:var(--mute)}
.cmx .cmxg-mf.up{color:var(--up)}
.cmx .cmxg-mf.dn{color:var(--down)}
.cmx .cmxg-mf.on{background:var(--gold);border-color:var(--gold);color:#fff}
.cmx .cmxg-mf.up.on{background:var(--up);border-color:var(--up);color:#fff}
.cmx .cmxg-mf.dn.on{background:var(--down);border-color:var(--down);color:#fff}
/* aibot real win-rate badge (global bot signal record) */
.cmx .cmxg-acc{display:flex;align-items:center;gap:11px;margin-top:10px;padding:10px 12px;border:1px solid color-mix(in srgb,var(--up) 30%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--up) 7%,transparent)}
.cmx .cmxg-acc-v{font-size:21px;font-weight:900;color:var(--up);font-variant-numeric:tabular-nums;line-height:1;flex-shrink:0}
.cmx .cmxg-acc-b{display:flex;flex-direction:column;gap:2px;min-width:0}
.cmx .cmxg-acc-l{font-size:11.5px;font-weight:800;color:var(--ink)}
.cmx .cmxg-acc-n{font-size:10.5px;font-weight:600;color:var(--mute)}
/* composer direction tag — optional real market-view on a room message (populates dir → activates the filter) */
.cmx .cmxg-dirtog{display:inline-flex;gap:3px;flex-shrink:0}
.cmx .cmxg-dt{width:26px;height:26px;border-radius:8px;border:1px solid var(--line);background:var(--card-2);font-size:11px;font-weight:800;cursor:pointer;font-family:inherit;line-height:1;display:flex;align-items:center;justify-content:center;transition:.13s}
.cmx .cmxg-dt.up{color:var(--up)} .cmx .cmxg-dt.dn{color:var(--down)}
.cmx .cmxg-dt.up.on{background:var(--up);border-color:var(--up);color:#fff}
.cmx .cmxg-dt.dn.on{background:var(--down);border-color:var(--down);color:#fff}
/* bot mascot (real transparent PNG) — must override the #v-copy gateway-art dimming rules above (they faded the old decorative SVG). cover-fit fills + crops the empty margins; red glow via drop-shadow on the alpha */
#v-copy .cmgate-art.cmgate-mascot{opacity:.97;object-fit:cover;object-position:center;width:64%;height:112%;inset-inline-end:-5%;bottom:-6%;filter:drop-shadow(0 0 16px rgba(255,45,45,.5))!important}
html[data-theme="light"] #v-copy .cmgate-art.cmgate-mascot{opacity:.9}
/* AGI orbs now use the real plasma-orb PNG → drop the red-gradient circle + white-shield filter; show the orb whole with its own glow */
.cmaipromo-orb,.cmagi-orb,.cmagi-morb,.cmagi-worb{background:none!important;box-shadow:none!important;overflow:visible}
.cmaipromo-orb img,.cmagi-orb img,.cmagi-morb img,.cmagi-worb img{width:118%!important;height:118%!important;object-fit:contain!important;filter:drop-shadow(0 0 13px rgba(255,45,45,.55))!important}

/* ═══════════════════ VERIFIED PERFORMANCE LAYER ═══════════════════
   Real System-11 24h directional accuracy surfaced into channels.
   win=price moved analyst's way (green) · loss (red) · flat/pending (muted).
   Accuracy = analysis quality signal, NOT a trade/P&L outcome. */

/* ── per-post verdict badge (hit / miss / flat / measuring) ── */
.cmx .cmx-vd{display:inline-flex;align-items:center;gap:0;font-size:10.5px;font-weight:800;line-height:1;
  padding:3px 8px;border-radius:999px;white-space:nowrap;font-variant-numeric:tabular-nums;
  background:color-mix(in srgb,var(--mute) 13%,transparent);color:var(--mute);border:1px solid transparent}
.cmx .cmx-vd.win{color:var(--up);background:color-mix(in srgb,var(--up) 13%,transparent);border-color:color-mix(in srgb,var(--up) 30%,transparent)}
.cmx .cmx-vd.loss{color:var(--down);background:color-mix(in srgb,var(--down) 13%,transparent);border-color:color-mix(in srgb,var(--down) 30%,transparent)}
.cmx .cmx-vd.flat{color:var(--body);background:color-mix(in srgb,var(--mute) 15%,transparent)}
.cmx .cmx-vd.pend{color:var(--mute);background:transparent;border-color:var(--line)}

/* ── chat call row: directional pill + verdict (institutional, compact) ── */
.cmx .cmx-callrow{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:5px 0 2px}
.cmx .cmx-callpill{display:inline-flex;align-items:center;font-size:10.5px;font-weight:800;line-height:1;
  padding:3px 9px;border-radius:999px;white-space:nowrap}
.cmx .cmx-callpill.up{color:var(--up);background:color-mix(in srgb,var(--up) 13%,transparent)}
.cmx .cmx-callpill.down{color:var(--down);background:color-mix(in srgb,var(--down) 13%,transparent)}

/* ── accuracy TRUST chip (header / sidebar) ── */
.cmx .cmx-accchip{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:800;line-height:1;
  padding:2px 8px;border-radius:999px;vertical-align:middle;margin-inline-start:7px;
  background:var(--card);border:1px solid var(--line);color:var(--body);font-variant-numeric:tabular-nums}
.cmx .cmx-accchip b{font-weight:900}
.cmx .cmx-accchip i{font-style:normal;font-weight:700;opacity:.72;font-size:9.5px}
.cmx .cmx-accchip svg{flex-shrink:0}
.cmx .cmx-accchip.up{color:var(--up);border-color:color-mix(in srgb,var(--up) 40%,transparent);background:color-mix(in srgb,var(--up) 8%,transparent)}
.cmx .cmx-accchip.down{color:var(--down);border-color:color-mix(in srgb,var(--down) 40%,transparent);background:color-mix(in srgb,var(--down) 8%,transparent)}
.cmx .cmx-accchip.early{opacity:.82;border-style:dashed}
.cmx .ch-acc{margin-top:6px}
.cmx .ch-acc .cmx-accchip{margin-inline-start:0}

/* ── TRACK RECORD panel ── */
.cmx .cmx-tr-hero{display:flex;align-items:center;gap:16px;padding:15px 4px 16px;border-bottom:1px solid var(--line-soft)}
.cmx .cmx-tr-ring{position:relative;width:64px;height:64px;flex-shrink:0;color:var(--gold)}
.cmx .cmx-tr-ring.up{color:var(--up)} .cmx .cmx-tr-ring.down{color:var(--down)}
.cmx .cmx-tr-ring svg{width:100%;height:100%;display:block}
.cmx .cmx-tr-ringv{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:18px;font-weight:900;color:var(--ink);font-variant-numeric:tabular-nums}
.cmx .cmx-tr-ringv i{font-style:normal;font-size:10px;font-weight:800;margin-inline-start:1px;color:var(--mute)}
.cmx .cmx-tr-herob{min-width:0;flex:1}
.cmx .cmx-tr-h{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--mute)}
.cmx .cmx-tr-headline{font-size:19px;font-weight:900;color:var(--ink);margin-top:3px;font-variant-numeric:tabular-nums;line-height:1.15}
.cmx .cmx-tr-headline.up{color:var(--up)} .cmx .cmx-tr-headline.down{color:var(--down)}
.cmx .cmx-tr-sub{margin-top:5px}
.cmx .cmx-tr-verified{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:800;color:var(--up);
  background:color-mix(in srgb,var(--up) 12%,transparent);border-radius:999px;padding:3px 9px}
.cmx .cmx-tr-building{display:inline-flex;align-items:center;font-size:11px;font-weight:700;color:var(--mute)}

/* breakdown strip */
.cmx .cmx-tr-breakdown{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:14px 0}
.cmx .cmx-tr-stat{text-align:center;padding:9px 4px;border-radius:11px;background:var(--card-2);border:1px solid var(--line)}
.cmx .cmx-tr-stat b{display:block;font-size:18px;font-weight:900;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1}
.cmx .cmx-tr-stat span{display:block;font-size:9.5px;font-weight:700;color:var(--mute);margin-top:4px;letter-spacing:.2px}
.cmx .cmx-tr-stat.win b{color:var(--up)} .cmx .cmx-tr-stat.loss b{color:var(--down)}
.cmx .cmx-tr-stat.pend{opacity:.85}

/* sections */
.cmx .cmx-tr-sec{padding:12px 0 4px;border-top:1px solid var(--line-soft)}
.cmx .cmx-tr-sech{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--mute);margin-bottom:10px}

/* per-symbol accuracy rows */
.cmx .cmx-tr-symrow{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.cmx .cmx-tr-sym{flex-shrink:0;width:78px;font-size:12px;font-weight:800;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmx .cmx-tr-bar{flex:1;height:7px;border-radius:999px;background:var(--line);overflow:hidden}
.cmx .cmx-tr-bar i{display:block;height:100%;border-radius:999px;background:var(--gold);transition:width .4s ease}
.cmx .cmx-tr-bar i.up{background:var(--up)} .cmx .cmx-tr-bar i.down{background:var(--down)}
.cmx .cmx-tr-symv{flex-shrink:0;text-align:end;min-width:54px;line-height:1.1}
.cmx .cmx-tr-symv b{font-size:13px;font-weight:900;font-variant-numeric:tabular-nums;color:var(--ink)}
.cmx .cmx-tr-symv b.up{color:var(--up)} .cmx .cmx-tr-symv b.down{color:var(--down)}
.cmx .cmx-tr-symn{display:block;font-size:9.5px;font-weight:700;color:var(--mute);margin-top:2px}
.cmx .cmx-tr-pendlbl{font-size:10px;font-weight:700;color:var(--mute)}

/* verdict timeline */
.cmx .cmx-tr-tl{display:flex;flex-direction:column;gap:2px}
.cmx .cmx-tr-tlrow{display:flex;align-items:center;gap:10px;padding:8px 8px;border-radius:10px;cursor:pointer;transition:background .13s}
.cmx .cmx-tr-tlrow:hover{background:var(--card-2)}
.cmx .cmx-tr-tldir{flex-shrink:0;width:22px;height:22px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:900}
.cmx .cmx-tr-tldir.up{color:var(--up);background:color-mix(in srgb,var(--up) 13%,transparent)}
.cmx .cmx-tr-tldir.down{color:var(--down);background:color-mix(in srgb,var(--down) 13%,transparent)}
.cmx .cmx-tr-tlb{flex:1;min-width:0}
.cmx .cmx-tr-tlt{display:flex;align-items:baseline;gap:7px;font-size:12.5px;min-width:0}
.cmx .cmx-tr-tlt>span[dir=ltr]{font-weight:800;color:var(--ink);flex-shrink:0}
.cmx .cmx-tr-tlttl{font-weight:600;color:var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.9}
.cmx .cmx-tr-tlm{font-size:10.5px;font-weight:600;color:var(--mute);margin-top:2px}

/* methodology footnote (analysis-only honesty) */
.cmx .cmx-tr-method{display:flex;gap:8px;align-items:flex-start;margin-top:14px;padding:11px 12px;border-radius:11px;
  background:color-mix(in srgb,var(--mute) 7%,transparent);border:1px solid var(--line-soft)}
.cmx .cmx-tr-method svg{flex-shrink:0;color:var(--mute);margin-top:1px}
.cmx .cmx-tr-method span{font-size:10.5px;line-height:1.6;color:var(--mute);font-weight:600}
.cmx .cmx-tr-empty{padding:24px;text-align:center;font-size:12.5px;color:var(--mute);line-height:1.6}

/* ═══════════════════ DISCOVERY · MY FEED · TRENDING (community elevation) ═══════════════════ */

/* home hub: trending symbols strip (real community_stats.most_active) — UNSCOPED (home is not .cmx) */
.cmtrend{display:flex;align-items:center;gap:12px;margin:0 0 16px;padding:9px 14px;background:var(--card);border:1px solid var(--line);border-radius:13px;box-shadow:0 4px 18px rgba(40,55,90,.06)}
.cmtrend-lbl{font-size:12px;font-weight:800;color:var(--ink);white-space:nowrap;flex-shrink:0}
.cmtrend-row{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.cmtrend-row::-webkit-scrollbar{display:none}
.cmtrend-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;background:var(--card-2,var(--card));border:1px solid var(--line);white-space:nowrap;flex-shrink:0}
.cmtrend-chip b{font-size:12px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.cmtrend-chip i{font-size:10px;font-style:normal;font-weight:800;line-height:1}
.cmtrend-chip i.up{color:var(--up)} .cmtrend-chip i.dn{color:var(--down)}
.cmtrend-n{font-size:10.5px;font-weight:700;color:var(--mute);font-variant-numeric:tabular-nums}

/* sidebar: My Feed entry */
.cmx .side-myfeed{display:flex;align-items:center;gap:8px;width:100%;padding:9px 12px;border-radius:11px;font-family:inherit;font-size:12.5px;font-weight:800;cursor:pointer;
  background:var(--card-2);border:1px solid var(--line);color:var(--body);transition:.14s}
.cmx .side-myfeed:hover{border-color:var(--red);color:var(--red)}
.cmx .side-myfeed.on{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 2px 8px var(--red-soft)}
.cmx .side-myfeed svg{flex-shrink:0}

/* sidebar: verified-performance discovery bar */
.cmx .side-disc{display:flex;align-items:center;gap:7px;justify-content:space-between}
.cmx .side-rank{display:inline-flex;background:var(--card-2);border:1px solid var(--line);border-radius:999px;padding:2px}
.cmx .side-rank .srk{font-family:inherit;font-size:11px;font-weight:800;padding:4px 11px;border-radius:999px;border:none;background:transparent;color:var(--mute);cursor:pointer;transition:.13s}
.cmx .side-rank .srk.on{background:var(--red);color:#fff}
.cmx .side-rank .srk:not(.on):hover{color:var(--body)}
.cmx .side-vonly{display:inline-flex;align-items:center;gap:4px;font-family:inherit;font-size:11px;font-weight:800;padding:5px 10px;border-radius:999px;cursor:pointer;
  background:var(--card-2);border:1px solid var(--line);color:var(--mute);transition:.13s}
.cmx .side-vonly svg{flex-shrink:0;opacity:.7}
.cmx .side-vonly:hover{color:var(--up);border-color:color-mix(in srgb,var(--up) 40%,transparent)}
.cmx .side-vonly.on{color:var(--up);background:color-mix(in srgb,var(--up) 12%,transparent);border-color:color-mix(in srgb,var(--up) 45%,transparent)}
.cmx .side-vonly.on svg{opacity:1}

/* Following-feed layout: 2-pane (sidebar + wide feed), right panel hidden */
.cmx.following .main{grid-template-columns:226px minmax(0,1fr)}
.cmx.following .right{display:none}
@media(max-width:1280px){.cmx.following .main{grid-template-columns:200px minmax(0,1fr)}}
@media(max-width:900px){.cmx.following .main{grid-template-columns:1fr}}

/* Following-feed center */
.cmx .cmfeed{padding:0;overflow:hidden}
.cmx .cmfeed-head{padding:15px 18px 13px;border-bottom:1px solid var(--line)}
.cmx .cmfeed-ht{display:flex;align-items:center;gap:9px;font-size:16px;font-weight:900;color:var(--ink)}
.cmx .cmfeed-ht svg{color:var(--red)}
.cmx .cmfeed-hs{font-size:11.5px;font-weight:600;color:var(--mute);margin-top:4px}
.cmx .cmfeed-scroll{flex:1;min-height:0;overflow-y:auto;padding:14px}
.cmx .cmfeed-list{display:flex;flex-direction:column;gap:11px;max-width:760px;margin:0 auto}
.cmx .cmfeed-card{background:var(--card-2);border:1px solid var(--line);border-radius:14px;padding:14px 15px;cursor:pointer;transition:border-color .14s,transform .16s ease-out,box-shadow .16s}
.cmx .cmfeed-card:hover{border-color:color-mix(in srgb,var(--red) 35%,var(--line));transform:translateY(-1px);box-shadow:0 6px 20px rgba(40,55,90,.08)}
.cmx .cmfeed-top{display:flex;align-items:center;gap:10px}
.cmx .cmfeed-av{flex-shrink:0;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--red),var(--red-2,var(--red)));cursor:pointer}
.cmx .cmfeed-who{flex:1;min-width:0}
.cmx .cmfeed-nm{font-size:13.5px;font-weight:800;color:var(--ink);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmx .cmfeed-nm:hover{color:var(--red)}
.cmx .cmfeed-meta{font-size:11px;font-weight:600;color:var(--mute);margin-top:1px}
.cmx .cmfeed-call{display:flex;align-items:center;gap:6px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}
.cmx .cmfeed-t{font-size:14px;font-weight:800;color:var(--ink);margin-top:10px;line-height:1.45}
.cmx .cmfeed-d{font-size:13px;color:var(--body);margin-top:5px;line-height:1.6;white-space:pre-wrap;word-break:break-word}
.cmx .cmfeed-img{width:100%;max-height:340px;object-fit:cover;border-radius:11px;margin-top:11px;border:1px solid var(--line)}
.cmx .cmfeed-rx{display:flex;align-items:center;gap:7px;margin-top:12px;padding-top:11px;border-top:1px solid var(--line-soft)}
.cmx .cmfeed-rx .cmrx{display:inline-flex;align-items:center;gap:5px;font-family:inherit;font-size:11.5px;font-weight:700;color:var(--mute);background:transparent;border:none;padding:4px 7px;border-radius:8px;cursor:pointer;transition:.13s;font-variant-numeric:tabular-nums}
.cmx .cmfeed-rx .cmrx:hover{background:var(--card);color:var(--body)}
.cmx .cmfeed-rx .cmrx.on{color:var(--red)}
.cmx .cmfeed-rx .cmrx-v{cursor:default}
.cmx .cmfeed-rx .cmrx-share{margin-inline-start:auto}

/* ═══════════════════ CHANNEL CATEGORY · WORLD-CLASS CREATE MODAL ═══════════════════ */

/* category badge (real persisted channel.category) — works in modal (unscoped) + hub (.cmx) */
.cmcat-badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:800;line-height:1;padding:3px 9px;border-radius:999px;vertical-align:middle;
  background:color-mix(in srgb,var(--gold) 12%,transparent);color:var(--gold);border:1px solid color-mix(in srgb,var(--gold) 28%,transparent)}
.cmcat-badge i{font-style:normal;font-size:11px;line-height:1}
.cmx .cmx-ident-cat{margin-top:7px}

/* widen only the create/settings modal for the 2-pane layout */
.modal .mbox:has(.cmcreate-pro){max-width:720px}
.cmcreate-pro .cmcreate-grid{display:grid;grid-template-columns:minmax(0,1fr) 238px;gap:20px;align-items:start;margin-top:4px}
.cmcreate-pro .cmcreate-form{min-width:0}
.cmcreate-pro .cmcreate-lb{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cmcreate-ct{font-weight:700;color:var(--muted);font-size:10px;letter-spacing:0;text-transform:none}
.cmcreate-opt{font-weight:600;color:var(--muted);font-size:10px;text-transform:none;letter-spacing:0;margin-inline-start:auto}

/* focus category chips */
.cmcat-row{display:flex;flex-wrap:wrap;gap:7px}
.cmcat-chip{display:inline-flex;align-items:center;gap:5px;font-family:inherit;font-size:12.5px;font-weight:700;padding:7px 12px;border-radius:999px;cursor:pointer;
  background:var(--card2);border:1px solid var(--line);color:var(--txt2);transition:.14s}
.cmcat-chip i{font-style:normal;font-size:13px;line-height:1}
.cmcat-chip:hover{border-color:var(--gold);color:var(--txt)}
.cmcat-chip.on{background:color-mix(in srgb,var(--gold) 14%,transparent);border-color:var(--gold);color:var(--gold)}

/* live preview + trust panel */
.cmcreate-side{display:flex;flex-direction:column;gap:13px}
.cmcreate-sh{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.cmcprev{display:flex;align-items:center;gap:11px;padding:13px;border-radius:13px;background:var(--card2);border:1px solid var(--line)}
.cmcprev-av{width:42px;height:42px;flex-shrink:0;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--gold),#b8741f)}
.cmcprev-b{min-width:0;flex:1}
.cmcprev-nm{font-size:14px;font-weight:800;color:var(--txt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmcprev-m{font-size:11px;color:var(--muted);margin-top:3px;display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.cmcreate-trust{display:flex;flex-direction:column;gap:10px;padding:13px;border-radius:13px;background:color-mix(in srgb,var(--up) 6%,transparent);border:1px solid color-mix(in srgb,var(--up) 18%,var(--line))}
.cmct-row{display:flex;gap:8px;align-items:flex-start;font-size:11.5px;line-height:1.5;color:var(--txt2);font-weight:600}
.cmct-ic{flex-shrink:0;color:var(--up);margin-top:1px}
@media(max-width:620px){
  .cmcreate-pro .cmcreate-grid{grid-template-columns:1fr}
  .cmcreate-side{flex-direction:row;flex-wrap:wrap}
  .cmcreate-side .cmcreate-sh{flex-basis:100%}
  .cmcprev,.cmcreate-trust{flex:1;min-width:210px}
}

/* ═══════════════════ IMAGE: ATTACH-FROM-CHART · DROP · FULLSCREEN LIGHTBOX ═══════════════════ */

/* clickable post images advertise the fullscreen viewer */
.cmfeed-img,.cmx .msg-img,.cmmsg-img,.cmpost-img,.cmx .cmx-mtile img,.cmx .g-tile img,.cmx .g-small img,.cmpimg img{cursor:zoom-in}
.cmfeed-img:hover,.cmmsg-img:hover,.cmx .msg-img:hover,.cmpost-img:hover{filter:brightness(1.04)}

/* composer drop-zone highlight (paste / drag-drop) */
.cmcompose.drag,.cmp-wrap.drag{outline:2px dashed var(--gold);outline-offset:-4px;border-radius:12px;background:color-mix(in srgb,var(--gold) 6%,transparent)}
.cmpimg{position:relative}
.cmpimg-hint{position:absolute;inset-block-start:6px;inset-inline-start:6px;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:7px;background:rgba(0,0,0,.55);color:#fff;pointer-events:none}
.cmpimg-hint svg{width:13px;height:13px}
.cmp-ic.busy,.cmcompose-tog.busy{opacity:.55;pointer-events:none}

/* fullscreen lightbox — above the modal (#modal z=300); dark regardless of theme */
body.cmlb-open{overflow:hidden}
.cmlb{position:fixed;inset:0;z-index:5000;display:flex;flex-direction:column;background:rgba(6,8,13,.94);backdrop-filter:blur(8px);
  opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease}
.cmlb.on{opacity:1;visibility:visible}
.cmlb-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;flex-shrink:0}
.cmlb-cap{font-size:12.5px;font-weight:700;color:rgba(255,255,255,.82);font-variant-numeric:tabular-nums;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmlb-acts{display:flex;align-items:center;gap:8px;flex-shrink:0}
.cmlb-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;cursor:pointer;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);color:#fff;transition:.14s;text-decoration:none}
.cmlb-btn:hover{background:rgba(255,255,255,.2)}
.cmlb-x:hover{background:var(--down);border-color:var(--down)}
.cmlb-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:0 16px 20px;cursor:default}
.cmlb-img{max-width:100%;max-height:100%;object-fit:contain;border-radius:6px;transition:transform .12s ease;will-change:transform;user-select:none;-webkit-user-drag:none;cursor:zoom-in}
.cmlb.zoomed .cmlb-img{cursor:grab;transition:none}
.cmlb-img.grabbing{cursor:grabbing}
.cmlb-enter{animation:cmlbpop .22s ease}
@keyframes cmlbpop{from{transform:scale(.96);opacity:.4}to{transform:scale(1);opacity:1}}
