/* placeholder.css — preview markers (ON by default; hidden with .live / ?live) */
[data-ph]{ outline:2px dashed #f59e0b; outline-offset:3px; position:relative; }
[data-ph]::after{ content:"PLACEHOLDER · " attr(data-ph); position:absolute; top:-.7rem; left:0;
  font:700 10px/1 "Plus Jakarta Sans",system-ui,sans-serif; background:#f59e0b; color:#3a2a00;
  padding:3px 7px; border-radius:5px; white-space:nowrap; z-index:50; pointer-events:none; letter-spacing:.02em; }
.ph-banner{ position:sticky; top:0; z-index:1500; background:#f59e0b; color:#211800; text-align:center;
  font:600 13px/1.45 "Plus Jakarta Sans",system-ui,sans-serif; padding:9px 14px; }
.ph-banner b{ color:#000; }
html.live [data-ph]{ outline:none; }
html.live [data-ph]::after, html.live .ph-banner{ display:none; }
@media print{ [data-ph]::after, .ph-banner{ display:none; } }