/* Small movements support the shared design without moving the reading column. */
@media (prefers-reduced-motion:no-preference) {
  html { scroll-behavior:smooth; }
  .reveal { opacity:0; transform:none; translate:0 20px; transition:opacity 550ms ease,translate 550ms cubic-bezier(.2,.7,.2,1); transition-delay:var(--reveal-delay,0ms); }
  .reveal.is-visible { opacity:1; translate:0 0; }

  .site-nav { animation:motion-fade 450ms ease both; }
  .collection-heading h1,.about-hero-heading h1,.case-title h1,.thought-intro h1 { animation:motion-arrive 600ms cubic-bezier(.2,.7,.2,1) both; }
  .collection-heading p,.about-hero-heading p,.case-meta { animation:motion-arrive 550ms 90ms cubic-bezier(.2,.7,.2,1) both; }
  .about-socials,.thought-meta { animation:motion-fade 550ms 160ms ease both; }

  .study-cover,.thought-cover { transition:scale 280ms ease,box-shadow 280ms ease; }
  .study-link i,.project-link i,.case-live i,.button .ri-arrow-right-s-line,.button .ri-arrow-right-up-line,.button .ri-arrow-right-line { transition:translate 180ms ease; }
  .site-nav a,.thought-toc a,.thought-author,.thought-socials button { transition:color 180ms ease,background-color 180ms ease,opacity 180ms ease; }
  .case-section-nav a { transition:background-color 180ms ease,color 180ms ease; }
  .case-section-nav:not([hidden]) { animation:motion-bar-enter 250ms cubic-bezier(.2,.7,.2,1) both; }
  .playground-expand { transition:background-color 200ms ease,scale 200ms ease; }
  .inventory-list img { transition:rotate 250ms ease,scale 250ms ease; }

  .study-card:focus-within .study-cover,.thought-card:focus-within .thought-cover { box-shadow:0 8rem 24rem rgb(8 12 45 / 10%); }
  .playground-tile:focus-visible > img { transform:scale(1.025); }
  .playground-tile:focus-visible .playground-expand { background:rgb(8 12 45 / 85%); }
  #notice[open],.visual-dialog[open] { animation:motion-dialog-enter 200ms ease both; }
  #notice::backdrop,.visual-dialog::backdrop { animation:motion-fade 180ms ease both; }

  @media (hover:hover) and (pointer:fine) {
    .study-card:hover .study-cover,.thought-card:hover .thought-cover { scale:1.015; box-shadow:0 10rem 28rem rgb(8 12 45 / 10%); }
    .study-link:hover i,.project-link:hover i,.case-live:hover i,.button:hover .ri-arrow-right-s-line,.button:hover .ri-arrow-right-up-line,.button:hover .ri-arrow-right-line { translate:3px 0; }
    .playground-tile:hover .playground-expand { background:rgb(8 12 45 / 85%); scale:1.05; }
    .inventory-list li:hover img { rotate:-4deg; scale:1.04; }
  }
}

@keyframes motion-fade { from { opacity:0; } to { opacity:1; } }
@keyframes motion-arrive { from { opacity:0; translate:0 16px; } to { opacity:1; translate:0 0; } }
@keyframes motion-bar-enter { from { opacity:0; translate:0 8px; } to { opacity:1; translate:0 0; } }
@keyframes motion-dialog-enter { from { opacity:0; scale:.98; } to { opacity:1; scale:1; } }

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .reveal,.reveal.is-visible { opacity:1; transform:none; translate:none; }
  .playground-tile:hover > img,.playground-tile:focus-visible > img,.visual-tile:hover img,
  .visual-card:hover,.reference-photo:hover,.strip-photo:hover,.project-card:hover .empty-image,.blog-card:hover .empty-image { transform:none; }
}