/* workspace/starcode/css/cosmos-scanoverlay.css
   SC-SCANGAME-POLISH: the survey-scan minigame overlay and its finish
   toast, split out of cosmos-reveal.css (house 500-line ceiling). The
   mount is a fixed full-viewport layer with NO backdrop fill: the reveal
   scene, and the framed body at its center, stay visible underneath the
   whole time. The stage (the square the minigame canvas lives in) is
   positioned and sized per frame by js/scan-body-adapter.js so the needle
   ring sits centered on the scanned body; the canvas itself paints a soft
   ring-shaped veil for readability and leaves an untinted aperture hole
   over the body (js/scan-final-fx.js's drawSceneVeil). pointer-events is
   auto on the mount, not just the canvas: a full-screen overlay has to
   swallow every tap, or a button under it would still be reachable. */
.body-scan-mount {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: transparent;
  pointer-events: auto;
  touch-action: none;
  opacity: 0;
  transition: opacity 0.38s ease;
}
/* Graceful fade: js/scan-body-adapter.js adds body-scan-live one reflow
   after unhiding the mount, and removes it at teardown, flipping hidden
   back on only after this transition has run out. */
.body-scan-mount.body-scan-live { opacity: 1; }
.body-scan-mount[hidden] { display: none; }
/* RENDER ON TOP (owner playtest 2026-08-24): nothing on the page carries a
   z-index above the mount's 10000 (the achievement toast's 9999 is the
   closest), so no element truly paints over the ring -- but the mount is
   transparent, so all the reveal chrome under it (the open body sheet, the
   SCAN and probe buttons, the orbit arrows, the habitable-band button, the
   status pills, the hover tooltip plate, the nav header, and the
   achievement/transmission notices that can pop mid-scan) stayed fully
   visible through the overlay and read as sitting in front of the
   minigame. While the scan is live this one rule blanks all of it: every
   reveal-container chrome child, the actions row, the nav header, the
   fixed gear and sound-edit toggles, and the two body-level notices. The
   nav header is hidden too, not left above: the mount already swallows
   every tap, so during a scan the header is dead controls, and the
   overlay's own close X and the Escape key both remain as exits.
   SC-SCANGAME-WRECK: the thing being scanned must stay visible inside the
   aperture hole, so every layer that renders it is exempt from the blank.
   When this rule was written the reveal stage was ONE canvas
   (.reveal-canvas) and exempting it alone kept the whole scene. The
   orrery 3D port then split the stage into three stacked canvases
   (.reveal-backdrop starfield, .reveal-scene WebGL orrery, .reveal-canvas
   2D overlay) and added the .find-viewer-mount close-up as a fourth
   sibling -- and this rule, unchanged, silently hid the new three. Every
   scanned body (planets included) lost its real render; wrecks, ghost
   ships, and debris fields at their starless sites had nothing bright
   enough for the bloom composite to leak through, so their aperture
   showed pure black. All four render layers stay visible now: the
   backdrop and scene carry the body or the in-scene hull, the 2D overlay
   carries the debris-field shard scatter, and the close-up mount carries
   the wreck or ghost-ship viewer the aperture frames. */
body:has(.body-scan-mount.body-scan-live)
  :is(.reveal-container > :not(.reveal-canvas, .reveal-scene, .reveal-backdrop, .find-viewer-mount), .reveal-actions, header, #optionsToggle, #audioEditToggle, #_logBtn, .achieve-toast, .transmission-notice) { visibility: hidden; }
/* The overlay title: SCANNING and the body name, quiet and letter-spaced
   like the galaxy-name titles the map draws (galaxymap-draw-background.js's
   drawGalaxyName voice). The scene behind is live and can be bright, so the
   color sits a step above the old over-black dimness and a soft dark halo
   keeps it readable over a star's glare. */
.body-scan-title {
  position: absolute;
  top: max(14px, env(safe-area-inset-top));
  left: 0;
  right: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  gap: 0;
  font-family: var(--font-data);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.5em;
  color: rgba(168, 178, 198, 0.55);
  font-size: 20px;
  text-align: center;
  text-shadow: 0 1px 10px rgba(2, 3, 8, 0.9);
  pointer-events: none;
}
/* One line: the word and the body's own name side by side, the name
   quieter than the word (owner 2026-08-27). */
.body-scan-title-label { font-size: 30px; }
.body-scan-title-name { font-size: 30px; opacity: 0.62; margin-left: 0.5em; }
.btn-body-scan-close {
  position: absolute;
  top: max(12px, env(safe-area-inset-top));
  right: 14px;
  width: 38px;
  height: 38px;
  padding: 0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(8, 14, 26, 0.6);
  border: 1px solid var(--border);
  color: var(--text-secondary);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.btn-body-scan-close:hover { border-color: var(--accent); color: var(--accent); }
/* The stage: an absolutely positioned square, centered on the scanned
   body's live screen position by js/scan-body-adapter.js (inline
   left/top/width/height every reveal frame). The defaults below only hold
   for the instant before the first positioning call lands. */
.body-scan-stage {
  position: absolute;
  left: calc(50vw - 50vmin);
  top: calc(50vh - 50vmin);
  width: 100vmin;
  height: 100vmin;
}
.body-scan-mount canvas {
  display: block;
  width: 100%;
  height: 100%;
  touch-action: none;
  pointer-events: auto;
}
/* AMBER AUDIT (owner directive 2026-08-21): the engine's own hint line and
   RESOLVED flash are the page-demo's own text cues -- in the live game the
   ring, the pulses, and the peaks ARE the teacher, and the only typed words
   this screen shows are the title area's own and the finish toast below.
   Both stay in the DOM (scan-final.js still writes into them every frame,
   untouched) -- just never painted here. */
.body-scan-hint, .body-scan-resolved { display: none; }
/* The finish toast: after the overlay fades out, a brief strictly vertical
   list of the detected resources, one detection per line, nothing else.
   Each line is a plus sign, the detection's badge (an element square or a
   chip, css/cosmos-badges.css), and the star glyphs. Positioned by
   js/scan-body-adapter.js at the scanned body's screen point; the
   translate centers it there. TRIPLE SIZE (owner playtest 2026-08-24): the
   line text is 51px, three times the 17px it launched at, and the box's
   padding, gaps, radius, and border grew with it. No max-width here on
   purpose: a width clamp would make the widest line spill past the box's
   own border -- the phone rule below is what keeps the box on-screen. */
.body-scan-toast {
  position: fixed;
  z-index: 10001;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  /* No box (owner 2026-08-27): the rewards read straight off the scene.
     A drawn shadow does the work the backing plate used to, so the lines
     stay legible over a bright world without a plate around them. */
  background: none;
  border: 0;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.95), 0 0 26px rgba(0, 0, 0, 0.8);
  font-family: var(--font-data);
  font-size: 51px;
  letter-spacing: 0.12em;
  color: #ffffff;
  /* The lines take the tap that dismisses them (js/scan-body-adapter.js's
     hideDetectionToast). They sit over the scanned body, so a tap passing
     through them would select that body and open its info panel instead of
     clearing the reward. [hidden] below is what lets taps through again,
     and that only lands once the lines have finished fading. */
  pointer-events: auto;
  opacity: 0;
}
/* "Got it": each line drifts upward as it fades, the way a pickup reads in
   any other game -- the scan lifted these off the world. */
.body-scan-toast-line {
  opacity: 0;
  transform: translateY(16px);
}
.body-scan-toast.show .body-scan-toast-line {
  animation: bodyScanReward 2.6s cubic-bezier(0.16, 0.84, 0.34, 1) forwards;
}
.body-scan-toast.show .body-scan-toast-line:nth-child(2) { animation-delay: 0.16s; }
.body-scan-toast.show .body-scan-toast-line:nth-child(3) { animation-delay: 0.32s; }
.body-scan-toast.show .body-scan-toast-line:nth-child(4) { animation-delay: 0.48s; }
@keyframes bodyScanReward {
  0%   { opacity: 0; transform: translateY(16px); }
  14%  { opacity: 1; transform: translateY(0); }
  68%  { opacity: 1; transform: translateY(-14px); }
  100% { opacity: 0; transform: translateY(-46px); }
}
/* Phone screens (360px portrait is the floor): the adapter's inline
   left/top put the box at the scanned body's screen point, which can sit
   near an edge, and the widest possible line (a Biosignature chip plus
   three stars) is wider than 360px at full size. Both !important overrides
   beat that inline position on purpose -- the box pins to the screen
   center -- and the scale keeps every line inside the viewport while the
   type stays proportionally tripled: the widest box is 464px in layout,
   348px on screen at scale 0.75, inside a 360px viewport. */
@media (max-width: 480px) {
  .body-scan-toast {
    left: 50vw !important;
    top: 50vh !important;
    transform: translate(-50%, -50%) scale(0.75);
  }
}
.body-scan-toast.show { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .body-scan-toast.show .body-scan-toast-line { animation: none; opacity: 1; transform: none; }
}
.body-scan-toast[hidden] { display: none; }
.body-scan-toast-line { display: flex; align-items: center; gap: 14px; }
/* Star glyphs grade a detection's richness; an empty span is a zero-star
   trace detection -- display none keeps its flex gap from showing too. */
.body-scan-toast-stars { color: var(--accent); letter-spacing: 0.06em; }
.body-scan-toast-stars:empty { display: none; }