/* Interaction lighting follows the pointer only on precision input devices. */
.reading-progress {
  position: fixed; inset: 0 0 auto; height: 3px; z-index: 100;
  background: #91a8ff; transform-origin: left; pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
  .effect-ready { opacity: .35; transform: translateY(24px); transition: opacity .7s ease, transform .7s cubic-bezier(.16,1,.3,1); }
  .effect-ready.effect-visible { opacity: 1; transform: none; }
  .portal-showcase img { transition: transform .7s cubic-bezier(.16,1,.3,1); }
  .portal-showcase > a { overflow: hidden; }
  .button { position: relative; overflow: hidden; }
  .button::after {
    content: ''; position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(110deg, transparent 30%, #ffffff28 50%, transparent 70%);
    transform: translateX(-120%); transition: transform .65s ease;
  }
  .button:focus-visible::after { transform: translateX(120%); }
  .training-result, .practice-output { animation: route-enter .5s ease; }
  @media (hover: hover) and (pointer: fine) {
    .button:hover::after { transform: translateX(120%); }
    .portal-showcase > a:hover img { transform: scale(1.035); }
    .product-index a, .home-directory a, .product-picker button, .development-options button, .practice-choices button { position: relative; overflow: hidden; }
    .pointer-active::before {
      content: ''; position: absolute; inset: 0; pointer-events: none;
      background: radial-gradient(180px circle at var(--pointer-x) var(--pointer-y), #91a8ff26, transparent 75%);
    }
    .button:hover { translate: 0 -3px; }
    .button { transition: background .2s, translate .25s ease; }
  }
}

@media (prefers-reduced-motion: no-preference) and (pointer: coarse) {
  .effect-ready { opacity: .8; transform: none; transition: opacity .25s ease; }
  .effect-ready.effect-visible { opacity: 1; }
}
