/* Scoped adaptation of the supplied Bang prototype; no global theme overrides. */
.bcm { --bcm-blue:#4d6be8; --bcm-soft:#eef0fc; max-width:960px; margin:0 auto; padding:24px 20px 60px; color:var(--bcm-blue); font-family:Roboto,Arial,sans-serif; font-size:18px; line-height:1.5; }
.bcm-page { width:100%; clear:both; padding-top:1rem; }
.bcm *, .bcm-contact-summary { box-sizing:border-box; }
.bcm [hidden] { display:none !important; }
.bcm h2,.bcm h3,.bcm h4 { font-family:Montserrat,'Arial Black',Arial,sans-serif; text-transform:uppercase; font-weight:900; color:inherit; line-height:1.1; }
.bcm-intro { padding:10px 0 30px; }
.bcm-intro h2 { font-size:clamp(38px,8vw,76px); margin:18px 0 20px; }
.bcm-intro p { max-width:68ch; margin:0 0 14px; font-weight:300; }
.bcm button, .bcm-actions a, .bcm-shortlist > a { border:2px solid var(--bcm-blue); border-radius:99px; background:transparent; color:inherit; padding:10px 22px; font:inherit; line-height:1.3; min-height:44px; cursor:pointer; text-decoration:none; }
.bcm button:hover,.bcm button[aria-pressed=true] { background:var(--bcm-blue); color:white; }
.bcm button:focus-visible,.bcm a:focus-visible { outline:3px solid #a74300; outline-offset:4px; }
.bcm a { color:inherit; text-underline-offset:.15em; }
.bcm-filter-bar { display:flex; gap:6px; align-items:center; min-width:0; margin:0 0 12px; }
.bcm-filters { display:flex; flex:1; gap:8px; min-width:0; overflow-x:auto; overscroll-behavior-x:contain; padding:6px 4px 14px; scrollbar-width:thin; scrollbar-color:var(--bcm-blue) var(--bcm-soft); }
.bcm-filters button { flex:0 0 auto; font-size:15px; padding:8px 18px; white-space:nowrap; }
.bcm-filter-bar > button { flex:0 0 auto; padding:4px; min-width:36px; font-size:16px; }
.bcm .bcm-filter-pause { min-width:30px; }
.bcm-status { min-height:1.5em; margin:0 0 14px; font-size:14px; }
.bcm-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:14px; }
.bcm-card { background:white; border:2px solid var(--bcm-blue); border-radius:22px; padding:16px; display:flex; flex-direction:column; align-items:flex-start; overflow-wrap:anywhere; }
.bcm-card h3 { font-size:14px; line-height:1.25; margin:0 0 4px; }
.bcm-card h3 a { text-decoration:none; }
.bcm-card > p:not(.bcm-tags) { font-size:12px; line-height:1.3; margin:0 0 8px; }
.bcm-avatar { width:46px; height:46px; min-width:46px; border-radius:50%; object-fit:cover; display:block; margin:0 0 10px; background:var(--bcm-blue); color:white; }
.bcm-initials { display:grid; place-items:center; font-size:15px; font-weight:800; text-transform:uppercase; }
.bcm-tags { display:flex; flex-wrap:wrap; gap:5px; margin:0; padding:10px 0 0; }
.bcm-tags span { background:var(--bcm-soft); border-radius:99px; font-size:11px; padding:3px 10px; color:var(--bcm-blue); }
.bcm-card .bcm-tags { margin-top:auto; }
.bcm-card .bcm-select { font-size:12px; margin:12px 0 0; padding:7px 12px; width:100%; }
.bcm-card.bcm-is-selected { background:var(--bcm-blue); color:white; }
.bcm-card.bcm-is-selected .bcm-select { border-color:white; }
.bcm-selected { background:var(--bcm-blue); color:white; padding:28px; margin:0 0 36px; border-radius:0; scroll-margin-top:16px; }
.bcm-selected-top { display:flex; align-items:center; gap:16px; }
.bcm-selected-top .bcm-avatar { width:88px; height:88px; min-width:88px; margin:0; background:white; color:var(--bcm-blue); }
.bcm-selected h3 { font-size:clamp(28px,5vw,48px); margin:0; }
.bcm-selected h4 { font-size:14px; margin:28px 0 0; }
.bcm-selected > p { max-width:65ch; }
.bcm-selected > button { margin:0 0 20px; }
.bcm-selected > button:last-of-type { margin:24px 0 0; }
.bcm-selected button,.bcm-selected .bcm-actions a { border-color:white; color:white; }
.bcm-selected button:hover,.bcm-selected button[aria-pressed=true] { background:white; color:var(--bcm-blue); }
.bcm-selected .bcm-tags span { background:rgba(255,255,255,.2); color:white; }
.bcm-role { font-size:14px; margin:10px 0; }
.bcm-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:16px 0 22px; }
.bcm-actions button:first-child { background:white; color:var(--bcm-blue); }
.bcm-matches { padding:0; list-style:none; margin:10px 0; }
.bcm-matches > li { display:flex; align-items:center; gap:12px; border-top:1px solid rgba(255,255,255,.35); padding:14px 0; }
.bcm-matches > li > div { flex:1; min-width:0; }
.bcm-matches .bcm-avatar { margin:0; }
.bcm-matches strong { font-size:14px; font-family:Montserrat,Arial,sans-serif; text-transform:uppercase; }
.bcm-matches p { font-size:13px; margin:3px 0; }
.bcm-matches > li > button { padding:8px 14px; font-size:14px; }
.bcm-matches a { font-size:13px; }
.bcm-shortlist { position:sticky; bottom:12px; z-index:5; border:2px solid var(--bcm-blue); border-radius:22px; background:white; padding:14px 20px; margin:24px 0; box-shadow:0 4px 18px #0002; }
.bcm-shortlist h3 { font-size:18px; margin:0 0 10px; }
.bcm-shortlist ul { padding:0; list-style:none; }
.bcm-shortlist li { display:flex; justify-content:space-between; gap:8px; align-items:center; margin:6px 0; font-size:14px; }
.bcm-shortlist li button { padding:5px 10px; font-size:12px; }
.bcm .bcm-shortlist > a { display:inline-block; background:var(--bcm-blue); color:white; }
.bcm-contact-summary { border:1px solid #777; border-radius:12px; padding:1rem; margin-bottom:1.5rem; background:#fafafa; color:#171717; }
@media(max-width:520px) { .bcm { padding:14px 12px 40px; } .bcm-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .bcm-card { padding:12px; } .bcm-selected { padding:20px 14px; } .bcm-matches > li { display:grid; grid-template-columns:46px minmax(0,1fr); align-items:start; } .bcm-matches > li > button { grid-column:2; justify-self:start; width:100%; max-width:100%; min-width:0; margin-left:0; white-space:normal; overflow-wrap:anywhere; } .bcm-selected-top { align-items:flex-start; } .bcm-selected-top .bcm-avatar { width:58px; height:58px; min-width:58px; } }
@media(prefers-reduced-motion:reduce) { .bcm * { scroll-behavior:auto !important; } }

.bcm-nickname { overflow-wrap:anywhere; font-weight:400; text-transform:none; }
.bcm-selected-top > div { min-width:0; }
.bcm-selected-top .bcm-nickname { margin:8px 0 0; font-size:16px; }
.bcm-bio { max-width:65ch; overflow-wrap:anywhere; }
.bcm-bio p { margin:16px 0; }