// Striped placeholder for imagery — labelled with monospace caption
const Placeholder = ({ label, aspect = "16 / 10", style, children, tone = "default" }) => {
  const styleVar = tone === "soft" ? { background: "var(--surface-2)" } : {};
  return (
    <div className="ph" style={{ aspectRatio: aspect, ...styleVar, ...style }}>
      {children}
      <div className="ph-label">{label}</div>
    </div>
  );
};

Object.assign(window, { Placeholder });