/* 3D card language: perspective tilt, glass bevel, moving specular glare, layered depth shadow. */
.fx3d {
  --rx: 0deg; --ry: 0deg; --gx: 50%; --gy: 30%; --lift: 0;
  position: relative;
  transform: perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) translateZ(0) scale(calc(1 + var(--lift) * .012));
  transform-style: preserve-3d;
  transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease, border-color .25s ease;
  will-change: transform;
}
.fx3d:hover {
  box-shadow:
    0 1px 0 rgba(255,255,255,.14) inset,
    0 -10px 18px -8px rgba(0,0,0,.55) inset,
    0 22px 38px -14px rgba(0,0,0,.75),
    0 8px 22px -10px rgba(55,138,221,.45);
}
.fx3d.fx3d-press { transform: perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)) scale(.975); transition-duration: .08s; }

/* bevel: bright top edge, dark bottom edge */
.fx3d::before {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 1;
  background: linear-gradient(180deg, rgba(255,255,255,.16) 0%, transparent 42%, rgba(0,0,0,.26) 100%);
  mix-blend-mode: overlay;
}
/* glare follows the pointer */
.fx3d::after {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 2;
  background: radial-gradient(260px circle at var(--gx) var(--gy), rgba(255,255,255,.22), rgba(255,255,255,.05) 40%, transparent 65%);
  opacity: calc(var(--lift) * 1);
  transition: opacity .25s ease;
}
/* children float above the card plane */
.fx3d > * { position: relative; z-index: 3; }
.fx3d > .lb-pod-av, .fx3d .lb-pod-medal { transform: translateZ(26px); }

/* gold edge-light for the "my place" card */
.lb-me.fx3d { box-shadow: 0 12px 34px -12px rgba(212,175,55,.55), 0 1px 0 rgba(255,255,255,.2) inset; }

@media (prefers-reduced-motion: reduce) {
  .fx3d, .fx3d.fx3d-press { transform: none; transition: none; }
  .fx3d::after { display: none; }
}
@media (hover: none) { .fx3d::after { display: none; } }

/* transparent wrappers tilt but draw no plate of their own */
.fx3d.fx3d-bare::before, .fx3d.fx3d-bare::after { display: none; }
.fx3d.fx3d-bare:hover { box-shadow: none; }
.fx3d-bare .lb-pod-block { box-shadow: 0 14px 26px -12px rgba(0,0,0,.8), 0 1px 0 rgba(255,255,255,.18) inset; }
.lb-row, .lb-row:hover, .lb-row *, .lb-pod, .lb-pod:hover, .lb-pod * { text-decoration: none !important; }