/* Rubber lifting platform, with a resting barbell built entirely in CSS. */
.gym-launch-banner {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-bottom: 176px;
  background-color: #202124;
  background-image:
    radial-gradient(ellipse at 80% 100%, #e0c19312, transparent 60%),
    linear-gradient(110deg, #111214c9, #16171944),
    repeating-linear-gradient(0deg, transparent 0 179px, #08090b80 180px, #ffffff08 182px, transparent 183px 360px),
    repeating-linear-gradient(90deg, transparent 0 259px, #08090b80 260px, #ffffff08 262px, transparent 263px 520px);
  box-shadow: inset 0 1px 0 #ffffff10;
}
.gym-launch-banner::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .16;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' viewBox='0 0 180 180'%3E%3Cfilter id='grain'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23grain)' d='M0 0h180v180H0z'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}
.gym-launch-main, .gym-launch-creation, .gym-launch-footer { position: relative; z-index: 1; }
.gym-deadlift {
  position: absolute;
  width: 470px;
  height: 144px;
  right: 48px;
  bottom: 30px;
  pointer-events: auto;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  text-align: inherit;
  transform: rotate(-8deg);
}
.gym-deadlift:focus-visible { outline: 2px solid #e0c193; outline-offset: 6px; border-radius: 12px; }
.gym-deadlift-shadow { position: absolute; inset: 90px -4px -4px; border-radius: 50%; background: #0005; filter: blur(14px); transform: rotate(3deg); }
.gym-deadlift-bar { position: absolute; top: 64px; left: 0; right: 0; height: 13px; border-radius: 3px; background: linear-gradient(#777e85, #e3e5e7 25%, #9ea3a9 48%, #3d4249 85%, #777d84); box-shadow: 0 6px 4px #0007; }
.gym-deadlift-bar::before { content: ''; position: absolute; inset: 2px 105px; background: repeating-linear-gradient(65deg, #262c342e 0 1px, transparent 1px 3px), repeating-linear-gradient(-65deg, #262c342e 0 1px, transparent 1px 3px); border-inline: 8px solid #b3b7bd; }
.gym-deadlift-bar::after { content: ''; position: absolute; inset: -3px 17px; border-inline: 45px solid #a8adb3; border-radius: 2px; box-shadow: inset 0 2px 0 #f1f2f3, inset 0 -3px 0 #565c63; }
.gym-deadlift-load { position: absolute; top: 7px; width: 128px; height: 128px; perspective: 500px; }
.gym-deadlift-load--left { left: 33px; }
.gym-deadlift-load--right { right: 33px; }
.gym-deadlift .gym-weight-plate { --plate-size: 164px; transform-origin: top left; transform: scale(.78) rotateY(-38deg) rotate(-12deg); box-shadow: inset 0 0 0 2px #ffffff12, inset 0 0 0 10px var(--plate-color), inset 0 0 0 12px #ffffff25, 8px 1px 0 var(--plate-deep), 13px 2px 0 #272b30, 18px 3px 0 #376ab0, 22px 4px 0 #1c447c, 9px 14px 10px #0008; }
.gym-deadlift-load--right .gym-weight-plate { transform: scale(.78) rotateY(-38deg); }
@media(max-width:850px) { .gym-deadlift { right: 25px; transform: scale(.85) rotate(-8deg); transform-origin: bottom right; } }
@media(max-width:650px) { .gym-launch-banner { padding-bottom: 146px; } .gym-deadlift { right: 10px; bottom: 27px; transform: scale(.65) rotate(-8deg); } }
@media(max-width:355px) { .gym-deadlift { right: 3px; transform: scale(.53) rotate(-8deg); } .gym-launch-banner { padding-bottom: 126px; } }

/* Both loads share the same viewing angle, hub alignment and plate depth. */
.gym-deadlift .gym-weight-plate--yellow {
  --plate-color: #d1aa38;
  --plate-edge: #b18a26;
  --plate-deep: #8d6c1d;
  box-shadow: inset 0 0 0 2px #ffffff12, inset 0 0 0 10px var(--plate-color), inset 0 0 0 12px #ffffff25, 7px 0 0 var(--plate-deep), 0 3px 3px #0002;
}
.gym-deadlift-rear {
  position: absolute;
  z-index: 0;
  left: calc(50% + 8px);
  top: 50%;
  width: 164px;
  height: 164px;
  box-sizing: border-box;
  border-radius: 50%;
  border: 7px solid #b18a26;
  background: #d1aa38;
  box-shadow: inset 0 0 0 2px #ffffff12, inset 0 0 0 10px #d1aa38, inset 0 0 0 12px #ffffff25, 7px 0 0 #8d6c1d;
  transform: translate(-50%, -50%) scale(.78) rotateY(-38deg);
}
.gym-deadlift .gym-weight-plate { z-index: 1; }
.gym-deadlift-bar::after { inset: -2px 10px; border-inline-width: 53px; background: none; }
.gym-deadlift-load--left { left: 39px; }
.gym-deadlift-load--right { right: 39px; }
/* Centre every hub on the shaft. The near sleeve is in front of the
   face, while the shaft and the far sleeve remain behind the loads. */
.gym-deadlift-bar {
  z-index: 1;
  left: 40px;
  right: 25px;
  top: 66px;
  height: 10px;
  background: linear-gradient(#b4bac1, #e0e3e6 38%, #858d96);
  box-shadow: 0 2px 2px #0005;
}
.gym-deadlift-bar::before, .gym-deadlift-bar::after { display: none; }
.gym-deadlift-load { z-index: 2; }
.gym-deadlift .gym-weight-plate,
.gym-deadlift-load--right .gym-weight-plate {
  position: absolute;
  left: 50%;
  top: 50%;
  transform-origin: center;
  transform: translate(-50%, -50%) scale(.78) rotateY(-38deg);
}
.gym-deadlift-load::after {
  content: '';
  position: absolute;
  z-index: 3;
  top: 59px;
  right: 56px;
  width: 67px;
  height: 10px;
  border-radius: 2px;
  background: linear-gradient(#b4bac1, #e0e3e6 38%, #858d96);
  box-shadow: 0 2px 2px #0005;
}
.gym-deadlift-load--left::after { width: 71px; }
/* The metal bushing occludes the shaft; only its black bore reveals it. */
.gym-deadlift-load::before {
  content: '';
  position: absolute;
  z-index: 4;
  left: 64px;
  top: 64px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: conic-gradient(from 30deg, #a1a5aa, #e1e3e5 12%, #b0b5ba 26%, #f5f6f7 42%, #8f959c 57%, #d8dce0 75%, #9fa5ab);
  mask-image: radial-gradient(circle, transparent 0 8px, #000 9px);
  clip-path: inset(0 0 0 50%);
  transform: translate(-50%, -50%) scale(.78) rotateY(-38deg);
  pointer-events: none;
}
.gym-arrow { display: inline-block; vertical-align: middle; flex-shrink: 0; }
.gym-module-price > .gym-module-launch-price { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.gym-module-price > .gym-module-launch-price strong { font-size: 36px; color: #987344; }
.gym-module-price > .gym-module-launch-price small { line-height: 1.8; }
.gym-swipe-hint, .gym-plan-pagination { display: none; }
@media(max-width:650px) {
  .gym-swipe-hint { display: flex; align-items: center; justify-content: space-between; margin-top: 28px; font-size: 11px; color: #727b86; }
  .gym-plans { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 88%; gap: 16px; margin-top: 8px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; padding: 16px 0 14px; scrollbar-width: thin; scrollbar-color: #cbb899 transparent; }
  .gym-plans > .gym-plan { scroll-snap-align: start; }
  .gym-plan-pagination { display: flex; justify-content: center; gap: 4px; margin-top: 12px; }
  .gym-plan-pagination button { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; background: transparent; cursor: pointer; }
  .gym-plan-pagination button::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #c9cdd2; }
  .gym-plan-pagination button[aria-current="true"]::before { background: #987344; width: 20px; border-radius: 4px; }
  .gym-plan-pagination button:focus-visible { outline: 2px solid #987344; outline-offset: -3px; border-radius: 6px; }
}