/* Community Source Wall · source selector and shared vinyl comparison.
   All values come from the existing anonymous snapshot, never extra fetches. */
.community-source-panel{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;
  margin:21px 0 18px;padding:22px 24px;border:3px solid #797f88;border-radius:25px;
  background:
    radial-gradient(ellipse at 25% -15%,#444a57,#23262e 58%,#171a20 100%);
  box-shadow:inset 0 8px 9px #ffffff18,inset 0 -12px 16px #0007,0 16px 25px #0006;
  position:relative;
}
.community-source-panel::before,.participation-panel::before{
  content:"";position:absolute;inset:8px;border:2px dashed #a6aeb44b;
  border-radius:17px;pointer-events:none;
}
.community-source-copy{flex:1 1 260px;position:relative}
.community-source-copy h2,.participation-title h2{
  margin:3px 0 6px;font:900 clamp(26px,4vw,43px)/.98 Impact,"Arial Narrow",sans-serif;
  letter-spacing:.008em;color:#f6f7fb;
}
.community-source-copy h2 em,.participation-title h2 em{color:#ffe557;font-style:normal}
.community-source-copy p{margin:6px 0 0;color:#c4c7d2;font-size:13px;max-width:440px}
.source-control{
  flex:0 1 auto;display:flex;flex-wrap:nowrap;gap:5px;
  padding:6px;border:2px solid #8d949f;border-radius:17px;
  box-shadow:inset 0 4px 7px #000b;background:#0e1218;position:relative;
}
.source-control button{
  min-height:45px;padding:9px 16px;border:0;border-radius:11px;
  color:#d9dee9;background:transparent;
  font:900 clamp(12px,1.8vw,16px)/1 Impact,"Arial Narrow",sans-serif;
  letter-spacing:.035em;cursor:pointer;transition:background-color .18s,color .18s,transform .18s;
}
.source-control button:hover{background:#444956;color:#fff}
.source-control button.active{
  color:#111316;background:#ffe557;
  transform:translateY(-1px);
  box-shadow:inset 0 2px 1px #ffffff9e,0 3px 9px #000a;
}
.source-control button:focus-visible{outline:3px solid #ff7fa0;outline-offset:3px}
.source-coverage-note{
  width:100%;margin:0;position:relative;
  padding:9px 12px;border-left:4px solid #9bf369;
  color:#d4d8e2;background:#161a229c;border-radius:4px 10px 10px 4px;
  font-size:12px;font-weight:750;
}
.source-coverage-note.is-partial{border-left-color:#ffae66;color:#ffe6c8}
.community-metric-grid{margin-bottom:18px}
.community-metric-grid .metric-card{min-width:0}
.participation-panel{
  position:relative;margin:0 0 32px;padding:23px 25px 24px;
  border:3px solid #7b808b;border-radius:25px;
  background:
    radial-gradient(ellipse at top left,#343a44,#1a1e27 65%,#11151c);
  box-shadow:inset 0 8px 12px #ffffff1e,inset 0 -12px 15px #000a,0 14px 23px #0008;
  overflow:hidden;
}
.participation-title,.participation-stats,.participation-split,.participation-note{position:relative;z-index:1}
.participation-title{display:flex;align-items:end;justify-content:space-between;flex-wrap:wrap;gap:9px}
.participation-title .section-kicker{width:100%}
.participation-sticker{
  display:inline-block;background:#ff7fa0;color:#161217;
  font:900 12px/1 Impact,"Arial Narrow",sans-serif;
  padding:8px 12px;transform:rotate(3deg);border:2px dashed #801d42;border-radius:9px;
  box-shadow:0 5px 8px #0009;
}
.participation-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin:20px 0 15px}
.participation-stats>div{
  min-width:0;padding:15px;border-radius:14px;border:2px solid #acb0b4;
  background:#e7e9f0;color:#121519;
  box-shadow:inset 0 4px 5px #fff,0 5px 8px #0007;
}
.participation-stats>div:last-child{background:#fff3a0;border-color:#e8c542}
.participation-stats span{display:block;font:900 13px Impact,"Arial Narrow",sans-serif;letter-spacing:.025em}
.participation-stats strong{display:block;font:900 clamp(27px,4vw,52px) Impact,"Arial Narrow",sans-serif;line-height:1.1}
.participation-stats small{display:block;font:750 11px system-ui,sans-serif;color:#4a4d58}
.participation-split{
  display:flex;overflow:hidden;min-height:28px;
  border:2px solid #b7bbc6;border-radius:11px;
  background:repeating-linear-gradient(90deg,#b1b4bd23 0 2px,#343a45 2px 6px);
  box-shadow:inset 0 3px 8px #000b,0 4px 8px #0008;
}
.participation-split span{display:block;transition:width .5s ease-out;min-width:0}
#participation-group-bar{background:linear-gradient(180deg,#ffb4c7,#ff7fa0 50%,#c83c66)}
#participation-solo-bar{background:linear-gradient(180deg,#fff4b0,#ffe557 50%,#d3b039)}
.participation-note{margin:11px 0 0;color:#c9cbd4;font-size:12px;font-weight:700}
.source-history-note{margin:10px 0 0;color:#c9cbd4;font-size:11px;font-weight:750}
[data-community-source]:disabled{opacity:.55;cursor:not-allowed}
[data-metric="crews"]:disabled,[data-board-metric="crews"]:disabled,
[data-pump-metric="crews"]:disabled,[data-battle-metric="crews"]:disabled{
  opacity:.45;cursor:not-allowed;filter:grayscale(.45);
}
@media(max-width:700px){
  .community-source-panel,.participation-panel{padding:17px 15px}
  .source-control{width:100%;flex:1 1 100%}
  .source-control button{flex:1 1 0;min-width:0;padding:9px 7px}
  .community-source-copy p{font-size:12px}
  .participation-stats{gap:9px;margin:14px 0 12px}
  .participation-stats>div{padding:12px 10px}
  .participation-sticker{font-size:10px}
  .community-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(prefers-reduced-motion:reduce){
  .source-control button,.participation-split span{transition:none!important}
}