/*
 * ENGINEERS / PROJECT 002 — ORBITAL COFFEE BREWER
 * Local preview only. Every selector is mode-locked by the Project 002 body class.
 */
body.engineering-project-002-preview .pixel-bay-feed {
  container-type: inline-size;
}

body.engineering-project-002-preview .pixel-bay-image {
  position: relative;
  z-index: 1;
}

body.engineering-project-002-preview .relay-asset-layer,
body.engineering-project-002-preview .bay-ladder-prop,
body.engineering-project-002-preview .pixel-spark,
body.engineering-project-002-preview .pixel-steam {
  display: none;
}

body.engineering-project-002-preview .ocb-artifact {
  position: absolute;
  z-index: 9;
  top: 11.8%;
  left: 24.7%;
  width: 50.6%;
  height: auto;
  pointer-events: none;
  user-select: none;
  image-rendering: auto;
  filter: drop-shadow(0 1.05cqi .72cqi rgba(0, 0, 0, .68));
}

body.engineering-project-002-preview .engineer-sprite-layer {
  z-index: auto;
}

body.engineering-project-002-preview .engineer-sprite {
  --p002-facing: 1;
  opacity: 1;
  transform: translate(-50%, -100%) scaleX(var(--p002-facing));
  transition: none;
  will-change: auto;
}

body.engineering-project-002-preview .engineer-sprite[data-facing="left"] {
  --p002-facing: -1;
}

body.engineering-project-002-preview .engineer-sprite[data-depth="rear"] {
  filter: drop-shadow(0 .32cqi .22cqi rgba(0, 0, 0, .72)) brightness(.91);
}

body.engineering-project-002-preview .engineer-sprite.is-p002-working {
  animation: p002EngineerWork 1.6s ease-in-out infinite;
}

body.engineering-project-002-preview .engineer-sprite.is-p002-reading {
  animation: p002EngineerRead 3.2s ease-in-out infinite;
}

body.engineering-project-002-preview .engineer-sprite.is-p002-observing {
  animation: p002EngineerObserve 3.8s ease-in-out infinite;
}

body.engineering-project-002-preview .engineer-sprite.is-p002-sipping {
  animation: p002EngineerSip 2.4s ease-in-out infinite;
}

body.engineering-project-002-preview .engineer-work-spark {
  z-index: 16;
}

@keyframes p002EngineerWork {
  0%, 100% { transform: translate(-50%, -100%) scaleX(var(--p002-facing)) rotate(0); }
  50% { transform: translate(-50%, -100%) scaleX(var(--p002-facing)) rotate(-.7deg); }
}

@keyframes p002EngineerRead {
  0%, 100% { transform: translate(-50%, -100%) scaleX(var(--p002-facing)); }
  50% { transform: translate(-50%, calc(-100% - .18cqi)) scaleX(var(--p002-facing)); }
}

@keyframes p002EngineerObserve {
  0%, 100% { filter: brightness(.96); }
  50% { filter: brightness(1.08); }
}

@keyframes p002EngineerSip {
  0%, 100% { transform: translate(-50%, -100%) scaleX(var(--p002-facing)) rotate(0); }
  45%, 68% { transform: translate(-50%, calc(-100% - .22cqi)) scaleX(var(--p002-facing)) rotate(-1.4deg); }
}

/* These are the inner glass bounds of the canonical bay, never the bezels. */
body.engineering-project-002-preview .pixel-screen {
  z-index: 22;
  display: flex;
  box-sizing: border-box;
  overflow: hidden;
  justify-content: center;
  padding: .72cqi .64cqi;
  border: 0;
  background: radial-gradient(circle at 50% 44%, rgba(25, 107, 114, .19), rgba(1, 7, 9, .03) 74%);
}

body.engineering-project-002-preview .pixel-screen--lt {
  top: 7.02%;
  left: 5.98%;
  width: 12.70%;
  height: 18.10%;
}

body.engineering-project-002-preview .pixel-screen--lm {
  top: 29.45%;
  left: 5.48%;
  width: 13.55%;
  height: 15.55%;
}

body.engineering-project-002-preview .pixel-screen--rt {
  top: 7.02%;
  right: 5.28%;
  width: 10.98%;
  height: 18.35%;
}

body.engineering-project-002-preview .pixel-screen--rm {
  top: 30.15%;
  right: 4.98%;
  width: 11.38%;
  height: 15.62%;
}

body.engineering-project-002-preview .pixel-screen-label {
  margin: 0 0 .48em;
  padding: 0 0 .36em;
  font-size: clamp(4px, .58cqi, 9px);
  line-height: 1;
  letter-spacing: .055em;
}

body.engineering-project-002-preview .pixel-stat-grid {
  width: 100%;
  gap: .42em .42em;
  font-size: clamp(3px, .49cqi, 8px);
  line-height: 1.08;
}

body.engineering-project-002-preview .pixel-stat-grid span,
body.engineering-project-002-preview .pixel-stat-grid strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.engineering-project-002-preview .pixel-project-meter {
  height: clamp(2px, .22cqi, 4px);
  margin-bottom: .48em;
}

body.engineering-project-002-preview .pixel-feed-overlay {
  z-index: 24;
}

body.engineering-project-002-preview .pixel-scanlines {
  z-index: 25;
}

body.engineering-project-002-preview .project-completion-note {
  display: block;
  margin: 12px 0 0;
  color: rgba(113, 215, 221, .74);
  font: .57rem/1.5 ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  letter-spacing: .09em;
  text-transform: uppercase;
}

body.engineering-project-002-preview .project-completion-note--hidden {
  display: none;
}

body.engineering-align-debug.engineering-project-002-preview .ocb-artifact {
  outline: 1px solid rgba(98, 225, 175, .92);
}

body.engineering-align-debug.engineering-project-002-preview .engineer-sprite[data-depth="rear"] {
  outline-color: rgba(126, 162, 255, .92);
}

body.engineering-align-debug.engineering-project-002-preview .engineer-sprite,
body.engineering-align-debug.engineering-project-002-preview .engineer-work-spark {
  animation: none !important;
}

@media (max-width: 760px) {
  body.engineering-project-002-preview .ocb-artifact {
    top: 11.8%;
    left: 24.7%;
    width: 50.6%;
  }

  body.engineering-project-002-preview .pixel-screen {
    padding: .52cqi .48cqi;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.engineering-project-002-preview .engineer-sprite,
  body.engineering-project-002-preview .engineer-sprite.is-p002-working,
  body.engineering-project-002-preview .engineer-sprite.is-p002-reading,
  body.engineering-project-002-preview .engineer-sprite.is-p002-observing,
  body.engineering-project-002-preview .engineer-sprite.is-p002-sipping,
  body.engineering-project-002-preview .engineer-work-spark {
    animation: none !important;
    transition: none !important;
  }
}
