/* ── Curve shared video player (design ported from Marketr, Curve colors) ── */
.mp { position: relative; width: 100%; aspect-ratio: 9 / 16; border: 1px solid var(--border, #e0d8cc); border-radius: 16px; overflow: hidden; background: #000; box-shadow: 0 2px 10px rgba(0,0,0,0.06); }
.mp-video { width: 100%; height: 100%; object-fit: cover; display: block; background: #000; }
.mp-center { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: opacity .2s; }
.mp-center-btn {
  width: 60px; height: 60px; border-radius: 18px; background: var(--accent, #3D3F9E); color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 10px 26px rgba(61,63,158,0.45); transition: transform .2s, background .2s;
}
.mp-center:hover .mp-center-btn { transform: scale(1.07); background: #2e3080; }
.mp-center-btn svg { width: 24px; height: 24px; }
.mp.playing .mp-center { opacity: 0; pointer-events: none; }
.mp-bar { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; display: flex; align-items: center; gap: 8px; padding: 10px 10px 11px; background: linear-gradient(to top, rgba(15,13,10,0.8), rgba(15,13,10,0.15) 72%, transparent); }
.mp-seek { position: relative; flex: 1; min-width: 28px; height: 16px; display: flex; align-items: center; cursor: pointer; }
.mp-seek-track { position: absolute; left: 0; right: 0; height: 4px; border-radius: 4px; background: rgba(255,255,255,0.28); }
.mp-seek-fill { position: absolute; left: 0; height: 4px; border-radius: 4px; background: var(--accent, #3D3F9E); width: 0%; }
.mp-seek-knob { position: absolute; left: 0; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 2px solid var(--accent, #3D3F9E); transform: translateX(-50%); box-shadow: 0 1px 4px rgba(0,0,0,0.4); }
.mp-time { color: #fff; font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; opacity: .95; }
.mp-btn { width: 30px; height: 30px; border-radius: 9px; flex-shrink: 0; padding: 0; background: rgba(255,255,255,0.15); border: 1px solid rgba(255,255,255,0.26); color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .2s, border-color .2s; }
.mp-btn:hover { background: var(--accent, #3D3F9E); border-color: var(--accent, #3D3F9E); }
.mp-btn svg { width: 14px; height: 14px; }
.mp:fullscreen { border-radius: 0; border: 0; }
.mp:fullscreen .mp-video { object-fit: contain; }
.mp:fullscreen .mp-bar { padding: 18px 20px 20px; gap: 12px; }
.mp:fullscreen .mp-btn { width: 44px; height: 44px; border-radius: 13px; }
.mp:fullscreen .mp-btn svg { width: 20px; height: 20px; }
.mp:fullscreen .mp-time { font-size: 15px; }
.mp:fullscreen .mp-center-btn { width: 84px; height: 84px; border-radius: 26px; }
.mp:fullscreen .mp-center-btn svg { width: 34px; height: 34px; }
.mp:fullscreen .mp-seek-knob { width: 15px; height: 15px; }

/* Context fixes: when the player sits inside an existing card frame, drop its own frame */
.cc .mp, .collage-card .mp { border: 0; border-radius: 0; box-shadow: none; }
/* Collage cards: video labels move up so they don't collide with the control bar */
.collage-card .vid-label { bottom: 52px !important; }
/* Creative library lightbox: vertical player sized to the viewport, never cropped */
.lightbox .mp { height: min(80vh, 160vw); aspect-ratio: 9 / 16; width: auto; max-width: 90vw; }
.lightbox .mp .mp-video { object-fit: contain; }
/* Creative strip cards: player inherits the card frame */
.ct-scroll-card .mp { border: 0; border-radius: 0; box-shadow: none; }