/* Preview placeholder marking — ON by default, hidden with html.live or ?live */
[data-ph] { outline: 2px dashed #f59e0b; outline-offset: 3px; position: relative; }
[data-ph]::after {
  content: "PLACEHOLDER · " attr(data-ph);
  position: absolute; top: -0.7rem; left: 0;
  font: 600 10px/1 "Archivo", system-ui, sans-serif;
  background: #f59e0b; color: #160d07; padding: 2px 6px; border-radius: 3px;
  white-space: nowrap; z-index: 50; pointer-events: none; letter-spacing: 0.04em;
}
.ph-banner {
  position: relative; z-index: 1200; background: #f59e0b; color: #160d07; text-align: center;
  font: 600 12.5px/1.4 "Archivo", system-ui, sans-serif; padding: 8px 12px; letter-spacing: 0.02em;
}
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; } }