/* utilities.css · the only place !important is allowed */
@layer utilities {
  .vh { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }
  [hidden] { display: none !important; }
  .grow { flex: 1 1 auto; }
  .t-danger { color: var(--danger); }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
    .btn:active { transform: none !important; }
    .ico--spin, .chip--busy .ico, .step[data-s="active"] .step__dot .ico, .btn.is-busy::after { animation: none !important; }
    .skel { animation: none !important; background: var(--surface-3) !important; }
    .code .caret { animation: none !important; }
  }
}
