/* The outer pass stays in its layout; only its two paper faces turn. */
[data-inspect-card] {
  position:relative;
  perspective:1100px;
  perspective-origin:50% 45%;
  touch-action:pan-y;
  -webkit-user-select:none;
  user-select:none;
  cursor:grab;
}
.spotlight-pass[data-inspect-card] {
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}
.inspect-object {
  --inspect-x:0deg;
  --inspect-y:0deg;
  position:relative;
  transform-style:preserve-3d;
  transform:rotateX(var(--inspect-x)) rotateY(var(--inspect-y));
  transition:none;
}
.inspect-card.is-grabbing .inspect-object { transition:none; will-change:transform; }
.pass-face-front,.pass-face-back {
  padding:7px;
  border:1px solid #d4e1dc;
  border-radius:20px;
  background:var(--paper,#fff);
  box-shadow:0 2px 3px #163e4310,0 28px 32px -23px #163e436b;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}
.pass-face-front { position:relative; visibility:visible; transform:translateZ(1px); }
.pass-face-back {
  position:absolute;
  visibility:hidden;
  inset:0;
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  transform:rotateY(180deg) translateZ(1px);
}
.inspect-card a,.inspect-card button,.inspect-card input,.inspect-card select,.inspect-card textarea { cursor:pointer; }
.inspect-card [data-inspect-drag] {
  touch-action:pan-y;
  cursor:grab;
  -webkit-user-select:none;
  user-select:none;
  -webkit-user-drag:none;
}
.inspect-card.is-grabbing,.inspect-card.is-grabbing .inspect-object,.inspect-card.is-grabbing .inspect-object * { cursor:grabbing; }
.inspect-card [data-inspect-back]:focus-visible { outline-offset:-4px; }

@media (prefers-reduced-motion:reduce) {
  .inspect-object { transform:none; transition:none; }
  .pass-face-front,.pass-face-back { transform:none; -webkit-backface-visibility:visible; backface-visibility:visible; }
  .pass-face-back { visibility:hidden; }
  .inspect-card.is-flipped .pass-face-front { visibility:hidden; }
  .inspect-card.is-flipped .pass-face-back { visibility:visible; }
}
@supports not (transform-style:preserve-3d) {
  .inspect-object { transform:none; transition:none; }
  .pass-face-front,.pass-face-back { transform:none; }
  .pass-face-back { visibility:hidden; }
  .inspect-card.is-flipped .pass-face-front { visibility:hidden; }
  .inspect-card.is-flipped .pass-face-back { visibility:visible; }
}
