/* TurfOps shared motion/feedback layer — Apple-style fluid interface basics.
 * Response first: instant press feedback, no tap delay, keyboard-visible focus.
 * Restraint: only transform/opacity/filter transitions; no decoration. */

html {
  /* Remove double-tap-to-zoom delay on mobile; keeps pan/zoom gestures intact. */
  touch-action: manipulation;
}

body {
  -webkit-tap-highlight-color: transparent;
  font-optical-sizing: auto;
}

/* Typography: tight display headings, tabular KPI figures, calm rhythm. */
#main-content h1,
#main-content h2 {
  letter-spacing: -0.015em;
  line-height: 1.2;
  text-wrap: balance;
}

#main-content p.text-3xl {
  letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
}

/* Instant press-down feedback on pressable elements (pointer-down feel).
 * Subtle brightness shift only — no layout movement, compositor-cheap. */
a:active,
button:active {
  filter: brightness(0.94);
}

a,
button {
  transition: filter 100ms ease-out, background-color 150ms ease-out,
    border-color 150ms ease-out, transform 100ms ease-out;
}

/* Opt-in tactile press for primary CTAs: gentle scale on activation. */
.btn-press:active {
  transform: scale(0.97);
}

/* Visible keyboard focus everywhere (mouse/touch unaffected). */
:focus-visible {
  outline: 2px solid #15803d;
  outline-offset: 2px;
  border-radius: 4px;
}

/* Sidebar backdrop fade — JS toggles .is-open; .hidden still controls layout. */
#sidebar-backdrop {
  opacity: 0;
  transition: opacity 200ms ease-out;
}

#sidebar-backdrop.is-open {
  opacity: 1;
}

/* Calm sidebar slide: ease-out on enter, mirrored on exit. */
#sidebar {
  transition-timing-function: cubic-bezier(0.32, 0.72, 0, 1);
}

#sidebar nav a:active {
  background-color: rgba(255, 255, 255, 0.12);
}

/* Field forms: 16px controls on touch screens prevents iOS auto-zoom on focus. */
@media (max-width: 639px) {
  input,
  select,
  textarea {
    font-size: 16px !important;
  }
}

/* Sticky primary-action bar for long field forms. */
.sticky-actions {
  position: sticky;
  bottom: 0;
  padding-bottom: max(0.75rem, env(safe-area-inset-bottom));
}

/* Reduced motion: cross-fade or instant only — no slides, springs, or pulses. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  #sidebar {
    transition: none !important;
    transform: none !important;
  }

  #sidebar-backdrop {
    transition: none !important;
  }

  a:active,
  button:active,
  .btn-press:active {
    transform: none !important;
  }
}