/* Short, direct feedback. Never animate the map, geometry or layout dimensions. */
:root { --motion-ease: cubic-bezier(.22,1,.36,1); }
button {
  transition: background-color 140ms ease, border-color 140ms ease,
    box-shadow 160ms ease, color 140ms ease, scale 180ms var(--motion-ease);
  -webkit-tap-highlight-color: transparent;
}
button:not(:disabled):not([aria-disabled="true"]):active {
  scale: .96;
  filter: brightness(.92);
  transition-duration: 60ms;
}
button:focus-visible { outline: 3px solid #3b82f6; outline-offset: 3px; }
.maplibregl-marker:active, .maplibregl-marker button:active { scale: none !important; filter: none !important; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--navy, #003675); }
.layer-row, .road-sublayer, .project-item {
  transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}
.modal:not(.hidden), .compact-actions:not(.hidden), .user-menu:not(.hidden),
.detail-panel:not(.hidden), .radius-panel:not(.hidden), .toast {
  animation: ui-arrive 220ms var(--motion-ease);
}
@keyframes ui-arrive {
  from { opacity: 0; translate: 0 6px; scale: .985; }
  to { opacity: 1; translate: 0 0; scale: 1; }
}
@media (prefers-reduced-motion: reduce) {
  button, .layer-row, .road-sublayer, .project-item { transition: none !important; }
  button:not(:disabled):not([aria-disabled="true"]):active { scale: none; }
  .modal, .compact-actions, .user-menu, .detail-panel, .radius-panel, .toast { animation: none !important; }
}