/* DBD Tracker v3 — MatchCard lab styling
   The card intentionally reuses the production History cinematic classes from
   theme.css. Keep this file limited to lab/component-specific glue so the lab
   remains a faithful preview instead of a second layout. */
.match-card-component{margin:0}
.match-card-component.needs-review{border-color:rgba(245,158,11,.62);box-shadow:0 22px 70px rgba(0,0,0,.52),0 0 0 1px rgba(245,158,11,.18)}
.match-card-component .cinematic-actions,.match-card-component .match-card-actions{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:flex-end}
.match-card-component .cinematic-flags{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.match-card-component .bhvr-loadout-icon img,.match-card-component .bhvr-portrait img,.match-card-component .bhvr-map-art img{display:block;width:100%;height:100%;object-fit:cover}
.match-card-component .bhvr-portrait .catalog-layered-image,.match-card-component .bhvr-map-art .catalog-layered-image,.match-card-component .bhvr-loadout-icon .catalog-layered-image{width:100%;height:100%}
.match-card-component .bhvr-portrait .catalog-layered-image img,.match-card-component .bhvr-map-art .catalog-layered-image img,.match-card-component .bhvr-loadout-icon .catalog-layered-image img{width:100%;height:100%;object-fit:cover}
.match-card-component .cinematic-killer-stack.multi .bhvr-portrait + .bhvr-portrait{margin-left:-42px}
.match-card-component .cinematic-killer-stack.multi .bhvr-portrait{position:relative}
.match-card-component .cinematic-killer-stack.multi .bhvr-portrait:nth-child(2){transform:translateY(10px);z-index:2}
.match-card-component .cinematic-player-card.killer .cinematic-player-loadout{grid-template-columns:1fr auto auto}
.match-card-component .match-card-notes{margin-top:12px;border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:10px;color:#b2bdc5;background:rgba(255,255,255,.035)}
.dbd-match-card-lab-stack{display:grid;gap:var(--dbd-space-4)}

.match-card-component .cinematic-main{cursor:pointer}
.match-card-component .cinematic-main:focus-visible{outline:2px solid rgba(59,130,246,.9);outline-offset:4px}
.match-card-component .cinematic-expanded-lobby{display:none}
.match-card-component.expanded .cinematic-expanded-lobby{display:block}
.match-card-component .cinematic-player-user{font-size:.78rem;color:#cbd5e1;opacity:.9;letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.match-card-component .cinematic-survivor-mini .cinematic-player-user{font-size:.68rem;color:#94a3b8;max-width:92px;margin-top:1px;text-align:center}
.match-card-component .cinematic-killer-copy>.cinematic-player-user{margin-top:2px;color:#e5e7eb;text-shadow:0 1px 8px rgba(0,0,0,.75)}
.match-card-component .cinematic-player-user.lightbringer-username{color:#ffd36a;text-shadow:0 0 18px rgba(255,211,106,.55),0 1px 8px rgba(0,0,0,.75)}
.match-card-component .cinematic-player-user.admin-crimson-username{color:#ff8fa3;text-shadow:0 0 16px rgba(255,70,100,.44),0 1px 8px rgba(0,0,0,.75)}
.match-card-component .cinematic-player-user.staff-blue-username{color:#78b7ff;text-shadow:0 0 14px rgba(120,183,255,.42),0 1px 8px rgba(0,0,0,.75)}
.match-card-component .cinematic-player-user.vip-purple-username{color:#c99cff;text-shadow:0 0 12px rgba(184,123,255,.34),0 1px 8px rgba(0,0,0,.75)}
.match-card-component .cinematic-player-user.supporter-gold-username{color:#f4c76b;text-shadow:0 0 12px rgba(244,199,107,.35),0 1px 8px rgba(0,0,0,.75)}
.match-card-component .cinematic-player-flags{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px;justify-content:center;max-width:100%}
.match-card-component .cinematic-player-flags.compact .badge{font-size:.58rem;padding:2px 5px;line-height:1.1}
.match-card-component .cinematic-player-meta{display:flex;flex-wrap:wrap;gap:5px;align-items:center}

/* v3.1.6 — History player loadout save action */
.match-card-component .match-card-save-player-build {
  margin-top:6px;
  justify-self:start;
}

.match-card-component .cinematic-survivor-status.bad,
.match-card-component .cinematic-player-meta .badge.bad {
  color:#ff6868;
}

/* v3.1.9 — History survivor outcomes use text color only, not red/green pill fills. */
.match-card-component .cinematic-survivor-status.good {
  color:#66d66e!important;
}

.match-card-component .cinematic-survivor-status.bad,
.match-card-component .cinematic-player-meta .badge.bad {
  color:#ff6868!important;
}

.match-card-component .cinematic-player-meta .badge.good,
.match-card-component .cinematic-player-meta .badge.bad {
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:none!important;
}

.match-card-component .cinematic-player-meta .badge.good {
  color:#66d66e!important;
}