/* One continuous photograph: the ring, sky, plinth and reflection share the same image. */
.sense-scene { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.sense-image { filter:none; }
.sense-live-scene { display:block; }
/* Clip the light to each optical lens and retain the photograph's reflections. */
.sense-sensor-pulse { opacity:.035; animation:sense-sensor-sample 3.8s ease-in-out infinite; animation-play-state:paused; mix-blend-mode:screen; }
.sense-sensor-pulse--two { animation-delay:-.7s; }
.sense-sensor-pulse--three { animation-delay:-1.4s; }
.sense-sensor-pulse--four { animation-delay:-2.1s; }
.page-frame.is-current #instrument[aria-hidden="false"] .sense-sensor-pulse { animation-play-state:running; }
@keyframes sense-sensor-sample { 0%,12%,32%,100% { opacity:.035; } 18% { opacity:.7; } 24% { opacity:.08; } }
@media (prefers-reduced-motion:reduce) {
  .sense-sensor-pulse { animation:none; opacity:.12; }
}
.sense-stage .scene-shade {
  background:linear-gradient(90deg,#080e10df 0%,#080e108a 35%,#080e1012 53%,transparent 67%),linear-gradient(0deg,#080e1066,transparent 25%);
}
.fullpage-ready .sense-copy { max-width:min(42vw,650px); }
/* Keep the entire ring in the short chapter viewport on laptops. Fade only the
   outer landscape edges; the product and the view through it stay in one photograph. */
@media (min-width:1051px) and (max-height:800px) {
  .fullpage-ready .sense-stage { background:#080e10; }
  .fullpage-ready .sense-image { left:50%; top:-11%; width:auto; max-width:none; height:122%; transform:translateX(-42%); mask-image:linear-gradient(90deg,transparent,#000 35%,#000 88%,transparent); }
}
@media (min-width:701px) and (max-width:1050px) {
  .fullpage-ready .sense-stage { --ring-scene-height:clamp(310px,56.25vw,490px); display:block; padding-top:calc(var(--ring-scene-height) + 22px); background:#0a1114; }
  .fullpage-ready .sense-scene { height:var(--ring-scene-height); }
  .fullpage-ready .sense-image { height:var(--ring-scene-height); object-position:center; }
  .fullpage-ready .sense-stage .scene-shade { height:var(--ring-scene-height); background:linear-gradient(0deg,#0a1114,transparent 25%); }
}
@media (max-width:1050px) {
  .fullpage-ready .sense-copy { max-width:none; }
}
@media (max-width:700px) {
  .fullpage-ready .sense-scene { height:var(--mobile-scene-height); }
  .fullpage-ready .sense-stage .scene-shade { background:linear-gradient(0deg,#0a1114,transparent 25%); }
}