/* ============================================================
   COMPONENT · HAZARD
   Diagonal stripe banner. Reserve for genuinely hazardous
   regions — destructive action zones, danger boundaries.
   ============================================================ */

.c-hazard {
  height: 1.5rem;
  background: var(--pattern-hazard);
  background-size: 24px 24px;
  border-top: 2px solid var(--c-black);
  border-bottom: 2px solid var(--c-black);
}

.c-hazard--thin { height: 0.5rem; background-size: 14px 14px; }

.c-hazard-zone {
  padding: var(--space-5);
  border: 2px dashed var(--color-caution);
  background: color-mix(in srgb, var(--color-caution) 5%, transparent);
  border-radius: var(--radius-xs);
}