/* BC XP — Frontend Skin (brand: dark navy + teal)
   Works with existing shortcode markup:
   .bcxp-leaderboard, .bcxp-weekly-quests, .bcxp-quest, .bcxp-quests,
   .bcxp-profile-card, .bcxp-badges, .bcxp-referral,
   .bcxp-clan-leaderboard, .bcxp-clan-card, .bcxp-recent-activity,
   .bcxp-share-banner (prediction/tipster share CTA)
*/

/* ---------- Tokens ---------- */
:root{
  /* Brand from screenshot */
  --bcxp-brand-navy:#34495e;            /* rgb(52,73,94) */
  --bcxp-brand-navy-700:#2f4357;        /* deeper edge */
  --bcxp-brand-navy-600:#31465a;        /* mid */
  --bcxp-brand-teal:#60d5bd;            /* rgb(96,213,189) */
  --bcxp-brand-teal-weak:#e9fbf6;       /* very light teal */

  /* UI system */
  --bcxp-bg:#ffffff;
  --bcxp-surface:#ffffff;
  --bcxp-muted:#f7f9fc;
  --bcxp-text:#111827;
  --bcxp-muted-text:#4b5563;
  --bcxp-primary:var(--bcxp-brand-teal);
  --bcxp-primary-weak:var(--bcxp-brand-teal-weak);
  --bcxp-success:#16a34a;
  --bcxp-warning:#f59e0b;
  --bcxp-danger:#dc2626;
  --bcxp-border:#d9dee7;
  --bcxp-radius:12px;
  --bcxp-shadow:0 10px 20px rgba(0,0,0,.05),0 2px 6px rgba(0,0,0,.05);
  --bcxp-font:system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,Cantarell,Noto Sans,"Helvetica Neue",Arial,"Apple Color Emoji","Segoe UI Emoji";
}

@media (prefers-color-scheme:dark){
  :root{
    --bcxp-bg:#0b0e13;
    --bcxp-surface:#0f141b;
    --bcxp-muted:#121924;
    --bcxp-text:#e5e7eb;
    --bcxp-muted-text:#b8c0cc;
    --bcxp-primary:var(--bcxp-brand-teal);
    --bcxp-primary-weak:#0f201d;
    --bcxp-success:#34d399;
    --bcxp-warning:#fbbf24;
    --bcxp-danger:#f87171;
    --bcxp-border:#243244;
    --bcxp-shadow:none;
  }
}

/* Base font & color safety */
.bcxp-reset,
.bcxp-leaderboard,
.bcxp-weekly-quests,
.bcxp-quests,
.bcxp-profile,
.bcxp-profile-card,
.bcxp-badges,
.bcxp-referral,
.bcxp-clan-leaderboard,
.bcxp-clan-card,
.bcxp-recent-activity{
  font-family:var(--bcxp-font);
  color:var(--bcxp-text);
  font-size:16.5px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Links */
.bcxp-leaderboard a,
.bcxp-weekly-quests a,
.bcxp-quests a,
.bcxp-profile a,
.bcxp-badges a,
.bcxp-referral a,
.bcxp-clan-card a{ color:var(--bcxp-primary); text-decoration:none; }
.bcxp-leaderboard a:hover,
.bcxp-weekly-quests a:hover,
.bcxp-quests a:hover,
.bcxp-profile a:hover,
.bcxp-badges a:hover,
.bcxp-referral a:hover,
.bcxp-clan-card a:hover{ text-decoration:underline; }

/* ---------- Cards ---------- */
.bcxp-card,
.bcxp-profile,
.bcxp-profile-card,
.bcxp-weekly-quests .bcxp-quest,
.bcxp-clan-card,
.bcxp-badges .bcxp-badge,
.bcxp-referral,
.bcxp-recent-activity li,
.bcxp-empty{
  background:var(--bcxp-surface);
  border:1px solid var(--bcxp-border);
  color: var(--bcxp-text);
  border-radius:var(--bcxp-radius);
  box-shadow:var(--bcxp-shadow);
}

.bcxp-section-title{ font-weight:700; margin:.25rem 0 .75rem; }

/* ---------- Leaderboard ---------- */
table.bcxp-leaderboard{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border-radius:var(--bcxp-radius);
  background:var(--bcxp-surface);
  box-shadow:var(--bcxp-shadow);
  border:1px solid var(--bcxp-border);
}
.bcxp-leaderboard thead th{
  text-align:left;
  font-weight:700;
  background:var(--bcxp-muted);
  color:var(--bcxp-muted-text);
  border-bottom:1px solid var(--bcxp-border);
  padding:.8rem 1rem;
}
.bcxp-leaderboard tbody td{
  padding:.85rem 1rem;
  border-bottom:1px solid var(--bcxp-border);
  color:var(--bcxp-text);
}
.bcxp-leaderboard tbody tr:nth-child(odd){ background:rgba(0,0,0,.015); }
@media (prefers-color-scheme:dark){
  .bcxp-leaderboard tbody tr:nth-child(odd){ background:rgba(255,255,255,.03); }
}
.bcxp-leaderboard tbody tr:last-child td{ border-bottom:0; }
.bcxp-leaderboard tbody tr:hover{ background:var(--bcxp-primary-weak); transition:background .18s ease; }

/* Mobile: table -> cards */
@media (max-width:640px){
  .bcxp-leaderboard thead{ display:none; }
  .bcxp-leaderboard,
  .bcxp-leaderboard tbody,
  .bcxp-leaderboard tr,
  .bcxp-leaderboard td{ display:block; width:100%; }
  .bcxp-leaderboard tr{
    border:1px solid var(--bcxp-border);
    border-radius:var(--bcxp-radius);
    margin-bottom:.75rem;
    background:var(--bcxp-surface);
    box-shadow:var(--bcxp-shadow);
  }
  .bcxp-leaderboard td{ border-bottom:1px dashed var(--bcxp-border); }
  .bcxp-leaderboard td:last-child{ border-bottom:0; }
  .bcxp-leaderboard td::before{
    content:attr(data-th);
    font-weight:600;
    display:block;
    color:var(--bcxp-muted-text);
    margin-bottom:.25rem;
  }
}

/* ---------- Weekly Quests ---------- */
.bcxp-weekly-quests{ display:grid; gap:.75rem; }
.bcxp-weekly-quests .bcxp-quest{ padding:.9rem 1rem; }
.bcxp-weekly-quests .bcxp-quest strong{ font-weight:700; }
.bcxp-weekly-quests .bcxp-quest small{ color:var(--bcxp-muted-text); }
.bcxp-weekly-quests .bcxp-quest .bcxp-status{
  margin-top:.4rem; display:inline-flex; gap:.4rem; align-items:center; font-size:.9rem;
}
.bcxp-chip{
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.2rem .5rem; border-radius:999px; font-size:.85rem;
  background:var(--bcxp-primary-weak); color:var(--bcxp-primary);
}
.bcxp-chip.success{ background:rgba(22,163,74,.12); color:var(--bcxp-success); }
.bcxp-chip.warn{ background:rgba(245,158,11,.12); color:var(--bcxp-warning); }

/* ---------- Badges ---------- */
.bcxp-badges{ display:flex; flex-wrap:wrap; gap:.75rem; }
.bcxp-badges .bcxp-badge{
  padding:.5rem .65rem;
  display:inline-flex; gap:.6rem; align-items:center;
  border-radius:var(--bcxp-radius);
  border:1px dashed var(--bcxp-border);
  background:var(--bcxp-surface);
}
.bcxp-badges .bcxp-badge img{ width:28px; height:28px; border-radius:6px; object-fit:contain; }

/* ---------- Profile ---------- */
.bcxp-profile{ padding:1rem 1.15rem; }
.bcxp-profile-card{ padding:1rem 1.1rem; }
.bcxp-profile-card strong{ font-weight:700; }
.bcxp-profile-card .bcxp-meta,
.bcxp-profile .bcxp-meta,
.bcxp-profile small{ color:var(--bcxp-muted-text); }

.bcxp-progress{
  margin-top:.5rem;
  background:var(--bcxp-muted);
  height:12px; border-radius:999px; overflow:hidden; position:relative;
}
.bcxp-progress>span{
  display:block; height:100%; width:var(--bcxp-pct,0%);
  background:linear-gradient(90deg,var(--bcxp-primary),#22c55e);
  transition:width .6s ease;
}
.bcxp-progress[data-pct]>span{ width:attr(data-pct percentage); }

/* ---------- Referral (generic card style) ---------- */
.bcxp-referral{ padding:.9rem 1rem; }
.bcxp-referral input[type="text"]{
  width:100%; border:1px solid var(--bcxp-border);
  background:var(--bcxp-bg); color:var(--bcxp-text);
  padding:.55rem .6rem; border-radius:8px; outline:none;
}
.bcxp-referral input[type="text"]:focus{
  border-color:var(--bcxp-primary);
  box-shadow:0 0 0 3px rgba(96,213,189,.18);
}
.bcxp-referral .bcxp-row{ display:flex; gap:.5rem; align-items:center; }

.bcxp-btn-row {
  display: flex;
  gap: 15px;
}

.bcxp-btn{
  display:inline-flex; align-items:center; gap:.4rem; font-size: small;
  background:var(--bcxp-primary); color:#0a2230; border:0; border-radius:10px;
  padding:.5rem .75rem; cursor:pointer; text-decoration:none; font-weight:700;
}
.bcxp-btn:hover{ filter:brightness(.96); }
.bcxp-btn:focus{ outline:2px solid var(--bcxp-primary); outline-offset:2px; }
.bcxp-btn.ghost{ background:transparent; color:var(--bcxp-primary); border:1px solid var(--bcxp-primary); }
a.bcxp-btn.ghost { text-decoration: none; }

/* ---------- SHARE BANNERS (Prediction + Tipster) ---------- */
/* Works with PHP class: .bcxp-share-banner */
.bcxp-share-banner{
  position:relative;
  border-radius:16px;
  padding:14px 16px 16px;
  margin: 10px 0px 10px 0px;
  color:#ffffff;
  background:linear-gradient(180deg,var(--bcxp-brand-navy),var(--bcxp-brand-navy-700));
  box-shadow:0 10px 20px rgba(0,0,0,.12),0 2px 8px rgba(0,0,0,.08);
  border:0;
  overflow:hidden;
}
.bcxp-share-banner::before{
  content:"";
  position:absolute; left:0; right:0; top:0; height:6px;
  background:var(--bcxp-brand-teal);
}
.bcxp-share-banner strong{ font-weight:800; }
.bcxp-share-banner p{ margin:.35rem 0 .7rem; color:#e8f6f2; }
.bcxp-share-banner .button,
.bcxp-share-banner .bcxp-btn{
  background:var(--bcxp-brand-teal);
  color:#08333a;
  border:0;
  border-radius:10px;
  padding:.5rem .75rem;
  font-weight:800;
  text-decoration:none;
}
.bcxp-share-banner .button:hover,
.bcxp-share-banner .bcxp-btn:hover{ filter:brightness(.95); }
.bcxp-share-banner input[type="url"],
.bcxp-share-banner input[type="text"]{
  border:1px solid rgba(255,255,255,.22);
  background:rgba(255,255,255,.08);
  color:#ffffff;
  padding:.6rem .7rem;
  border-radius:10px;
}
.bcxp-share-banner input::placeholder{ color:rgba(255,255,255,.85); }
.bcxp-share-banner .button.ghost{
  background:transparent; color:var(--bcxp-brand-teal); border:1px solid var(--bcxp-brand-teal);
}

/* Optional modifiers if you add them in PHP */
.bcxp-share-banner--tipster::before{ background:var(--bcxp-brand-teal); }
.bcxp-share-banner--prediction::before{ background:var(--bcxp-brand-teal); }

/* Stack/row layout inside banner */
.bcxp-share-banner .bcxp-share-row{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.bcxp-share-banner .bcxp-share-row input{ flex:1 1 260px; min-width:200px; }
@media (max-width:560px){
  .bcxp-share-banner .bcxp-share-row{ flex-direction:column; align-items:stretch; }
  .bcxp-share-banner .bcxp-share-row a.button,
  .bcxp-share-banner .bcxp-share-row button{ width:100%; }
}

/* ---------- Clan ---------- */
.bcxp-clan-card{ padding:.9rem 1rem; }

/* ---------- Recent activity ---------- */
.bcxp-recent-activity{ list-style:none; margin:0; padding:0; display:grid; gap:.5rem; }
.bcxp-recent-activity li{
  background:var(--bcxp-surface);
  border:1px solid var(--bcxp-border);
  border-radius:var(--bcxp-radius);
  padding:.6rem .75rem;
  box-shadow:var(--bcxp-shadow);
}
.bcxp-recent-activity code{ background:var(--bcxp-primary-weak); padding:.1rem .35rem; border-radius:6px; }

/* ---------- Utilities ---------- */
.bcxp-stack>*+*{ margin-top:.75rem; }

/* Legacy inline bars nicer */
.bcxp-quests .legacy-bar,
.bcxp-weekly-quests .legacy-bar{
  background:var(--bcxp-muted); border-radius:999px; overflow:hidden; height:10px; max-width:420px;
}
.bcxp-quests .legacy-bar span,
.bcxp-weekly-quests .legacy-bar span{ display:block; height:100%; background:var(--bcxp-primary); }

/* Mobile labels helper */
.bcxp-mobile-label{ display:none; }
@media (max-width:640px){
  .bcxp-mobile-label{ display:block; color:var(--bcxp-muted-text); font-size:.85rem; margin-bottom:.25rem; }
}

/* ---------- Empty state ---------- */
.bcxp-empty{ display:flex; align-items:center; gap:.75rem; padding:1rem 1.1rem; color:var(--bcxp-muted-text); }
.bcxp-empty-icon{
  width:36px; height:36px; border-radius:10px; display:grid; place-items:center;
  background:var(--bcxp-muted); color:var(--bcxp-primary); font-size:18px;
}
.bcxp-empty-title{ font-weight:700; display:block; }
.bcxp-empty-desc{ color:var(--bcxp-muted-text); }

/* ---------- Streak card / chip ---------- */
.bcxp-streak-card{ padding:1rem 1.1rem; }
.bcxp-streak-header{ display:flex; justify-content:space-between; align-items:center; margin-bottom:.5rem; }
.bcxp-pill{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.2rem .6rem; border-radius:999px;
  background:var(--bcxp-primary-weak); color:var(--bcxp-primary);
  font-size:.85rem; font-weight:600;
}
.bcxp-streak-metrics{ display:flex; gap:1.25rem; }
.bcxp-streak-metric{ min-width:100px; }
.bcxp-streak-value{ font-size:1.75rem; font-weight:800; line-height:1.1; }
.bcxp-streak-label{ color:var(--bcxp-muted-text); }
.bcxp-streak-note{ margin-top:.5rem; color:var(--bcxp-muted-text); font-size:.9rem; }

.bcxp-streak,
.shortcode-bcxp-streak{
  display:inline-flex; align-items:center; gap:.55rem;
  color: var(--bcxp-text);
  padding:.45rem .65rem; background:var(--bcxp-muted);
  border:1px solid var(--bcxp-border); border-radius:999px;
}
.shortcode-bcxp-streak strong{ font-weight:800; }
.bcxp-streak .bcxp-fire{
  width:18px; height:18px; border-radius:50%;
  background:radial-gradient(circle at 30% 30%,#ffcd52 0%,#f97316 60%,#ef4444 100%);
  box-shadow:0 0 10px rgba(249,115,22,.25);
}

/* ---------- Badge catalog ---------- */
.bcxp-badges-catalog{ display:grid; grid-template-columns:repeat(auto-fill, minmax(220px,1fr)); gap:.75rem; }
.bcxp-badge-item{ display:flex; gap:.75rem; padding:.9rem 1rem; }
.bcxp-badge-item .bcxp-badge-icon img{ width:48px; height:48px; border-radius:8px; object-fit:contain; }
.bcxp-badge-item .bcxp-desc{ margin-top:.15rem; }

/* ---------- Inline empty states ---------- */
.bcxp-badges p:only-child,
.bcxp-badge-catalog p:only-child,
.bcxp-weekly-quests p:only-child,
.bcxp-quests p:only-child,
.bcxp-clan-card p:only-child{
  display:block; padding:.85rem 1rem;
  border:1px dashed var(--bcxp-border); border-radius:var(--bcxp-radius);
  background:var(--bcxp-muted); color:var(--bcxp-muted-text);
}

/* ---------- Motion preferences ---------- */
@media (prefers-reduced-motion:reduce){
  .bcxp-progress>span{ transition:none!important; }
}

/* ---------- Dark-mode tweaks ---------- */
@media (prefers-color-scheme:dark){
  .bcxp-btn{ box-shadow:none; }
  .bcxp-referral input[type="text"]{ background:#0b0e13; }
  .bcxp-badge{ border-color:rgba(255,255,255,.08); }
  .bcxp-badges-catalog>div{ border-color:rgba(255,255,255,.08); }
}

/* ---------- Clan forms (inputs readable) ---------- */
.bcxp-clan-form,
.bcxp-clan-admin,
.bcxp-clan-card form{
  background:var(--bcxp-surface);
  border:1px solid var(--bcxp-border);
  border-radius:var(--bcxp-radius);
  box-shadow:var(--bcxp-shadow);
  padding:1rem 1.2rem;
  color:var(--bcxp-text);
}
.bcxp-field{ margin-bottom:.9rem; }
.bcxp-field>label{ display:inline-block; font-weight:700; margin-bottom:.35rem; color:var(--bcxp-text); }
.bcxp-help{ display:block; margin-top:.35rem; font-size:.92rem; color:var(--bcxp-muted-text); }

.bcxp-input,
.bcxp-select,
.bcxp-textarea,
.bcxp-clan-form input[type="text"],
.bcxp-clan-form input[type="number"],
.bcxp-clan-form input[type="email"],
.bcxp-clan-form input[type="url"],
.bcxp-clan-form input[type="search"],
.bcxp-clan-form select,
.bcxp-clan-form textarea,
.bcxp-clan-admin input[type="text"],
.bcxp-clan-admin input[type="number"],
.bcxp-clan-admin select,
.bcxp-clan-admin textarea{
  width:100%; appearance:none;
  border:1px solid var(--bcxp-border);
  background:var(--bcxp-bg); color:var(--bcxp-text);
  border-radius:10px; padding:.6rem .7rem;
  line-height:1.45; font-size:1rem;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.bcxp-clan-form :is(input,select,textarea):focus,
.bcxp-clan-admin :is(input,select,textarea):focus{
  outline:none; border-color:var(--bcxp-primary);
  box-shadow:0 0 0 3px rgba(96,213,189,.18);
  background:var(--bcxp-surface);
}

.bcxp-members{ border:1px solid var(--bcxp-border); border-radius:var(--bcxp-radius); overflow:hidden; }
.bcxp-members table{ width:100%; border-collapse:collapse; background:var(--bcxp-surface); }
.bcxp-members th,.bcxp-members td{
  padding:.7rem .9rem; border-bottom:1px solid var(--bcxp-border);
  text-align:left; vertical-align:middle; color:var(--bcxp-text);
}
.bcxp-members th{ background:var(--bcxp-muted); color:var(--bcxp-muted-text); font-weight:700; }
.bcxp-members tr:last-child td{ border-bottom:0; }

/* ===== Forms inside .bcxp-card ===== */
.bcxp-card form.bcxp-stack { display: grid; gap: .7rem; }
.bcxp-card form.bcxp-row   { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }

.bcxp-card form input[type="text"],
.bcxp-card form input[type="number"],
.bcxp-card form input[type="email"],
.bcxp-card form input[type="url"],
.bcxp-card form input[type="search"],
.bcxp-card form select,
.bcxp-card form textarea {
  width: 100%;
  appearance: none;
  background-color: var(--bcxp-bg);
  color: var(--bcxp-text);
  border: 1px solid var(--bcxp-border);
  border-radius: 10px;
  padding: .62rem .72rem;
  font: 400 1rem/1.45 var(--bcxp-font);
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease, color .15s ease;
}
.bcxp-card form input::placeholder,
.bcxp-card form textarea::placeholder { color: var(--bcxp-muted-text); opacity: .9; }
.bcxp-card form input:focus,
.bcxp-card form select:focus,
.bcxp-card form textarea:focus {
  outline: none;
  border-color: var(--bcxp-primary);
  box-shadow: 0 0 0 3px rgba(96,213,189,.18);
  background-color: var(--bcxp-surface);
}
.bcxp-card form :is(input,select,textarea)[disabled],
.bcxp-card form :is(input,textarea)[readonly] { opacity:.65; cursor:not-allowed; }

.bcxp-card form .bcxp-btn,
.bcxp-card form button[type="submit"],
.bcxp-card form input[type="submit"]{
  display:inline-flex; align-items:center; justify-content:center; gap:.45rem;
  background-color:var(--bcxp-primary); color:#08333a;
  border:1px solid var(--bcxp-primary);
  border-radius:10px; padding:.58rem .9rem;
  font:700 1rem/1 var(--bcxp-font);
  cursor:pointer; text-decoration:none;
  transition:opacity .15s ease, transform .05s ease;
}
.bcxp-card form .bcxp-btn:hover,
.bcxp-card form button[type="submit"]:hover,
.bcxp-card form input[type="submit"]:hover{ opacity:.95; }
.bcxp-card form .bcxp-btn:active,
.bcxp-card form button[type="submit"]:active,
.bcxp-card form input[type="submit"]:active{ transform:translateY(1px); }

.bcxp-card form.bcxp-row input[type="text"],
.bcxp-card form.bcxp-row input[type="number"],
.bcxp-card form.bcxp-row input[type="email"],
.bcxp-card form.bcxp-row input[type="url"],
.bcxp-card form.bcxp-row input[type="search"],
.bcxp-card form.bcxp-row select,
.bcxp-card form.bcxp-row textarea{ flex:1 1 260px; min-width:0; }
.bcxp-card form.bcxp-row :is(.bcxp-btn,button[type="submit"],input[type="submit"]){ flex:0 0 auto; white-space:nowrap; }

.bcxp-card > strong:first-child,
.bcxp-card > h4:first-child,
.bcxp-card > h5:first-child{ display:block; margin:2px 0 8px; font-weight:800; color:var(--bcxp-text); }

.bcxp-card{ background-color:var(--bcxp-surface); border:1px solid var(--bcxp-border); border-radius:var(--bcxp-radius); box-shadow:var(--bcxp-shadow); color:var(--bcxp-text); }

@media (max-width:560px){
  .bcxp-card form.bcxp-row{ flex-direction:column; align-items:stretch; }
  .bcxp-card form.bcxp-row :is(.bcxp-btn,button[type="submit"],input[type="submit"]){ width:100%; }
}
@media (prefers-color-scheme:dark){
  .bcxp-card form :is(input[type="text"],input[type="number"],input[type="email"],input[type="url"],input[type="search"],select,textarea){
    background-color:#0b0e13;
  }
}

/* ---------- Clan leaderboard (inherits table styling) ---------- */
table.bcxp-clan-leaderboard{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border-radius:var(--bcxp-radius);background:var(--bcxp-surface);box-shadow:var(--bcxp-shadow);border:1px solid var(--bcxp-border)}
.bcxp-clan-leaderboard thead th{text-align:left;font-weight:700;background:var(--bcxp-muted);color:var(--bcxp-muted-text);border-bottom:1px solid var(--bcxp-border);padding:.8rem 1rem}
.bcxp-clan-leaderboard tbody td{padding:.85rem 1rem;border-bottom:1px solid var(--bcxp-border);color:var(--bcxp-text)}
.bcxp-clan-leaderboard tbody tr:nth-child(odd){background:rgba(0,0,0,.015)}
@media (prefers-color-scheme:dark){.bcxp-clan-leaderboard tbody tr:nth-child(odd){background:rgba(255,255,255,.03)}}
.bcxp-clan-leaderboard tbody tr:last-child td{border-bottom:0}
.bcxp-clan-leaderboard tbody tr:hover{background:var(--bcxp-primary-weak);transition:background .18s ease}

/* Mobile: table → cards */
@media (max-width:640px){
  .bcxp-clan-leaderboard thead{display:none}
  .bcxp-clan-leaderboard,.bcxp-clan-leaderboard tbody,.bcxp-clan-leaderboard tr,.bcxp-clan-leaderboard td{display:block;width:100%}
  .bcxp-clan-leaderboard tr{border:1px solid var(--bcxp-border);border-radius:var(--bcxp-radius);margin-bottom:.75rem;background:var(--bcxp-surface);box-shadow:var(--bcxp-shadow)}
  .bcxp-clan-leaderboard td{border-bottom:1px dashed var(--bcxp-border)}
  .bcxp-clan-leaderboard td:last-child{border-bottom:0}
  .bcxp-clan-leaderboard td::before{content:attr(data-th);font-weight:600;display:block;color:var(--bcxp-muted-text);margin-bottom:.25rem}
}

/* Optional rank flair */
.bcxp-clan-leaderboard tbody tr:nth-child(1) td:first-child{font-weight:800}
.bcxp-clan-leaderboard tbody tr:nth-child(1){box-shadow:inset 0 0 0 9999px rgba(255,215,0,.06)}
.bcxp-clan-leaderboard tbody tr:nth-child(2){box-shadow:inset 0 0 0 9999px rgba(192,192,192,.05)}
.bcxp-clan-leaderboard tbody tr:nth-child(3){box-shadow:inset 0 0 0 9999px rgba(205,127,50,.05)}