/* First-person robotic vision. Physical optics stay at the frame's edges. */
.observer-eye { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.optical-vignette {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 50% 48%, transparent 39%, #071e151a 61%, #05150f80 85%, #030d09d9 100%);
  box-shadow: inset 0 0 32px #04140d55;
}
.optical-interior { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.optical-baffles { transform-origin: 300px 300px; }
.observer-focus { transform: translate(361px, 244px); }
.focus-brackets { transform-origin: 0 0; filter: drop-shadow(0 1px 2px #061a13cc); }
.optical-scan { transform: translateY(180px); opacity: 0; }
.optical-mode {
  position: absolute; top: 16%; left: 16%;
  display: flex; align-items: center; gap: 8px;
  color: #e19cff; font: 8px/1.4 var(--mono); letter-spacing: 2px;
  text-shadow: 0 1px 6px #001108;
}
.optical-mode i { display: block; width: 3px; height: 3px; background: #de91ff; }
.motion-enabled .observer-focus, .motion-paused .observer-focus { animation: optical-observe 22s cubic-bezier(.5, 0, .2, 1) infinite; }
.motion-enabled .focus-brackets, .motion-paused .focus-brackets { animation: optical-acquire 7.33s ease-in-out infinite; }
.motion-enabled .optical-baffles, .motion-paused .optical-baffles { animation: optical-adjust 22s ease-in-out infinite; }
.motion-enabled .optical-scan, .motion-paused .optical-scan { animation: optical-scan 11s ease-in-out infinite; }
.hero-motion-idle .observer-eye * { animation-play-state: paused !important; }

/* Scripted inspection holds, not tracking/detection of the video contents. */
@keyframes optical-observe {
  0%, 20%, 100% { transform: translate(361px, 244px); }
  29%, 51% { transform: translate(222px, 389px); }
  62%, 84% { transform: translate(228px, 141px); } /* top gear jewel in the tourbillon video (was 403,371 for the old video) */
}
@keyframes optical-acquire {
  0%, 68%, 100% { transform: scale(1); opacity: .8; }
  78% { transform: scale(1.22); opacity: .45; }
  90% { transform: scale(.88); opacity: 1; }
}
@keyframes optical-adjust {
  0%, 20%, 51%, 84%, 100% { transform: scale(1); }
  26%, 58%, 94% { transform: scale(1.025); }
}
@keyframes optical-scan {
  0%, 8% { transform: translateY(145px); opacity: 0; }
  18% { opacity: .65; }
  65% { opacity: .35; }
  78%, 100% { transform: translateY(458px); opacity: 0; }
}
@media (max-width: 760px) {
  .optical-mode { font-size: 6px; letter-spacing: 1.4px; gap: 5px; }
}
.motion-paused .optical-scan { opacity: 0 !important; }
.no-js .observer-eye *, .motion-paused .observer-eye * { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) {
  .observer-eye * { animation: none !important; }
  .optical-scan { opacity: 0; }
}

/* Neon purple accents (Peter, 2026-10-22): the eye's "attention" glows; the dark optical frame stays on-palette. */
.focus-brackets { filter: drop-shadow(0 0 2px #c233ff) drop-shadow(0 0 7px #c233ffaa); }
.focus-brackets * { stroke-opacity: 1; }
.optical-baffles { filter: drop-shadow(0 0 3px #b233ff66); }
.optical-mode { filter: drop-shadow(0 0 4px #c233ffcc); }