/* Card displays leave room for tilt and use one motion layer per card. */
.profile-showcase { padding: 24px; background: var(--surface); }
.mini-card:hover { transform: none; }
.mini-card, .pocket-card, .picker-card { position: relative; overflow: visible; }
.pocket:has(.lit), .pocket:has(.settling),
.profile-pocket:has(.lit), .profile-pocket:has(.settling),
.mini-card:has(.lit), .mini-card:has(.settling),
.picker-card:has(.lit), .picker-card:has(.settling),
.pin-slot:has(.lit), .pin-slot:has(.settling),
.slab:has(.lit), .slab:has(.settling) { position: relative; z-index: 5; }
/* Scrollable strips retain scrolling, with generous room inside the clip. */
.home-film { padding: 26px 18px 30px; margin-inline: -12px; gap: 20px; }
.pin-row { padding: 18px 8px; gap: 20px; overflow: visible; }
.picker-grid { padding: 18px 6px; gap: 18px; }
.thumbs { padding-block: 22px; }
.tcg img { transition: filter .32s ease; }
body.fx-holo .tcg, body.fx-holo .tcg.lit, body.fx-holo .tcg.settling { transition: box-shadow .32s ease; }

.binder-sharing-note, .binder-page-toolbar, .profile-section-head,
.profile-binder-page header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.binder-sharing-note { flex-wrap: wrap; }
.page-share:disabled { cursor: default; }
.profile-binder { margin: 24px 0; padding: 24px; }
.profile-section-head { margin-bottom: 22px; }
.profile-section-head h3 { margin: 0; color: var(--ink); }
.profile-section-head > span { color: var(--muted); font-size: 12px; }
.profile-binder-pages { max-width: 600px; margin: 0 auto; }
.profile-page-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; max-width: 600px; margin: 0 auto 18px; }
.profile-page-nav span { color: var(--muted); font-size: 13px; }
.profile-page-nav button { min-width: 92px; }
.profile-page-nav button:disabled { opacity: .35; cursor: default; }
.profile-binder-page { min-width: 0; padding: 18px; border: 1px solid var(--line); border-radius: var(--r-lg);
  background: var(--well); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.profile-binder-page header { margin: 0 0 20px; font-size: 12px; color: var(--muted); }
.profile-binder-page header b { white-space: nowrap; }
.profile-page-actions { display: flex; flex-wrap: wrap; gap: 14px; justify-content: flex-end; }
.profile-binder-page .binder-pockets { gap: 14px; }
.profile-pocket { position: relative; aspect-ratio: 63/88; min-width: 0; border-radius: 3.97% / 2.84%; }
.profile-pocket::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; border-radius: inherit;
  background: linear-gradient(158deg, rgba(255,255,255,.1) 0%, rgba(255,255,255,.035) 30%, transparent 52%); }
.profile-pocket .mini-card { width: 100%; display: block; }
.profile-pocket img { width: 100%; display: block; border-radius: 6px; }
/* An empty clear sleeve, as on /binder (css/pages/collection.css). */
.profile-pocket.empty { border: 0; background: rgba(255,255,255,.03); box-shadow: inset 0 0 0 1px rgba(255,255,255,.11); }
@media(max-width: 700px) {
  .profile-showcase, .profile-binder { padding: 18px 14px; }
}
@media(prefers-reduced-motion: reduce) { .tcg img { transition: none; } }

/* Tablet inspectors should not stretch a card to the entire viewport width. */
.inspect-art { width: 100%; max-width: min(400px, 84vw); margin-inline: auto; }

