
.mbxm-wrap{display:grid;gap:18px}
.mbxm-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:18px;border:1px solid #deded9;border-radius:12px;background:#faf9f6}
.mbxm-hero h2{margin:0;font-family:'Bebas Neue',sans-serif;font-size:2rem;letter-spacing:.03em}
.mbxm-hero p{margin:4px 0 0;color:#777;font-size:.78rem}
.mbxm-count{font-family:'Space Mono',monospace;font-size:.63rem;color:#777;white-space:nowrap}
.mbxm-card{border:1px solid #deded9;border-radius:12px;background:#fff;padding:16px}
.mbxm-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mbxm-field{display:grid;gap:6px}
.mbxm-field label{font-family:'Space Mono',monospace;text-transform:uppercase;letter-spacing:.08em;font-size:.56rem;color:#666}
.mbxm-field input,.mbxm-field select{width:100%;height:42px;border:1px solid #d5d5d0;border-radius:8px;background:#fff;padding:0 11px;font:500 .8rem 'DM Sans',sans-serif}
.mbxm-file{padding:10px!important;height:auto!important}
.mbxm-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.mbxm-btn{appearance:none;border:1px solid #bbb;background:#fff;color:#222;border-radius:8px;min-height:38px;padding:8px 11px;font-family:'Space Mono',monospace;font-size:.54rem;letter-spacing:.07em;text-transform:uppercase;cursor:pointer}
.mbxm-btn.primary{background:#111;color:#fff;border-color:#111}.mbxm-btn.gold{border-color:#a8872b;color:#80671f}.mbxm-btn.danger{border-color:#bc6b6b;color:#a02f2f}
.mbxm-btn:disabled{opacity:.45;cursor:not-allowed}
.mbxm-progress{height:7px;background:#e8e8e3;border-radius:999px;overflow:hidden;margin-top:12px}.mbxm-progress i{display:block;height:100%;width:0;background:#111;transition:width .15s}
.mbxm-status{font-size:.72rem;color:#777;margin-top:7px;min-height:1em}
.mbxm-list{display:grid;gap:10px}
.mbxm-track{display:grid;grid-template-columns:54px minmax(0,1fr) auto;gap:12px;align-items:center;border:1px solid #e0e0dc;border-radius:10px;padding:10px;background:#fafafa}
.mbxm-art{width:54px;height:54px;border-radius:7px;object-fit:cover;background:#e9e9e5}
.mbxm-art.placeholder{display:grid;place-items:center;font-family:'Bebas Neue',sans-serif;color:#777}
.mbxm-copy{min-width:0}.mbxm-copy strong{display:flex;align-items:center;gap:7px;font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mbxm-copy span{display:block;color:#777;font-size:.68rem;margin-top:3px}
.mbxm-featured{display:inline-flex!important;border:1px solid #b79536;color:#8c701f;padding:2px 5px;border-radius:5px;font-family:'Space Mono',monospace;font-size:.44rem!important;letter-spacing:.07em;text-transform:uppercase;margin:0!important}
.mbxm-track-actions{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.mbxm-mini{appearance:none;border:1px solid #ccc;background:#fff;border-radius:6px;padding:6px 7px;font-family:'Space Mono',monospace;font-size:.47rem;cursor:pointer}.mbxm-mini.feature{color:#8c701f;border-color:#bda25d}.mbxm-mini.carousel{color:#6247a5;border-color:#8d74c7}.mbxm-mini.delete{color:#9d3333;border-color:#c88787}
.mbxm-empty{text-align:center;padding:28px;color:#888;border:1px dashed #ccc;border-radius:10px}
.mbxm-skin-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.mbxm-skin-row select{min-width:180px}
.mbxm-note{font-size:.68rem;color:#777;line-height:1.5}
@media(max-width:760px){
  .mbxm-hero{align-items:flex-start;flex-direction:column}.mbxm-grid{grid-template-columns:1fr}.mbxm-track{grid-template-columns:48px minmax(0,1fr)}.mbxm-art{width:48px;height:48px}.mbxm-track-actions{grid-column:1/-1;justify-content:flex-start}.mbxm-actions .mbxm-btn{flex:1 1 auto}
}
.mbxm-reward-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}
.mbxm-reward-kicker{font-family:'Space Mono',monospace;text-transform:uppercase;letter-spacing:.08em;font-size:.56rem;color:#7a6a5e}
.mbxm-reward-head h3{margin:4px 0 6px;font-family:'Bebas Neue',sans-serif;font-size:1.5rem;letter-spacing:.03em}
.mbxm-reward-head p{margin:0;color:#777;font-size:.78rem;max-width:620px;line-height:1.5}
.mbxm-badge{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:8px 12px;border-radius:999px;font-family:'Space Mono',monospace;font-size:.55rem;letter-spacing:.08em;text-transform:uppercase;border:1px solid #d8d8d2;background:#fafafa;color:#6d6d66;white-space:nowrap}
.mbxm-badge.unlocked{border-color:#86b69b;background:#f2fbf5;color:#2f7f4b}
.mbxm-badge.locked{border-color:#d9c6cc;background:#fff7fa;color:#9a5c6a}
.mbxm-invite-grid{display:grid;grid-template-columns:minmax(0,1fr) 160px 220px;gap:12px;align-items:end}
.mbxm-invite-row{display:flex;gap:8px}
.mbxm-invite-row input{width:100%;height:42px;border:1px solid #d5d5d0;border-radius:8px;background:#fbfbf9;padding:0 11px;font:500 .78rem 'DM Sans',sans-serif;color:#444}
.mbxm-stat{border:1px solid #e1e1db;border-radius:10px;background:#faf9f6;padding:10px 12px;display:grid;gap:5px;min-height:42px}
.mbxm-stat span{font-family:'Space Mono',monospace;text-transform:uppercase;letter-spacing:.08em;font-size:.5rem;color:#7d7d75}
.mbxm-stat strong{font-size:.88rem;color:#222;line-height:1.2}
.mbxm-field select option:disabled{color:#999}
@media(max-width:760px){
  .mbxm-reward-head{flex-direction:column}
  .mbxm-invite-grid{grid-template-columns:1fr}
  .mbxm-invite-row{flex-direction:column}
}

/* White manager surfaces need explicit ink, including Safari text fill. */
.mbxm-wrap .mbxm-card,.mbxm-wrap .mbxm-hero,.mbxm-wrap .mbxm-track{color:#222}
.mbxm-wrap .mbxm-field :is(input,select,textarea){color:#222!important;-webkit-text-fill-color:#222!important;caret-color:#222;background-color:#fff;color-scheme:light}
.mbxm-wrap .mbxm-field :is(input,textarea)::placeholder{color:#717171!important;-webkit-text-fill-color:#717171!important;opacity:1}
.mbxm-wrap .mbxm-mini{color:#222}
.mbxm-wrap .mbxm-field input:disabled{-webkit-text-fill-color:#666!important;color:#666!important;opacity:.65}

/* User-facing skin recovery control. Keep implementation diagnostics out of the
   account UI and provide one safe re-sync action instead. */
.mbxm-refresh-skin{align-self:flex-end;min-width:118px;white-space:nowrap}
.mbxm-skin-note{flex:1 1 280px}
@media(max-width:760px){
  .mbxm-skin-row{align-items:stretch}
  .mbxm-skin-row>.mbxm-field{flex:1 1 100%}
  .mbxm-refresh-skin{align-self:stretch;min-height:42px}
  .mbxm-skin-note{flex-basis:100%}
}
