/* lm4y-mobile-fixes.css — staged 2026-11-04 */
/* 1) Mobile bottom bar (rev 2026-11-04i). Sky: keep the big red/navy .lmx-sticky.
      .lmx-sticky is printed only on the homepage (home.html), so:
      - homepage: .lmx-sticky shows, .mbar hidden (rules in Additional CSS, "LMX bar swap" block)
      - other pages: theme .mbar stays, with the footer space reserved for it below. */
@media (max-width:899px){
  body{padding-bottom:0!important}
  body:not(.home) .site-footer{padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}
  .site-footer .ft-bottom:last-of-type{padding-right:72px} /* clear chat bubble */
  body:not(.home) .chat{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .mbar{transition:transform .25s ease,opacity .25s ease}
  .mbar.is-hidden{transform:translateY(110%);opacity:0;pointer-events:none}
}
/* 2) Specialty Moves cards — visual only */
.spc{border-radius:16px;box-shadow:0 1px 2px rgba(16,24,40,.06),0 4px 14px rgba(16,24,40,.07);transition:transform .2s ease,box-shadow .2s ease}
.spc:hover,.spc:focus-visible{transform:translateY(-3px);box-shadow:0 10px 26px rgba(16,24,40,.14)}
.spc-img{padding:8px;background:transparent}
.spc-img img{border-radius:12px;object-fit:cover;object-position:50% 40%;transition:transform .35s ease}
.spc:hover .spc-img img{transform:scale(1.03)}
.spc-body{border-left:0;position:relative}
.spc-body::before{content:"";position:absolute;left:0;top:18%;bottom:18%;width:3px;border-radius:3px;background:var(--red)}
@media (max-width:640px){.spc{grid-template-columns:124px 1fr}.spc-img{min-height:124px}}
@media (prefers-reduced-motion:reduce){.spc,.spc-img img,.mbar{transition:none}.spc:hover{transform:none}.spc:hover .spc-img img{transform:none}}