(function(){
/* FORGE · Space tenant — Traveler station 3: Integration + alignment.
   Wave A1 / Agent #13. Single screen, registers at /traveler/motor-assy
   (Space tenant aliases the pump traveler slot for this station).

   Source of truth: forge-web/demo/tenant-spec/space.md §8 station 3.
   Mirror reference: forge-web/client/pump/act4-screens.jsx
   ScreenStationMotorAssy (~line 2018).

   Babel-standalone, no ES imports / exports. Globals expected:
     React, navigate, registerPumpRoute / registerSpaceRoute,
     UI primitives (Btn, I, Pill).
   Renders independently of the pump fixture; no _a4_ helpers required.

   KESTREL-3 station s3 — Integration + alignment on the granite bench.
   Star-tracker boresight to imager focal plane via Faro Vantage laser
   tracker, mass-property re-verification (cg, MOI), torque sequence map
   for primary structure fasteners, photo + signoff per axis. Emits
   INTEGRATION_COMPLETE on pass. Cool-blue palette, mono digits, mass in
   grams, alignment in arc-seconds. ITAR / AS9100 banner, no neon.
*/

const { useState: uSI3, useEffect: uEI3 } = React;

/* ────────────────────────────────────────────────────────────────────
   Local style atoms — keep this file self-contained so no shared
   cross-cutting helper is required at this wave. Cool blue over deep
   navy per space.md §10.
   ──────────────────────────────────────────────────────────────────── */

// Wave 12D · w12d-aet-light-rest — rebound to canonical light tokens so
// this screen reads as a sibling of dashboard.jsx (cream surface, dark ink).
const _SI3_INK2      = "var(--ink-3)";
const _SI3_ACC       = "#2D5BEA";
const _SI3_LINE      = "var(--line)";
const _SI3_INK_DIM   = "var(--ink-3)";
const _SI3_INK_FAINT = "var(--ink-4)";
const _SI3_OK        = "var(--ok)";
const _SI3_WARN      = "var(--warn)";
const _SI3_ERR       = "var(--err)";
const _SI3_FONT_MONO = "var(--font-mono, ui-monospace, SFMono-Regular, Menlo)";

// Hoisted style atoms — extracted from inline JSX for react-doctor compliance.
const _si3_statBase = {
  display: "inline-flex", alignItems: "center", gap: 4,
  fontFamily: _SI3_FONT_MONO, fontSize: 12, letterSpacing: "0.06em",
  textTransform: "uppercase",
};
const _si3_avatarBase = {
  display: "inline-flex", alignItems: "center", justifyContent: "center",
  width: 32, height: 32, borderRadius: "50%",
  background: "color-mix(in oklch, " + _SI3_ACC + " 16%, var(--bg-2))",
  color: _SI3_ACC, border: "1px solid color-mix(in oklch, " + _SI3_ACC + " 30%, var(--line))",
  fontFamily: _SI3_FONT_MONO, fontSize: 12, letterSpacing: "0.04em", fontWeight: 600,
};
const _si3_itarTagBase = {
  marginLeft: 4, padding: "1px 6px",
  border: "1px solid var(--line)", borderRadius: 3,
  fontSize: 12, color: _SI3_INK_DIM, letterSpacing: "0.06em",
  fontFamily: _SI3_FONT_MONO, textTransform: "uppercase",
};
const _si3_calloutBase = {
  marginTop: 8, padding: "8px 10px",
  border: "1px solid " + _SI3_LINE,
  borderRadius: 3,
  fontSize: 12, color: _SI3_INK_DIM,
  fontFamily: _SI3_FONT_MONO, letterSpacing: "0.02em",
};
const _si3_torqueRowBase = {
  display: "grid", gridTemplateColumns: "30px 1fr 1fr 80px 60px",
  padding: "6px 10px", gap: 6, fontSize: 12,
  borderBottom: "1px dashed var(--line-soft)", alignItems: "center",
};
const _si3_photoCellBase = {
  borderRadius: 3, display: "flex", flexDirection: "column",
  alignItems: "center", justifyContent: "center",
  fontSize: 12, textAlign: "center", gap: 4, padding: 6,
};
const _si3_footnoteBase = {
  marginTop: 8, padding: "6px 10px",
  background: "var(--bg-1)",
  border: "1px solid var(--line-soft)", borderRadius: 3,
  fontSize: 12, color: _SI3_INK_DIM,
  fontFamily: _SI3_FONT_MONO, letterSpacing: "0.02em",
};
const _si3_torqueNoteTag = {
  marginLeft: 6, padding: "0 4px",
  border: "1px solid " + _SI3_ACC, borderRadius: 2,
  fontSize: 12, color: _SI3_ACC,
  fontFamily: _SI3_FONT_MONO, letterSpacing: "0.04em",
};

function _si3_dot(tone) {
  const map = { ok: _SI3_OK, warn: _SI3_WARN, err: _SI3_ERR, info: _SI3_ACC, mute: _SI3_INK_FAINT };
  const c = map[tone] || tone || _SI3_INK_FAINT;
  return React.createElement("span", {
    style: { display: "inline-block", width: 7, height: 7, borderRadius: "50%", background: c, boxShadow: "0 0 0 2px color-mix(in oklch, " + c + " 18%, transparent)", flexShrink: 0 },
  });
}

function _si3_kv(k, v, mono) {
  return (
    <div style={{ display: "flex", justifyContent: "space-between", alignItems: "baseline", padding: "5px 10px", borderBottom: "1px dashed var(--line-soft)", fontSize: 12 }}>
      <span className="label" style={{ color: _SI3_INK_FAINT }}>{k}</span>
      <span className={mono ? "mono tnum" : ""} style={{ color: "var(--ink-2)", fontFamily: mono ? _SI3_FONT_MONO : undefined }}>{v}</span>
    </div>
  );
}

function _SI3Stat({ pass, label }) {
  return (
    <span style={{ ..._si3_statBase, color: pass ? _SI3_OK : _SI3_ERR }}>
      {_si3_dot(pass ? "ok" : "err")}
      <span>{label || (pass ? "pass" : "fail")}</span>
    </span>
  );
}

function _SI3Initials(n) {
  if (!n) return "—";
  const parts = String(n).replace(/[^A-Za-z. ]/g, "").split(/\s+/).filter(Boolean);
  if (!parts.length) return "—";
  const a = parts[0][0] || "";
  const b = parts[1] ? parts[1][0] : (parts[0][1] || "");
  return (a + b).toUpperCase();
}

function _SI3Header({ operator, station, seq, wo, right }) {
  return (
    <div style={{ padding: "10px 14px", background: "color-mix(in oklch, " + _SI3_ACC + " 6%, var(--bg-2))", borderBottom: "1px solid var(--line)", display: "flex", alignItems: "center", gap: 14 }}>
      <span style={_si3_avatarBase}>{_SI3Initials(operator)}</span>
      <div style={{ flex: 1, minWidth: 0 }}>
        <div style={{ fontSize: 13, color: "var(--ink)", display: "flex", alignItems: "center", gap: 8 }}>
          <b>{operator}</b>
          <span style={{ color: _SI3_INK_FAINT }}>·</span>
          <span style={{ color: "var(--ink-2)" }}>{station}</span>
          {seq && <span className="mono" style={{ marginLeft: 6, padding: "1px 6px", border: "1px solid " + _SI3_ACC, borderRadius: 3, fontSize: 12, color: _SI3_ACC, fontFamily: _SI3_FONT_MONO }}>seq {seq}</span>}
          <span className="mono" style={_si3_itarTagBase}>itar · as9100</span>
        </div>
        <div className="mono" style={{ fontSize: 12, color: _SI3_INK_FAINT, marginTop: 2, fontFamily: _SI3_FONT_MONO }}>{wo}</div>
      </div>
      {right}
    </div>
  );
}

/* ════════════════════════════════════════════════════════════════════
   Screen — Integration + alignment   /traveler/motor-assy   (space)
   ──────────────────────────────────────────────────────────────────── */

function ScreenAetherionIntegration() {
  const operator   = "M. Sato";
  const stationName = "Integration + alignment (s3)";
  const [serial]   = uSI3("KESTREL-3 · FM-001");
  const [signed, setSigned] = uSI3(false);
  const [emitted, setEmitted] = uSI3(false);

  uEI3(() => {
    const onTenant = () => { setSigned(false); setEmitted(false); };
    if (typeof window !== "undefined") {
      window.addEventListener("forge:tenant-change", onTenant);
      return () => window.removeEventListener("forge:tenant-change", onTenant);
    }
    return undefined;
  }, []);

  // Faro Vantage laser-tracker readout. Three alignment axes the spec
  // calls out at §8 station 3: solar panel deployment angle, antenna
  // boresight, optical bench reference (star-tracker → imager focal).
  // Tracker accuracy 25 µm at 2 m → ≈ 2.6 arc-seconds floor.
  const align = [
    {
      id: "ALN-1",
      axis: "Solar-array deployment angle",
      ref:  "stowed-frame X+ → deploy normal",
      target_arcsec:   0.0,
      captured_arcsec: 7.4,
      tol_arcsec: 18.0,           // ±18″ deployment tolerance
      target_mm: "± 0.025",
      captured_mm: "+ 0.014",
      ok: true,
    },
    {
      id: "ALN-2",
      axis: "X-band antenna boresight",
      ref:  "payload deck Z+ → antenna mech-axis",
      target_arcsec:   0.0,
      captured_arcsec: 12.6,
      tol_arcsec: 30.0,           // ±30″ comm boresight
      target_mm: "± 0.040",
      captured_mm: "− 0.022",
      ok: true,
    },
    {
      id: "ALN-3",
      axis: "Optical bench · star-tracker → imager",
      ref:  "Sodern Auriga CP boresight → 1m-GSD focal plane",
      target_arcsec:   0.0,
      captured_arcsec: 4.1,
      tol_arcsec: 6.0,            // ±6″ boresight (most tightly controlled)
      target_mm: "± 0.010",
      captured_mm: "+ 0.006",
      ok: true,
    },
  ];

  // Mass-property re-verification on the granite bench. CG measured on
  // a triaxial Space Electronics POI/CG fixture; MOI from torsion
  // pendulum. Targets from §2 mass budget.
  const mass = {
    dry_g_target: 14000,
    dry_g_captured: 12446,
    dry_g_margin_pct: 11.10,                 // 14000 - 12446 = 1554 g, 11.10%
    cg_target_mm:   "(0, 0, 110.0) ± 1.0",
    cg_captured_mm: "(0.4, −0.2, 110.6)",
    cg_offset_mm:   "0.74",                  // sqrt(0.4²+0.2²+0.6²)
    moi_xx_target:  "1.840 ± 0.040",
    moi_xx_captured:"1.853",
    moi_yy_target:  "1.840 ± 0.040",
    moi_yy_captured:"1.821",
    moi_zz_target:  "0.620 ± 0.030",
    moi_zz_captured:"0.628",
  };

  // Torque sequence map for primary structure fasteners (§3 KESTREL-3.10
  // skeletonized). Cross-pattern tightening, two-pass with re-torque
  // audit at +24 h. Hinge fastener (HG-03) is post-ECO A286 + Belleville
  // stack per §6 ECO-AET-0042.
  const torque = [
    { tag: "PS-A1 · M5 A286 · long-rail mid",      seq: 1, target_nm: "5.40 ± 0.20", captured_nm: "5.46", pass: true },
    { tag: "PS-A2 · M5 A286 · long-rail mid",      seq: 2, target_nm: "5.40 ± 0.20", captured_nm: "5.42", pass: true },
    { tag: "PS-B1 · M5 A286 · short-rail upper",   seq: 3, target_nm: "5.40 ± 0.20", captured_nm: "5.39", pass: true },
    { tag: "PS-B2 · M5 A286 · short-rail upper",   seq: 4, target_nm: "5.40 ± 0.20", captured_nm: "5.51", pass: true },
    { tag: "PS-C  · M4 A2-70 · payload-deck shelf", seq: 5, target_nm: "2.80 ± 0.10", captured_nm: "2.81", pass: true },
    { tag: "PS-D  · M4 A2-70 · payload-deck shelf", seq: 6, target_nm: "2.80 ± 0.10", captured_nm: "2.78", pass: true },
    { tag: "HG-03 · M3 A286 + Belleville HHHL · hinge", seq: 7, target_nm: "0.55 ± 0.05", captured_nm: "0.56", pass: true, note: "post-ECO-AET-0042" },
    { tag: "HG-04 · M3 A286 + Belleville HHHL · hinge", seq: 8, target_nm: "0.55 ± 0.05", captured_nm: "0.55", pass: true },
  ];

  // Photos required per axis (one signoff each). Three alignment shots,
  // plus a granite-bench overall and a CG-fixture witness. ITAR-tagged.
  const photos = [
    { tag: "ALN-1 solar-array boresight tooling",   captured: true,  axis: "X+" },
    { tag: "ALN-2 antenna boresight reticle",       captured: true,  axis: "Z+" },
    { tag: "ALN-3 star-tracker → imager pair",      captured: true,  axis: "boresight" },
    { tag: "Granite bench overall · serial decal",  captured: true,  axis: "—" },
    { tag: "CG fixture witness · X-axis swing",     captured: false, axis: "X-axis" },
  ];

  const allAlignOK   = align.every(a => a.ok);
  const allTorqueOK  = torque.every(t => t.pass);
  const photosCount  = photos.filter(p => p.captured).length;
  const photosTotal  = photos.length;
  const allPhotosOK  = photosCount === photosTotal;
  const massOK       = (mass.dry_g_captured <= mass.dry_g_target);
  const passReady    = allAlignOK && allTorqueOK && massOK && (photosCount >= 4);

  function emit() {
    setSigned(true);
    setEmitted(true);
    if (typeof window !== "undefined" && typeof window.dispatchEvent === "function") {
      window.dispatchEvent(new CustomEvent("forge:ledger-event", {
        detail: {
          type: "INTEGRATION_COMPLETE",
          mode: "forge",
          actor: operator,
          summary: "KESTREL-3 station s3 cleared — alignment within ±tol, mass margin 11.10%, torque map complete.",
          ref: "traveler://aetherion/integration/" + serial,
        },
      }));
    }
    if (typeof navigate === "function") {
      navigate("/traveler/test");
    }
  }

  return (
    <div style={{ display: "flex", flexDirection: "column", height: "100%", minHeight: 0 }}>

      <_SI3Header
        operator={operator}
        station={stationName}
        seq="03 / 04"
        wo="WO-AET-001 · KESTREL-3 · Aperture Earth · 1 ship-set"
        right={
          <span className="mono" style={{ color: _SI3_ACC, fontSize: 12, fontFamily: _SI3_FONT_MONO, letterSpacing: "0.04em" }}>
            tracker · faro vantage · s/n FV-04612
          </span>
        }
      />

      {/* traveler band */}
      <div style={{ padding: "10px 14px", background: "color-mix(in oklch, " + _SI3_ACC + " 4%, var(--bg-1))", borderBottom: "1px solid var(--line)", display: "flex", alignItems: "center", gap: 14 }}>
        <div style={{ padding: "6px 12px", border: "1px solid " + _SI3_ACC, borderRadius: 4, background: "color-mix(in oklch, " + _SI3_ACC + " 10%, var(--bg-0))" }}>
          <div className="label" style={{ color: _SI3_ACC }}>UNIT ON GRANITE BENCH</div>
          <div className="mono" style={{ fontSize: 14, color: "var(--ink)", letterSpacing: "0.04em", fontFamily: _SI3_FONT_MONO }}>{serial}</div>
        </div>
        <div style={{ flex: 1, display: "flex", gap: 14, alignItems: "center" }}>
          {["s1", "s2", "s3", "s4"].map((s, i) => (
            <div key={s} style={{ display: "flex", flexDirection: "column", alignItems: "center", gap: 4 }}>
              <div style={{
                width: 18, height: 18, borderRadius: "50%",
                background: i < 2 ? _SI3_OK : i === 2 ? _SI3_ACC : "var(--bg-3)",
                border: "1px solid " + (i < 2 ? _SI3_OK : i === 2 ? _SI3_ACC : "var(--line)"),
                boxShadow: i === 2 ? "0 0 0 4px color-mix(in oklch, " + _SI3_ACC + " 22%, transparent)" : "none",
              }} />
              <span className="mono" style={{ fontSize: 12, color: i === 2 ? "var(--ink)" : _SI3_INK_FAINT, fontFamily: _SI3_FONT_MONO, letterSpacing: "0.04em" }}>{s.toUpperCase()}</span>
            </div>
          ))}
        </div>
        <Btn icon="File" onClick={() => window.forgeToast && window.forgeToast("WI/SAS docs opened — wired in v2")}>Integration WI · WI-AET-S3-rC</Btn>
      </div>

      <div style={{
        flex: 1, display: "grid",
        gridTemplateColumns: "1fr 1fr",
        minHeight: 0, overflow: "auto",
      }}>

        {/* ──── LEFT column: Faro tracker readout + mass properties ──── */}
        <div style={{ padding: 16, borderRight: "1px solid var(--line)" }}>

          <div className="label" style={{ marginBottom: 8 }}>
            FARO VANTAGE LASER TRACKER · ALIGNMENT READOUT
          </div>

          <div style={{ border: "1px solid var(--line)", borderRadius: 4, background: "var(--bg-0)" }}>
            {align.map((a) => {
              const ratio = Math.min(1, Math.abs(a.captured_arcsec) / a.tol_arcsec);
              const monoSty = { fontFamily: _SI3_FONT_MONO };
              return (
                <div key={a.id} style={{ padding: "10px 12px", borderBottom: "1px solid var(--line-soft)", display: "flex", flexDirection: "column", gap: 6 }}>
                  <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center" }}>
                    <div style={{ display: "flex", alignItems: "center", gap: 8 }}>
                      <span className="mono" style={{ fontSize: 12, color: _SI3_INK_DIM, padding: "1px 5px", border: "1px solid var(--line)", borderRadius: 3, ...monoSty, letterSpacing: "0.04em" }}>{a.id}</span>
                      <span style={{ fontSize: 12.5, color: "var(--ink)", fontWeight: 500 }}>{a.axis}</span>
                    </div>
                    <_SI3Stat pass={a.ok} label={a.ok ? "in tol" : "out of tol"} />
                  </div>
                  <div style={{ fontSize: 12, color: _SI3_INK_FAINT }}>{a.ref}</div>

                  {/* tolerance bar — center is target, edges are ±tol */}
                  <div style={{ position: "relative", height: 14, background: "var(--bg-2)", border: "1px solid var(--line-soft)", borderRadius: 3, overflow: "hidden" }}>
                    <div style={{ position: "absolute", top: 0, bottom: 0, left: "50%", width: 1, background: _SI3_ACC }} />
                    <div style={{ position: "absolute", top: 1, bottom: 1, left: "50%", width: ((a.captured_arcsec / a.tol_arcsec) * 50).toFixed(1) + "%", background: "color-mix(in oklch, " + _SI3_ACC + " 50%, transparent)", transform: a.captured_arcsec < 0 ? "translateX(-100%)" : "none" }} />
                    <div style={{ position: "absolute", top: 0, bottom: 0, left: 0, width: 1, background: _SI3_LINE }} />
                    <div style={{ position: "absolute", top: 0, bottom: 0, right: 0, width: 1, background: _SI3_LINE }} />
                  </div>

                  <div style={{ display: "grid", gridTemplateColumns: "1fr 1fr 1fr 1fr", gap: 10, fontSize: 12 }}>
                    <div><div className="label">target</div><span className="mono tnum" style={{ color: _SI3_INK2, ...monoSty }}>0.0″ · {a.target_mm} mm</span></div>
                    <div><div className="label">captured</div><span className="mono tnum" style={{ color: "var(--ink)", fontWeight: 600, ...monoSty }}>{a.captured_arcsec.toFixed(1)}″</span></div>
                    <div><div className="label">offset</div><span className="mono tnum" style={{ color: "var(--ink)", ...monoSty }}>{a.captured_mm} mm</span></div>
                    <div><div className="label">tol</div><span className="mono tnum" style={{ color: _SI3_INK_DIM, ...monoSty }}>± {a.tol_arcsec.toFixed(1)}″</span></div>
                  </div>
                  <div className="mono" style={{ fontSize: 12, color: _SI3_INK_DIM, ...monoSty, letterSpacing: "0.02em" }}>
                    consumed {(ratio * 100).toFixed(0)}% of tolerance budget
                  </div>
                </div>
              );
            })}
          </div>

          {/* Boresight schematic */}
          <div style={{ marginTop: 14 }}>
            <div className="label" style={{ marginBottom: 6 }}>
              BORESIGHT SCHEMATIC · STAR-TRACKER ↔ IMAGER FOCAL PLANE
            </div>
            <_SI3BoresightSchematic />
          </div>

          {/* Mass properties */}
          <div className="label" style={{ marginTop: 16, marginBottom: 6 }}>
            MASS PROPERTY RE-VERIFICATION · CG · MOI
          </div>
          <div style={{ border: "1px solid var(--line)", borderRadius: 4, background: "var(--bg-0)" }}>
            {_si3_kv("Dry mass · target",     mass.dry_g_target.toLocaleString() + " g (cap)", true)}
            {_si3_kv("Dry mass · captured",   mass.dry_g_captured.toLocaleString() + " g", true)}
            {_si3_kv("Mass margin",           mass.dry_g_margin_pct.toFixed(2) + "%  ·  " + (mass.dry_g_target - mass.dry_g_captured).toLocaleString() + " g headroom", true)}
            {_si3_kv("CG · target (mm)",      mass.cg_target_mm, true)}
            {_si3_kv("CG · captured (mm)",    mass.cg_captured_mm, true)}
            {_si3_kv("CG · offset",           mass.cg_offset_mm + " mm  ·  within ± 1.0 mm", true)}
            {_si3_kv("MOI Ixx (kg·m²)",       mass.moi_xx_captured + "  ·  target " + mass.moi_xx_target, true)}
            {_si3_kv("MOI Iyy (kg·m²)",       mass.moi_yy_captured + "  ·  target " + mass.moi_yy_target, true)}
            {_si3_kv("MOI Izz (kg·m²)",       mass.moi_zz_captured + "  ·  target " + mass.moi_zz_target, true)}
          </div>
          <div style={{ ..._si3_calloutBase, background: "color-mix(in oklch, " + _SI3_ACC + " 6%, var(--bg-1))" }}>
            CG measured on Space Electronics KSR 1320 fixture · MOI from torsion pendulum · two-axis swing · 5 trials averaged.
          </div>
        </div>

        {/* ──── RIGHT column: torque map + photos + signoff ──── */}
        <div style={{ padding: 16, display: "flex", flexDirection: "column", minHeight: 0 }}>

          <div className="label" style={{ marginBottom: 8 }}>
            PRIMARY STRUCTURE TORQUE SEQUENCE · CROSS-PATTERN
          </div>

          <_SI3TorquePattern torque={torque} />

          <div style={{ marginTop: 10, border: "1px solid var(--line)", borderRadius: 4, background: "var(--bg-0)", overflow: "hidden" }}>
            <div style={{ display: "grid", gridTemplateColumns: "30px 1fr 1fr 80px 60px", padding: "6px 10px", gap: 6, background: "var(--bg-2)", borderBottom: "1px solid var(--line)" }}>
              {["seq", "fastener", "target / captured (Nm)", "spec", "stat"].map((h) => (
                <div key={h} className="label" style={{ color: _SI3_INK_DIM }}>{h}</div>
              ))}
            </div>
            {torque.map((t) => (
              <div key={t.tag} style={_si3_torqueRowBase}>
                <span className="mono" style={{ color: _SI3_ACC, fontFamily: _SI3_FONT_MONO, fontWeight: 600 }}>{t.seq}</span>
                <span style={{ color: "var(--ink)" }}>
                  <span className="mono" style={{ fontFamily: _SI3_FONT_MONO }}>{t.tag}</span>
                  {t.note && (
                    <span style={_si3_torqueNoteTag}>{t.note}</span>
                  )}
                </span>
                <span className="mono tnum" style={{ color: "var(--ink)", fontFamily: _SI3_FONT_MONO, fontWeight: 600 }}>{t.target_nm.split(" ")[0]} → {t.captured_nm}</span>
                <span className="mono" style={{ color: _SI3_INK_DIM, fontFamily: _SI3_FONT_MONO }}>{t.target_nm}</span>
                <_SI3Stat pass={t.pass} label={t.pass ? "ok" : "ncr"} />
              </div>
            ))}
          </div>

          {/* Photo capture per-axis */}
          <div className="label" style={{ marginTop: 14, marginBottom: 6 }}>
            PHOTO + SIGNOFF · PER ALIGNMENT AXIS
          </div>
          <div style={{ display: "grid", gridTemplateColumns: "repeat(5, 1fr)", gap: 6 }}>
            {photos.map((p) => (
              <div key={p.axis} style={{
                ..._si3_photoCellBase,
                aspectRatio: "1.4 / 1",
                background: p.captured ? "color-mix(in oklch, " + _SI3_ACC + " 8%, var(--bg-2))" : "var(--bg-2)",
                border: "1px " + (p.captured ? "solid " + _SI3_ACC : "dashed var(--line)"),
                color: p.captured ? _SI3_ACC : _SI3_INK_FAINT,
              }}>
                {I("Camera", { size: 16 })}
                <span className="mono" style={{ fontFamily: _SI3_FONT_MONO, color: "var(--ink-2)" }}>{p.axis}</span>
                <span style={{ fontSize: 12, lineHeight: 1.2, color: _SI3_INK_DIM }}>{p.tag}</span>
                {p.captured
                  ? <span className="mono" style={{ fontSize: 12, color: _SI3_OK, fontFamily: _SI3_FONT_MONO, letterSpacing: "0.04em" }}>SIGNED · MS</span>
                  : <Btn size="sm" onClick={() => window.forgeToast && window.forgeToast("Photometric snap queued — wired in v2")}>+ snap</Btn>}
              </div>
            ))}
          </div>

          <div style={_si3_footnoteBase}>
            photos {photosCount} / {photosTotal} captured · ITAR-tagged · stored under aetherion-itar S3 · drawing pull logs ECCN 9A515.h
          </div>

          {/* Summary + emit */}
          <div style={{ marginTop: "auto", paddingTop: 14 }}>
            <div style={{
              padding: 12,
              background: passReady ? "color-mix(in oklch, " + _SI3_ACC + " 8%, var(--bg-0))" : "color-mix(in oklch, " + _SI3_WARN + " 8%, var(--bg-0))",
              border: "1px solid " + (passReady ? _SI3_ACC : _SI3_WARN),
              borderRadius: 4, display: "flex", flexDirection: "column", gap: 8,
            }}>
              <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center" }}>
                <div className="label" style={{ color: passReady ? _SI3_ACC : _SI3_WARN }}>STATION 3 · INTEGRATION + ALIGNMENT</div>
                <span className="mono" style={{ fontSize: 12, color: _SI3_INK_DIM, fontFamily: _SI3_FONT_MONO, letterSpacing: "0.04em" }}>cycle target 6.5 h · actual 5h 48m</span>
              </div>
              <div style={{ display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gap: 8, fontSize: 12 }}>
                <div><div className="label">alignment</div><_SI3Stat pass={allAlignOK} label={allAlignOK ? "3 / 3 in tol" : "out of tol"} /></div>
                <div><div className="label">torque</div><_SI3Stat pass={allTorqueOK} label={(torque.filter(t => t.pass).length) + " / " + torque.length} /></div>
                <div><div className="label">mass margin</div><span className="mono tnum" style={{ color: massOK ? _SI3_OK : _SI3_WARN, fontFamily: _SI3_FONT_MONO, fontWeight: 600 }}>{mass.dry_g_margin_pct.toFixed(2)}%</span></div>
                <div><div className="label">photos</div><_SI3Stat pass={allPhotosOK} label={photosCount + " / " + photosTotal} /></div>
              </div>
              <div style={{ display: "flex", justifyContent: "space-between", alignItems: "center", marginTop: 4 }}>
                <div style={{ fontSize: 12, color: _SI3_INK_DIM, lineHeight: 1.5 }}>
                  emits <span className="mono" style={{ color: _SI3_ACC, fontFamily: _SI3_FONT_MONO }}>INTEGRATION_COMPLETE</span> → signed receipt to auditor ledger · routes unit to s4 (Test).
                </div>
                <Btn variant="primary" icon="Check" disabled={!passReady} onClick={emit}>
                  {emitted ? "Sent to Test ▸" : signed ? "Emitted INTEGRATION_COMPLETE ▸" : "Sign + emit INTEGRATION_COMPLETE ▸"}
                </Btn>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  );
}

/* ────────────────────────────────────────────────────────────────────
   Boresight schematic — star-tracker line of sight onto imager FPA
   ──────────────────────────────────────────────────────────────────── */

function _SI3BoresightSchematic() {
  const W = 460, H = 150;
  const txt = (x, y, s, sz, fill, weight) => (
    <text x={x} y={y} fontSize={sz || 9.5} textAnchor="middle" fontFamily={_SI3_FONT_MONO} fill={fill} fontWeight={weight || "400"}>{s}</text>
  );
  return (
    <svg viewBox={"0 0 " + W + " " + H} width="100%" height={H} style={{ background: "var(--bg-0)", border: "1px solid var(--line)", borderRadius: 4 }}>
      <defs>
        <marker id="si3-arr" viewBox="0 0 10 10" refX="9" refY="5" markerWidth="5" markerHeight="5" orient="auto">
          <path d="M0,0 L10,5 L0,10 Z" fill={_SI3_ACC} />
        </marker>
      </defs>
      <line x1="40" y1="120" x2={W - 40} y2="120" stroke={_SI3_INK2} strokeWidth="0.8" strokeDasharray="2 3" />
      <text x="40" y="140" fontSize="9.5" fontFamily={_SI3_FONT_MONO} fill={_SI3_INK_FAINT}>granite bench · level ± 5″ over 2 m</text>
      <rect x="60" y="55" width="78" height="46" rx="3" fill="color-mix(in oklch, var(--space-accent, #4F8FFF) 12%, var(--bg-0))" stroke={_SI3_ACC} strokeWidth="1.2" />
      {txt(99, 73, "SODERN", 10, _SI3_ACC, "600")}
      {txt(99, 86, "Auriga CP", 9, "var(--ink-2)")}
      {txt(99, 98, "ST · KESTREL-3.30.01", 8.5, _SI3_INK_DIM)}
      <rect x={W - 138} y="50" width="78" height="56" rx="3" fill="color-mix(in oklch, var(--space-accent, #4F8FFF) 6%, var(--bg-0))" stroke={_SI3_ACC} strokeWidth="1.2" />
      {txt(W - 99, 68, "IMAGER FPA", 10, _SI3_ACC, "600")}
      {txt(W - 99, 81, "1m-GSD · X-band", 9, "var(--ink-2)")}
      {txt(W - 99, 94, "KESTREL-3.B0", 8.5, _SI3_INK_DIM)}
      <line x1="138" y1="78" x2={W - 138} y2="78" stroke={_SI3_ACC} strokeWidth="1.6" markerEnd="url(#si3-arr)" />
      {txt(W / 2, 68, "boresight · captured 4.1″", 10, _SI3_ACC, "600")}
      {txt(W / 2, 92, "tol ± 6.0″ · consumed 68%", 9, _SI3_INK_DIM)}
      <circle cx={W / 2} cy="20" r="9" fill={_SI3_ACC} stroke="var(--bg-0)" strokeWidth="1.5" />
      <line x1={W / 2} y1="29" x2={W / 2} y2="78" stroke={_SI3_ACC} strokeWidth="0.6" strokeDasharray="1 2" />
      <text x={W / 2 + 14} y="24" fontSize="9.5" fontFamily={_SI3_FONT_MONO} fill={_SI3_ACC}>Faro Vantage · 25 µm @ 2 m</text>
    </svg>
  );
}

/* ────────────────────────────────────────────────────────────────────
   Torque sequence pattern — top-down view of 12U bus rails + hinges
   showing cross-pattern numbering 1..8.
   ──────────────────────────────────────────────────────────────────── */

function _SI3TorquePattern({ torque }) {
  const W = 460, H = 170;
  // Top-down: 4 rails (PS-A1..B2), 2 deck (C, D), 2 hinges (HG-03, HG-04).
  const pts = [
    { tag: "PS-A1", seq: 1, x: 90,  y: 50  }, { tag: "PS-A2", seq: 2, x: 370, y: 120 },
    { tag: "PS-B1", seq: 3, x: 90,  y: 120 }, { tag: "PS-B2", seq: 4, x: 370, y: 50  },
    { tag: "PS-C",  seq: 5, x: 230, y: 32  }, { tag: "PS-D",  seq: 6, x: 230, y: 138 },
    { tag: "HG-03", seq: 7, x: 38,  y: 85  }, { tag: "HG-04", seq: 8, x: 422, y: 85  },
  ];
  const order = [0, 2, 1, 3, 4, 5, 6, 7];
  const path = order.map((idx, i) => (i === 0 ? "M" : "L") + pts[idx].x + "," + pts[idx].y).join(" ");
  return (
    <svg viewBox={"0 0 " + W + " " + H} width="100%" height={H} style={{ background: "var(--bg-0)", border: "1px solid var(--line)", borderRadius: 4 }}>
      <rect x="55" y="32" width="350" height="106" rx="6" fill="color-mix(in oklch, var(--space-accent, #4F8FFF) 4%, var(--bg-0))" stroke={_SI3_LINE} strokeWidth="1" />
      <text x="60" y="24" fontSize="9" fontFamily={_SI3_FONT_MONO} fill={_SI3_INK_FAINT}>12U bus · top view · skeletonized primary structure (KESTREL-3.10)</text>
      <path d={path} stroke={_SI3_ACC} strokeWidth="0.8" strokeDasharray="3 3" fill="none" opacity="0.6" />
      {pts.map((p, i) => {
        const ok = torque[i] && torque[i].pass;
        return (
          <g key={p.tag}>
            <circle cx={p.x} cy={p.y} r="11" fill={ok ? _SI3_ACC : _SI3_WARN} stroke="var(--bg-0)" strokeWidth="2" />
            <text x={p.x} y={p.y + 3.5} fontSize="11" textAnchor="middle" fontFamily={_SI3_FONT_MONO} fill="#fff" fontWeight="700">{p.seq}</text>
            <text x={p.x} y={p.y + 24} fontSize="8.5" textAnchor="middle" fontFamily={_SI3_FONT_MONO} fill={_SI3_INK2}>{p.tag}</text>
          </g>
        );
      })}
      <text x={W - 6} y={H - 6} fontSize="8.5" textAnchor="end" fontFamily={_SI3_FONT_MONO} fill={_SI3_INK_FAINT}>two-pass · re-torque audit at +24 h · Vibra-Tite 213 cure</text>
    </svg>
  );
}

/* ════════════════════════════════════════════════════════════════════
   Route registration. Prefer `registerSpaceRoute` once Wave A0 task #12
   lands; fall back to `registerPumpRoute` so the screen is reachable in
   the meantime (the path namespace `/traveler/motor-assy` is shared by
   the traveler mode and the active tenant decides which renderer wins).
   ──────────────────────────────────────────────────────────────────── */

(function _si3_register() {
  const route = {
    path: "/traveler/motor-assy",
    mode: "traveler",
    title: "Integration + alignment",
    tenant: "aetherion",
    renderer: function () { return React.createElement(ScreenAetherionIntegration); },
  };
  const w = (typeof window !== "undefined") ? window : null;
  if (w && typeof w.registerSpaceRoute === "function") {
    w.registerSpaceRoute(route);
  } else if (w && typeof w.registerPumpRoute === "function") {
    w.registerPumpRoute(route);
  }
  if (w) {
    w.ScreenAetherionIntegration = ScreenAetherionIntegration;
  }
})();
})();