/* The checkerboard continues from the existing doorway. All coordinates below
   use the same source origin (1022.4, 1256.6), at the doorway's bottom center. */
:where(html.shelftopia-v2) .stats-transition { --art-unit: .9px; position: relative; overflow-x: clip; overflow-y: visible; scroll-margin-block-start: 6rem; }
:where(html.shelftopia-v2) .stats-transition__scene { position: relative; height: calc(770.4 * var(--art-unit)); }
:where(html.shelftopia-v2) .stats-transition__checkerboard { position: absolute; left: calc(50% - 1022.4 * var(--art-unit)); top: calc(-156.6 * var(--art-unit)); width: calc(2048 * var(--art-unit)); max-width: none; }

:where(html.shelftopia-v2) .speaker-artwork { position: relative; overflow: hidden; background: #000; scroll-margin-block-start: 6rem; }
:where(html.shelftopia-v2) .speaker-artwork__desktop { display: block; width: 100%; height: auto; }
:where(html.shelftopia-v2) .speaker-artwork__cta { position: absolute; z-index: 1; left: 41.8945%; top: 16.1145%; width: 15.8691%; height: 3.1493%; border-radius: 999px; cursor: pointer; }
:where(html.shelftopia-v2) .speaker-artwork__cta:focus-visible { outline: 4px solid #fff; outline-offset: 4px; }
:where(html.shelftopia-v2) .speaker-responsive { display: none; }

:where(html.shelftopia-v2) .video-frame { min-height: 900px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; overflow: hidden; background: #000; }
:where(html.shelftopia-v2) .video-frame__title { margin: 0; padding-inline: 1rem; color: #fff; text-align: center; font: 400 clamp(2.5rem, 4.4vw, 4.875rem)/1.05 "ShelftopiaV2LookingGlass", serif; transform: translateY(60px); }
:where(html.shelftopia-v2) .video-frame__stage { position: relative; width: min(100%, 1150px); aspect-ratio: 2048 / 1455.88; }
:where(html.shelftopia-v2) .video-frame__window { position: absolute; inset: 0; -webkit-mask: url("../assets/images/video-window-mask.svg") center / 100% 100% no-repeat; mask: url("../assets/images/video-window-mask.svg") center / 100% 100% no-repeat; }
:where(html.shelftopia-v2) .video-frame__window video { position: absolute; left: 8%; top: 12%; width: 84%; height: 80%; object-fit: cover; }
:where(html.shelftopia-v2) .video-frame__art { position: absolute; inset: 0; display: block; width: 100%; height: 100%; pointer-events: none; }
:where(html.shelftopia-v2) .video-frame__controls { position: absolute; z-index: 1; left: 24%; right: 24%; bottom: 24%; display: flex; align-items: center; gap: .75rem; padding: .55rem .75rem; border: 1px solid #000; border-radius: .8rem; background: #fff; color: #000; font: 500 .85rem/1 ShelftopiaV2Poppins, sans-serif; }
:where(html.shelftopia-v2) .video-frame__controls button { flex: none; display: grid; place-items: center; width: 2rem; height: 2rem; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; }
:where(html.shelftopia-v2) .video-frame__controls button:focus-visible, :where(html.shelftopia-v2) .video-frame__seek:focus-visible { outline: 2px solid #000; outline-offset: 2px; }
:where(html.shelftopia-v2) .video-frame__seek { flex: 1; min-width: 0; height: 4px; margin: 0; appearance: none; -webkit-appearance: none; border-radius: 999px; background: linear-gradient(to right, #ffa525 0 var(--progress, 0%), #000 var(--progress, 0%) 100%); cursor: pointer; }
:where(html.shelftopia-v2) .video-frame__seek::-webkit-slider-thumb { width: 14px; height: 14px; appearance: none; -webkit-appearance: none; border: 0; border-radius: 50%; background: #ffa525; }
:where(html.shelftopia-v2) .video-frame__seek::-moz-range-thumb { width: 14px; height: 14px; border: 0; border-radius: 50%; background: #ffa525; }
:where(html.shelftopia-v2) .video-frame__time { flex: none; font-variant-numeric: tabular-nums; }

@media (min-width: 112.5rem) {
  :where(html.shelftopia-v2) .portal-scene, :where(html.shelftopia-v2) .stats-transition { --art-unit: 1px; }
}
@media (max-width: 64rem) {
  :where(html.shelftopia-v2) .video-frame { min-height: 0; }
  :where(html.shelftopia-v2) .video-frame__controls { left: 13%; right: 13%; bottom: 22%; gap: .25rem; padding: .2rem .4rem; font-size: .65rem; }
  :where(html.shelftopia-v2) .video-frame__controls button { width: 1.5rem; height: 1.5rem; }
  :where(html.shelftopia-v2) .stats-transition { --art-unit: .88px; }
  :where(html.shelftopia-v2) .speaker-artwork { isolation: isolate; color: #fff; }
  :where(html.shelftopia-v2) .speaker-artwork::before, :where(html.shelftopia-v2) .speaker-artwork::after { content: ""; position: absolute; z-index: -1; width: 1.1rem; aspect-ratio: 1; background: #fff; clip-path: polygon(50% 0, 60% 38%, 100% 50%, 60% 62%, 50% 100%, 40% 62%, 0 50%, 40% 38%); }
  :where(html.shelftopia-v2) .speaker-artwork::before { top: 12rem; left: 5%; }
  :where(html.shelftopia-v2) .speaker-artwork::after { top: 38rem; right: 5%; }
  :where(html.shelftopia-v2) .speaker-artwork__desktop, :where(html.shelftopia-v2) .speaker-artwork__cta { display: none; }
  :where(html.shelftopia-v2) .speaker-responsive { display: block; padding: clamp(4.5rem, 9vw, 6.5rem) clamp(1.25rem, 4vw, 2.5rem) 7rem; }
  :where(html.shelftopia-v2) .speaker-responsive__intro { max-width: 47rem; margin-inline: auto; text-align: center; }
  :where(html.shelftopia-v2) .speaker-responsive__intro h2 { margin: 0; font: 400 clamp(3rem, 8vw, 4.75rem)/.98 "ShelftopiaV2LookingGlass", serif; background: linear-gradient(100deg, #e559b1, #6d41d8); color: transparent; background-clip: text; -webkit-background-clip: text; }
  :where(html.shelftopia-v2) .speaker-responsive__intro p { max-width: 43rem; margin: 1.5rem auto; font-size: clamp(1rem, 2.2vw, 1.15rem); line-height: 1.65; }
  :where(html.shelftopia-v2) .speaker-responsive__cta { display: inline-flex; min-height: 3.5rem; align-items: center; justify-content: center; padding: .75rem 2rem; border-radius: 1.1rem; background: #ffd527; color: #000; font-size: 1.1rem; font-weight: 700; line-height: 1; text-decoration: none; text-transform: uppercase; box-shadow: 0 2px 0 #000; }
  :where(html.shelftopia-v2) .speaker-responsive__cta:hover { background: #ffe363; }
  :where(html.shelftopia-v2) .speaker-responsive__cta:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
  :where(html.shelftopia-v2) .speaker-responsive__grid { width: min(100%, 46rem); margin: 4rem auto 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4.5rem 2rem; }
  :where(html.shelftopia-v2) .speaker-responsive__card { min-width: 0; display: flex; flex-direction: column; align-items: center; text-align: center; }
  :where(html.shelftopia-v2) .speaker-responsive__card img { display: block; width: clamp(8rem, 22vw, 10.5rem); aspect-ratio: 1; border-radius: 50%; object-fit: cover; background: #ddd; }
  :where(html.shelftopia-v2) .speaker-responsive__card h3 { margin: .9rem 0 .3rem; font-size: 1.15rem; line-height: 1.25; }
  :where(html.shelftopia-v2) .speaker-responsive__card p { max-width: 17rem; margin: .4rem 0 0; font-size: .95rem; line-height: 1.45; }
  :where(html.shelftopia-v2) .speaker-responsive__card span { margin-top: .45rem; color: #ddd; font-size: .9rem; line-height: 1.35; overflow-wrap: anywhere; }
  :where(html.shelftopia-v2) .speaker-responsive__card .speaker-responsive__logo { width: auto; aspect-ratio: auto; border-radius: 0; object-fit: contain; background: transparent; }
  :where(html.shelftopia-v2) .speaker-responsive__card .speaker-responsive__logo--churchs { width: clamp(4rem, 10vw, 4.75rem); height: auto; margin-top: .1rem; }
  :where(html.shelftopia-v2) .speaker-responsive__card .speaker-responsive__logo--united { width: clamp(8rem, 20vw, 9.5rem); height: auto; margin: .7rem 0 .6rem; }
  :where(html.shelftopia-v2) .speaker-responsive__brand { min-height: 2.5rem; display: flex; flex-direction: column; justify-content: center; margin-top: .2rem; font: 400 .78rem/1 Georgia, serif; letter-spacing: .06em; }
  :where(html.shelftopia-v2) .speaker-responsive__brand small { font-size: .62rem; }
  :where(html.shelftopia-v2) .speaker-responsive__brand--petvalu { font-size: 1.75rem; letter-spacing: -.08em; }
}
/* Tablet and phone: preserve the doorway-to-floor connection. */
@media (max-width: 64rem) {
  :where(html.shelftopia-v2) .stats-transition { --art-unit: .78px; }
  :where(html.shelftopia-v2) .stats-transition__scene { height: 16rem; }
  :where(html.shelftopia-v2) .stats-transition__checkerboard { mask-image: linear-gradient(#000 25%, transparent 55%); }
}
@media (max-width: 37.5rem) {
  :where(html.shelftopia-v2) .speaker-responsive { padding-inline: 1rem; }
  :where(html.shelftopia-v2) .speaker-responsive__intro h2 { font-size: clamp(2.5rem, 12vw, 3.5rem); }
  :where(html.shelftopia-v2) .speaker-responsive__intro p { font-size: .97rem; }
  :where(html.shelftopia-v2) .speaker-responsive__grid { grid-template-columns: 1fr; gap: 4.25rem; }
  :where(html.shelftopia-v2) .speaker-responsive__card img { width: min(11rem, 48vw); }
  :where(html.shelftopia-v2) .speaker-responsive__card h3 { font-size: 1.2rem; }
}
@media (prefers-reduced-motion: reduce) {
}

@media (min-width: 37.501rem) and (max-width: 64rem) {
  :where(html.shelftopia-v2) .stats-transition { --art-unit: .88px; }
}