/* ------------------------------------------------------------ /c/, every clan
 * The clans list (round 4's N4: components/social/ClanList.jsx; round 19 in
 * the owner's mockup, under the page's hero): "Your clan" (ClanHub.jsx) as a
 * card edged and lit in lime, its stats between hairlines and "View your
 * clan"; or, in no clan, a small card with Start a clan. Then "Explore
 * clans", the page kit's table panel (page.css .pep-tpanel-*, .pep-rt-*):
 * the orders as pills, the warning, and the rows. A row reads across where
 * the panel has room - place, clan, members, who runs it, the 7D figure, the
 * action - and folds to three lines where it has not, with no sideways
 * scroll. "Room" is the panel's own width, not the window's (a container
 * query): the market sidebar changes it. The clan's name is the row's link,
 * stretched over the row, so Join stays a button of its own above it. Lime
 * is the brand's token only: Join, Start, the first place, one's own clan's
 * edge, focus. After social.css and page.css; built from shell.css's tokens.
 * No motion. page.css loads after this sheet, so what here
 * re-draws its pieces (a row's grid, a badge, a pill) names one class more. */
.pep-clan-list { display: grid; gap: 16px; min-width: 0; }
.pep-clan-back { margin: 0; font-size: 13px; }

/* Your clan: the kicker over the card; the crest and the words, the stats between hairlines, the way to it. */
.pep-clan-pinned { container: pep-clan-mine / inline-size; display: grid; gap: 12px; min-width: 0; padding: 16px 22px 18px; }
.pep-clan-pinned-kicker { margin: 0; color: var(--pep-text-2); font-size: 13px; font-weight: 700; }
/* The card's kicker in the brand's tracked capitals (sendit.css .pep-eyebrow, after this sheet), in cream, not lime. */
.pep-eyebrow.pep-clan-pinned-kicker { margin: 0; color: var(--pep-text-2); font-size: 12px; }
.pep-clan-pinned-kicker:focus { outline: none; }
/* sendit.css (after this sheet) gives every panel its hairline: the lime edge and glow name one class more. */
.pep-panel.pep-clan-mine {
  border-color: transparent;
  background: linear-gradient(90deg, color-mix(in srgb, var(--pep-brand) 9%, transparent), transparent 50%), var(--pep-panel);
  box-shadow: inset 3px 0 0 var(--pep-brand), inset 0 0 0 1px color-mix(in srgb, var(--pep-brand) 45%, transparent),
    0 0 28px color-mix(in srgb, var(--pep-brand) 14%, transparent);
}
.pep-clan-own-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 14px 22px;
  min-width: 0;
}
.pep-clan-own-card > .pep-clan-crest { width: 72px; height: 72px; }
.pep-clan-own-text { display: grid; gap: 6px; min-width: 0; }
.pep-clan-own-named { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; min-width: 0; }
.pep-clan-own-name { min-width: 0; overflow: hidden; color: var(--pep-text); font-size: 22px; font-weight: 800; letter-spacing: -0.01em; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.pep-clan-own-name:hover { color: var(--pep-text); text-decoration: underline; }
.pep-clan-own-text .pep-clan-on, .pep-clan-own-text .pep-clan-warm { font-size: 14px; }
.pep-badge.pep-clan-role { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; font-size: 12px; }
.pep-badge.pep-clan-role-owner { border-color: color-mix(in srgb, var(--pep-medal-1) 70%, transparent); color: var(--pep-medal-1); }
.pep-badge.pep-clan-role-moderator { color: var(--pep-text); }
.pep-clan-role-icon { width: 13px; height: 13px; fill: currentcolor; }
.pep-clan-pinned-facts { display: flex; align-items: center; margin: 0; }
.pep-clan-pinned-facts > div { display: grid; gap: 4px; min-width: 0; padding: 0 20px; }
.pep-clan-pinned-facts > div + div { border-left: 1px solid var(--pep-line); }
.pep-clan-pinned-facts dt { color: var(--pep-text-3); font-size: 12px; white-space: nowrap; }
.pep-clan-pinned-facts dd { margin: 0; font-size: 18px; font-weight: 800; white-space: nowrap; }
.pep-clan-pinned-owner dd { font-size: 14px; font-weight: 400; }
.pep-clan-pinned-owner .pep-trader { max-width: 220px; }
.pep-btn.pep-clan-own-go { min-height: 44px; padding: 0 20px; white-space: nowrap; }

/* A narrower card: the stats go under the words across the card, the way to it at the end of them. */
@container pep-clan-mine (max-width: 1099px) {
  .pep-clan-own-card { grid-template-columns: auto minmax(0, 1fr) auto; }
  .pep-clan-pinned-facts { grid-column: 1 / -1; grid-row: 2; flex-wrap: wrap; gap: 12px 0; }
  .pep-clan-pinned-facts > div:first-child { padding-left: 0; }
}
/* A phone: the crest beside the name, the stats two by two, who runs it across, the button across the card. */
@container pep-clan-mine (max-width: 559px) {
  .pep-clan-own-card { grid-template-columns: auto minmax(0, 1fr); gap: 14px; }
  .pep-clan-own-card > .pep-clan-crest { width: 56px; height: 56px; align-self: start; }
  .pep-clan-own-name { font-size: 19px; }
  .pep-clan-pinned-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .pep-clan-pinned-facts > div { padding: 10px 12px; border-radius: var(--pep-radius-sm); background: var(--pep-panel-2); }
  .pep-clan-pinned-facts > div + div { border-left: 0; }
  .pep-clan-pinned-facts > div:first-child { padding-left: 12px; }
  .pep-clan-pinned-owner { grid-column: 1 / -1; }
  .pep-clan-pinned-owner .pep-trader { max-width: 100%; }
  .pep-btn.pep-clan-own-go { grid-column: 1 / -1; width: 100%; }
}

/* In no clan: the line on the left, Start a clan and the way to the list on the right. */
.pep-clan-none { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; padding: 16px 22px; }
.pep-clan-none-words { display: grid; gap: 6px; min-width: 0; }
.pep-clan-none-line { margin: 0; color: var(--pep-text-2); font-size: 14px; }
.pep-clan-none-do { display: flex; flex-wrap: wrap; gap: 10px; }
.pep-clan-none > .pep-live { flex-basis: 100%; }

/* Explore clans: the orders under the panel's head, the warning with its glyph, the states. */
.pep-clans-explore { scroll-margin-top: 80px; min-width: 0; }
.pep-clans-explore .pep-tpanel { container: pep-clan-list / inline-size; }
.pep-clan-list-why { display: flex; align-items: center; gap: 10px; }
.pep-clan-list-why .pep-clan-name { font-weight: 800; }
.pep-clan-list-error { display: grid; gap: 10px; justify-items: start; }
.pep-clans-state { margin: 0; padding: 12px 4px; }
.pep-clans-blank { display: grid; gap: 10px; justify-items: start; padding: 18px 4px; }
.pep-clans-blank p { margin: 0; }
.pep-clan-list-more { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0; }
.pep-clan-list-cap { margin: 0; font-size: 13px; }
.pep-clans-foot-note { display: inline-flex; align-items: center; gap: 8px; }
.pep-clans-foot-icon { flex: none; width: 16px; height: 16px; fill: none; stroke: currentcolor; stroke-width: 1.4; stroke-linecap: round; }
.pep-clans-how { margin: 0; }
.pep-clans-how .pep-how-body p { margin: 0 0 8px; }

/* The rows, a phone's first: the place, then the clan across; the members and the figure; who runs it and the
   action. The column names wait for a wider panel. */
.pep-clan-dir { min-width: 0; }
.pep-clan-dir .pep-clan-dir-head { display: none; }
.pep-clan-dir .pep-clan-dir-row {
  grid-template-columns: 34px minmax(0, 1fr) auto;
  grid-template-areas: "place who who" "place members pnl" "place owner do";
  gap: 6px 10px;
  padding: 12px 8px;
  font-size: 14px;
}
.pep-clan-dir .pep-clan-dir-row .pep-trader::after { content: none; }
.pep-clan-dir-place { grid-area: place; align-self: start; padding-top: 5px; color: var(--pep-text-3); font-size: 15px; font-weight: 800; white-space: nowrap; }
.pep-clan-dir-first { color: var(--pep-brand); }
.pep-clan-dir-who { grid-area: who; display: flex; align-items: center; gap: 12px; min-width: 0; }
.pep-clan-dir-row .pep-clan-crest-sm { flex: none; width: 34px; height: 34px; }
.pep-clan-dir-named { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-width: 0; font-size: 15px; }
.pep-clan-dir-link { min-width: 0; max-width: 100%; overflow: hidden; color: var(--pep-text); font-weight: 700; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.pep-clan-dir-link::after { content: ""; position: absolute; inset: 0; border-radius: var(--pep-radius-sm); }
.pep-clan-dir-link:hover { color: var(--pep-text); text-decoration: underline; }
.pep-clan-dir-link:focus-visible { outline: none; }
.pep-clan-dir-link:focus-visible::after { outline: 2px solid var(--pep-brand); outline-offset: -2px; }
.pep-clan-dir-members { grid-area: members; display: inline-flex; align-items: center; gap: 8px; color: var(--pep-text-2); white-space: nowrap; }
.pep-clan-dir-icon { flex: none; width: 16px; height: 16px; fill: none; stroke: currentcolor; stroke-width: 1.4; stroke-linecap: round; }
.pep-clan-dir-owner { grid-area: owner; min-width: 0; }
.pep-clan-dir-owner .pep-trader { max-width: 100%; }
.pep-clan-dir-pnl { grid-area: pnl; justify-self: end; font-size: 15px; font-weight: 800; white-space: nowrap; }
.pep-clan-dir-do { position: relative; z-index: 1; grid-area: do; display: flex; align-items: center; justify-content: flex-end; gap: 10px; min-width: 0; }
.pep-clan-dir-join { display: grid; justify-items: end; }
.pep-clan-dir-join .pep-btn { white-space: nowrap; }
.pep-clan-dir-why { color: var(--pep-text-3); font-size: 12px; font-weight: 600; white-space: nowrap; }
.pep-clan-dir-do .pep-btn.pep-pill-go { min-height: 30px; padding: 0 12px; font-size: 12px; }

/* A panel with room: one line per clan, under the column names. */
@container pep-clan-list (min-width: 720px) {
  .pep-clan-dir .pep-clan-dir-head,
  .pep-clan-dir .pep-clan-dir-row {
    display: grid;
    grid-template-columns: 52px minmax(0, 1.5fr) 96px minmax(0, 1.15fr) minmax(104px, max-content) minmax(132px, max-content);
    grid-template-areas: "place who members owner pnl do";
    gap: 14px;
  }
  .pep-clan-dir .pep-clan-dir-row { padding: 10px 12px; }
  .pep-clan-dir-place { align-self: center; padding-top: 0; }
  .pep-clan-dir-head > .pep-clan-dir-pnl-h { text-align: left; }
  .pep-clan-dir-pnl { justify-self: start; }
  .pep-clan-dir-do .pep-btn.pep-pill-go { min-height: 34px; padding: 0 16px; font-size: 13px; }
}

/* ------------------------------------------------- round 15, a clan's own page
 * The tag beside a name everywhere ([PKL]: small capitals in a quiet frame,
 * never the lime), a clan's picture where its crest would be (the same box,
 * cropped square, rounded), the new clan's page (/c/new/: the form, and its
 * live card on the right where there is room, under the form on a phone), the
 * clan page's bio and way in, who runs it's tools (settings, picture,
 * invites, requests) and the viewer's own invites and requests on /c/. The
 * lime stays Join, Start and focus: a choice that is on is marked by a line
 * and a tint of the panel, never by the lime. No motion. */
.pep-clan-tag {
  display: inline-flex; flex: none; align-items: center; padding: 0 5px; border: 1px solid var(--pep-line-strong);
  border-radius: 6px; color: var(--pep-text-2); font-size: 0.78em; font-weight: 800; letter-spacing: 0.04em;
  line-height: 1.5; vertical-align: 0.1em; white-space: nowrap;
}
.pep-clan-pic { object-fit: cover; border-radius: 22%; background: var(--pep-panel-2); box-shadow: 0 0 0 1px var(--pep-line-strong); }
.pep-clan-crest-sm.pep-clan-pic { border-radius: 6px; }
.pep-clan-pending { color: var(--pep-text); font-size: 13px; font-weight: 700; }

/* The new clan's page. */
.pep-clan-new { container: pep-clan-new / inline-size; display: grid; gap: 16px; min-width: 0; }
.pep-clan-new-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; }
.pep-clan-new-form { display: grid; gap: 18px; min-width: 0; margin: 0; }
.pep-clan-new-row { display: grid; gap: 6px; min-width: 0; margin: 0; padding: 0; border: 0; }
.pep-clan-new-row > p, .pep-clan-mode > p, .pep-clan-new-form > p { margin: 0; font-size: 13px; }
.pep-clan-new-form .pep-input,
.pep-clan-manage .pep-input,
.pep-clan-ask-form .pep-input,
.pep-clan-invite .pep-input {
  padding: 10px 12px; border: 1px solid var(--pep-line); border-radius: var(--pep-radius-sm); background: var(--pep-ground);
  font-size: 15px; font-weight: 600;
}
.pep-clan-new-form .pep-input:focus-visible,
.pep-clan-manage .pep-input:focus-visible,
.pep-clan-ask-form .pep-input:focus-visible,
.pep-clan-invite .pep-input:focus-visible { outline: 2px solid var(--pep-brand); outline-offset: 1px; }
.pep-clan-tag-field { gap: 6px; }
.pep-clan-tag-edge { color: var(--pep-text-3); font-size: 18px; font-weight: 700; }
.pep-clan-tag-field .pep-clan-tag-input { flex: 0 1 140px; max-width: 140px; padding-right: 12px; letter-spacing: 0.08em; }
.pep-clan-tag-field .pep-clan-start-count { position: static; margin-left: 4px; }
.pep-clan-bio-field { align-items: stretch; }
.pep-clan-bio-input { resize: vertical; min-height: 76px; line-height: 1.45; font-weight: 500; }
.pep-clan-bio-field .pep-clan-start-count { top: auto; bottom: 8px; }
.pep-clan-new-pic { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 14px; min-width: 0; }
.pep-clan-pick { display: grid; gap: 4px; min-width: 0; flex: 1 1 220px; }
.pep-clan-pick-do { display: flex; flex-wrap: wrap; gap: 8px; }
.pep-clan-pick p { margin: 0; font-size: 12px; }
.pep-clan-limit { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pep-clan-limit-range { flex: 1; min-width: 0; accent-color: var(--pep-text-2); }
.pep-clan-limit .pep-clan-limit-n { flex: none; width: 84px; text-align: right; }
.pep-clan-mode { display: grid; gap: 10px; min-width: 0; margin: 0; padding: 0; border: 0; }
.pep-clan-mode-choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 8px; }
.pep-clan-mode-choice {
  display: flex; gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid var(--pep-line); border-radius: var(--pep-radius-sm);
  background: var(--pep-panel); cursor: pointer;
}
.pep-clan-mode-choice.pep-is-on { border-color: var(--pep-line-strong); background: var(--pep-panel-hover); }
.pep-clan-mode-choice input { margin-top: 3px; accent-color: var(--pep-text); }
.pep-clan-mode-choice:focus-within { outline: 2px solid var(--pep-brand); outline-offset: 2px; }
.pep-clan-mode-text { display: grid; gap: 2px; font-size: 14px; }
.pep-clan-mode-text .pep-faint { font-size: 12px; }
.pep-clan-switch { position: relative; display: inline-flex; align-items: center; gap: 10px; width: fit-content; font-size: 14px; font-weight: 600; cursor: pointer; }
.pep-clan-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.pep-clan-switch-track {
  position: relative; display: block; flex: none; width: 38px; height: 22px; border: 1px solid var(--pep-line-strong);
  border-radius: var(--pep-radius-pill); background: var(--pep-panel-2);
}
.pep-clan-switch-knob { position: absolute; top: 3px; left: 3px; width: 14px; height: 14px; border-radius: 50%; background: var(--pep-text-3); }
.pep-clan-switch input:checked + .pep-clan-switch-track { background: var(--pep-panel-hover); }
.pep-clan-switch input:checked + .pep-clan-switch-track .pep-clan-switch-knob { left: 19px; background: var(--pep-text); }
.pep-clan-switch input:focus-visible + .pep-clan-switch-track { outline: 2px solid var(--pep-brand); outline-offset: 2px; }
.pep-clan-switch.pep-is-moot { color: var(--pep-text-3); }
.pep-clan-new-wait { align-self: center; margin-left: 10px; font-size: 13px; }
.pep-clan-new-preview { display: grid; gap: 8px; min-width: 0; }
.pep-clan-new-preview > p { margin: 0; font-size: 12px; }
.pep-clan-new-preview-kicker { color: var(--pep-text-2); font-weight: 700; }
.pep-clan-made-panel { display: grid; gap: 10px; }
.pep-clan-made-text { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 6px; min-width: 0; }
.pep-clan-made-link { font-size: 18px; font-weight: 800; }
@container pep-clan-new (min-width: 860px) {
  .pep-clan-new-grid { grid-template-columns: minmax(0, 1fr) 320px; }
  .pep-clan-new-preview { position: sticky; top: calc(var(--pep-top-h) + 16px); }
}

/* A clan's card: the new clan's preview. */
.pep-clan-card {
  display: grid; gap: 12px; padding: 16px; border: 1px solid var(--pep-line-strong); border-radius: var(--pep-radius);
  background: var(--pep-panel-2);
}
.pep-clan-card-top { display: flex; align-items: center; gap: 14px; min-width: 0; }
.pep-clan-card-head { display: grid; gap: 4px; min-width: 0; }
.pep-clan-card-name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 6px; margin: 0; font-size: 20px; font-weight: 800; overflow-wrap: anywhere; }
.pep-clan-card-way { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0; font-size: 13px; }
.pep-clan-card-bio { margin: 0; font-size: 14px; line-height: 1.45; white-space: pre-line; overflow-wrap: anywhere; }
.pep-clan-card-runs { margin: 0; font-size: 12px; }
.pep-clan-card-preview { box-shadow: 0 0 0 1px var(--pep-line); }
.pep-clan-way {
  padding: 2px 8px; border: 1px solid var(--pep-line-strong); border-radius: var(--pep-radius-pill); color: var(--pep-text-2);
  font-size: 12px; font-weight: 700;
}
.pep-clan-way-invite { color: var(--pep-text); }

/* The clan page: its bio, the request's form, who runs it's tools. */
.pep-clan-bio { max-width: 64ch; margin: 0; font-size: 15px; line-height: 1.5; white-space: pre-line; overflow-wrap: anywhere; }
.pep-clan-ask-form { display: grid; gap: 8px; justify-items: start; }
.pep-clan-ask-form .pep-input { width: 100%; }
.pep-clan-ask-form p { margin: 0; font-size: 12px; }
.pep-clan-manage { display: grid; }
.pep-clan-manage > .pep-live { margin: 0; }
.pep-clan-manage > .pep-live:not(:empty) { margin-top: 12px; }
/* Round 22: the panel is a fold, closed on arrival: its summary is its heading, what waits, and the site's + or -. */
.pep-clan-manage-sum {
  position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 32px; padding-right: 32px;
  list-style: none; cursor: pointer;
}
.pep-clan-manage-sum::-webkit-details-marker { display: none; }
.pep-clan-manage-sum::after {
  content: "+"; position: absolute; top: 50%; right: 4px; transform: translateY(-50%); color: var(--pep-text-3); font-size: 20px;
  line-height: 1;
}
.pep-clan-manage-fold[open] > .pep-clan-manage-sum::after { content: "\2212"; }
.pep-clan-manage-sum:hover::after { color: var(--pep-text); }
.pep-clan-manage-sum:focus-visible { outline: 2px solid var(--pep-brand); outline-offset: 4px; border-radius: var(--pep-radius-sm); }
.pep-clan-manage-sum .pep-panel-title { margin: 0; }
.pep-clan-manage-wait { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.pep-clan-manage-wait-pill {
  padding: 1px 8px; border-radius: var(--pep-radius-pill); background: var(--pep-panel-hover); color: var(--pep-text-2); font-size: 12px;
  font-weight: 700;
}
.pep-clan-manage-wait-pill.pep-is-hot { background: color-mix(in srgb, var(--pep-brand) 22%, var(--pep-panel-2)); color: var(--pep-text); }
.pep-clan-manage-body { display: grid; gap: 16px; margin-top: 14px; }
.pep-clan-manage-body > p { margin: 0; }
.pep-clan-manage-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.pep-clan-manage-part { display: grid; gap: 8px; align-content: start; min-width: 0; }
.pep-clan-manage-part > p { margin: 0; font-size: 13px; }
.pep-clan-manage-h { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 15px; font-weight: 800; }
.pep-clan-manage-do { display: flex; flex-wrap: wrap; gap: 8px; }
.pep-clan-count-pill { padding: 0 7px; border-radius: var(--pep-radius-pill); background: var(--pep-panel-hover); font-size: 12px; }
.pep-clan-invite { display: grid; gap: 6px; min-width: 0; }
.pep-clan-invite-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-start; }
.pep-clan-invite-row .pep-input { flex: 1 1 220px; }
.pep-clan-invite-who { min-height: 28px; font-size: 13px; }
.pep-clan-invite-found { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.pep-clan-asks { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.pep-clan-ask-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: 10px 0; border-bottom: 1px solid var(--pep-line);
  font-size: 14px;
}
.pep-clan-ask-row > .pep-faint, .pep-clan-ask-by { font-size: 12px; }
.pep-clan-ask-request { align-items: flex-start; }
.pep-clan-ask-who { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; min-width: 0; }
.pep-clan-ask-message { flex-basis: 100%; margin: 0; color: var(--pep-text-2); white-space: pre-line; overflow-wrap: anywhere; }
.pep-clan-ask-btns, .pep-clan-ask-do { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.pep-clan-asks-panel { display: grid; gap: 10px; }
.pep-clan-asks-panel .pep-clan-pinned-kicker:focus { outline: none; }
.pep-clan-ask-card { display: inline-flex; align-items: center; gap: 10px; min-width: 0; }
.pep-clan-ask-card-text { display: grid; gap: 2px; min-width: 0; }
.pep-clan-ask-card-text .pep-faint { font-size: 12px; }
.pep-clan-ask-card .pep-clan-crest-sm { width: 28px; height: 28px; }
/* Round 15, moderators: the Moderator badge beside the Owner's (social.css .pep-clan-owner), the owner's Members with
   Make moderator / Remove moderator, and the moderation log (newest first, never a message's words). */
.pep-clan-mod { border-color: var(--pep-line); background: var(--pep-panel-hover); color: var(--pep-text-2); }
.pep-clan-mod-row .pep-clan-ask-who { align-items: center; }
.pep-clan-log { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.pep-clan-log-row {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; padding: 8px 0;
  border-bottom: 1px solid var(--pep-line); font-size: 13px;
}
.pep-clan-log-text { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; min-width: 0; overflow-wrap: anywhere; }
.pep-clan-log-when { font-size: 12px; white-space: nowrap; }
/* Round 15, mutes: a member's "..." button at the far right of its row (MemberMenu: its role, a mute, a kick), the
   menu's own parts (chat.css's .pep-chat-menu draws the rest), the Muted badge, and a muted member's composer in the
   clan's chat (MutedComposer: one line, the box disabled). */
.pep-member-more {
  display: inline-grid;
  flex: none;
  place-items: center;
  width: 32px;
  height: 32px;
  margin-left: auto;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--pep-text-3);
  cursor: pointer;
}
.pep-member-more:hover,
.pep-member-more[aria-expanded="true"] { background: var(--pep-panel-hover); color: var(--pep-text); }
.pep-member-more:focus-visible { outline: 2px solid var(--pep-brand); outline-offset: 1px; }
@media (pointer: coarse) {
  .pep-member-more { width: 44px; height: 44px; }
}
.pep-member-menu-group { display: grid; gap: 2px; }
.pep-member-menu-label { margin: 2px 10px 2px; color: var(--pep-text-3); font-size: 12px; font-weight: 700; letter-spacing: 0.02em; }
.pep-member-menu-full { margin-left: auto; color: var(--pep-text-3); font-size: 12px; }
.pep-member-menu-note { margin: 0; color: var(--pep-text-2); font-size: 13px; line-height: 1.4; }
.pep-member-menu-kick { color: var(--pep-danger); }
.pep-member-menu-kick .pep-chat-menu-icon { color: var(--pep-danger); }
.pep-clan-muted { border-color: var(--pep-warn); color: var(--pep-warn); font-weight: 600; }
.pep-chat-muted-note { margin: 0; color: var(--pep-text-2); font-size: 13px; }
.pep-chat-muted .pep-chat-box:disabled { cursor: not-allowed; }