/* ============================================================
   MY CAMPAIGNS (27 September 2026) — the Account page's panels, pills,
   bar and rows (account.css), in one column, with each campaign's cover.
   ============================================================ */
.mc-top,.mc-main{max-width:76rem; margin-left:auto; margin-right:auto}
.mc-main{display:grid; gap:1.6rem}
.mc[aria-busy="true"] .mc-main{opacity:0}
.mc-main{transition:opacity var(--speed) var(--easing)}

.mc-pic{
  flex:none; display:block; width:6.4rem; height:6.4rem; border-radius:1.4rem; overflow:hidden;
  background:var(--lg-fill);
}
.mc-pic img{display:block; width:100%; height:100%; object-fit:cover}

.mc-now{display:flex; align-items:center; gap:1.8rem}
.mc-now .mc-pic{width:8.8rem; height:8.8rem; border-radius:1.8rem}
.mc-now_txt{min-width:0}
.mc-now_txt b{display:block; font-family:var(--face-ui); font-size:1.8rem; font-weight:600; color:var(--ink); overflow-wrap:anywhere}
.mc-btns{margin-top:2.4rem}

.mc-past li{justify-content:flex-start}
.mc-past_t{flex:1; min-width:0; overflow-wrap:anywhere}
.mc-past .ac-amt{text-align:right}
.mc-past .ac-amt small{font-weight:500}

.mc-none p{margin:0 0 2rem; font-family:var(--face-ui); font-size:1.7rem; font-weight:500; color:var(--ink)}
.mc-next{margin:.8rem 0 0}

@media (max-width:560px){
  .mc-pic{width:5.2rem; height:5.2rem; border-radius:1.2rem}
  .mc-now .mc-pic{width:7.2rem; height:7.2rem; border-radius:1.6rem}
}
.mc-now_txt .ac-pill{white-space:nowrap}

/* Start a campaign beside the heading; locked while one is running */
.mc-top{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1.6rem 3.2rem}
.mc-start{display:grid; justify-items:end; gap:.8rem; max-width:34rem}
.mc-start[hidden]{display:none}
.mc-start .is-locked{background:var(--lg-fill); color:var(--soft); cursor:not-allowed}
.mc-start .is-locked:hover,.mc-start .is-locked:focus-visible{background:var(--lg-fill-hi); color:var(--soft)}
.mc-startsay{margin:0; text-align:right; font-family:var(--face-ui); font-size:1.4rem; font-weight:500; line-height:1.4; color:var(--soft)}
.mc-startsay:empty{display:none}
@media (max-width:600px){
  .mc-start{justify-items:start}
  .mc-startsay{text-align:left}
}