/* MindLoop website — dark, serif, terminal-desk aesthetic
   modeled exactly on mindloop.studio. */

@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,500;0,8..60,600;1,8..60,400;1,8..60,500&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root {
  --bg: #0a0a08;
  --bg-2: #0e0e0c;
  --bg-3: #131311;
  --surface: #141412;
  --surface-2: #1a1a16;
  --surface-3: #1f1f1b;
  --line: #28281f;
  --line-soft: #1d1d18;

  --ink: #f0eeea;
  --ink-2: #c4c1b8;
  --ink-3: #8c897e;
  --ink-4: #5a574e;

  --cyan: #5fd1ff;
  --cyan-soft: rgba(95, 209, 255, 0.12);
  --yellow: #ffd449;
  --yellow-soft: rgba(255, 212, 73, 0.10);
  --green: #66e29b;
  --green-soft: rgba(102, 226, 155, 0.12);
  --purple: #b9a4ff;
  --purple-soft: rgba(185, 164, 255, 0.12);
  --red: #ff7766;

  --serif: "Source Serif 4", "Iowan Old Style", "Charter", "Georgia", serif;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
  margin: 0;
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink-2);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
a { color: var(--cyan); text-decoration: none; transition: color 200ms var(--ease-out); }
a:hover { color: #97e1ff; }
p { margin: 0 0 1em; }

/* ============================================================== */
/* Header                                                          */
/* ============================================================== */
header.site {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 32px;
  border-bottom: 1px solid var(--line-soft);
  position: sticky; top: 0;
  background: rgba(10, 10, 8, 0.78);
  backdrop-filter: saturate(180%) blur(18px);
  z-index: 50;
}
/* Brand mark = mindloop.studio wordmark: Ml^p MindLoop */
header.site .brand,
header.site a.brand {
  display: inline-flex; align-items: baseline; gap: 8px;
  text-decoration: none;
  color: var(--ink);
  transition: opacity 240ms ease-out;
}
header.site .brand:hover { opacity: 0.8; }
header.site .brand .mlp-logo {
  font-family: Georgia, "Source Serif 4", "Times New Roman", Times, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 22px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--cyan);
  /* tighten the superscript inside */
  position: relative;
  top: 2px;
}
header.site .brand .mlp-logo sup {
  font-family: inherit;
  font-style: italic;
  font-weight: 400;
  font-size: 0.55em;
  vertical-align: super;
  margin-left: -0.04em;
  color: var(--cyan);
}
header.site .brand .mlp-word {
  font-family: var(--mono);
  font-weight: 700;
  font-size: 12.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink);
  line-height: 1;
  position: relative;
  top: 1px;
}
@media (max-width: 720px) {
  header.site .brand .mlp-logo { font-size: 19px; }
  header.site .brand .mlp-word { font-size: 11px; letter-spacing: 0.12em; }
}
header.site nav {
  display: flex; align-items: center; gap: 26px;
}
header.site nav a:not(.cta) {
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--ink-3);
  position: relative;
  padding: 4px 0;
  transition: color 240ms var(--ease-out);
}
header.site nav a:not(.cta):hover { color: var(--cyan); }
@media (max-width: 720px) {
  header.site nav a:not(.cta) { display: none; }
}

/* ============================================================== */
/* CTA                                                             */
/* ============================================================== */
.cta, a.cta, button.cta {
  display: inline-block;
  padding: 10px 18px;
  background: var(--cyan);
  color: var(--bg) !important;
  border-radius: 4px;
  font-family: var(--mono);
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  border: 0;
  cursor: pointer;
  transition: transform 220ms var(--ease-out), background 220ms var(--ease-out), box-shadow 220ms var(--ease-out);
}
.cta:hover, a.cta:hover {
  background: #97e1ff;
  transform: translateY(-1px);
  box-shadow: 0 6px 22px -8px rgba(95, 209, 255, 0.55);
  text-decoration: none;
}
.cta-secondary {
  display: inline-block;
  padding: 10px 18px;
  border: 1px solid var(--line);
  border-radius: 4px;
  font-family: var(--mono);
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--ink-2) !important;
  background: transparent;
  transition: all 220ms var(--ease-out);
}
.cta-secondary:hover {
  border-color: var(--cyan);
  color: var(--cyan) !important;
  background: var(--cyan-soft);
  text-decoration: none;
}

/* ============================================================== */
/* Rotating quoted question — matches mindloop.studio.             */
/* Outer 900px centered. Eyebrow (cyan mono) → serif quote → dots. */
/* Home tab only. Replaces the static brand eyebrow on home.       */
/* ============================================================== */
.qrotator {
  max-width: 920px;
  margin: 0 auto 36px;
  text-align: center;
  position: relative;
  /* Soft cyan halo behind the quote */
  isolation: isolate;
}
.qrotator::before {
  content: "";
  position: absolute;
  inset: -32px -64px;
  background: radial-gradient(60% 70% at 50% 55%, rgba(10, 132, 255, 0.10), transparent 72%);
  filter: blur(10px);
  z-index: -1;
  opacity: 0; transform: scale(0.96);
  transition: opacity 720ms var(--ease-out) 120ms, transform 720ms var(--ease-out) 120ms;
  pointer-events: none;
}
.qrotator-active .qrotator::before { opacity: 1; transform: scale(1); }

.qrotator-stage {
  min-height: 160px;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  cursor: default;
}
.qrotator-eyebrow {
  display: inline-flex; align-items: center; gap: 9px;
  font-family: "SF Mono", SFMono-Regular, ui-monospace, "JetBrains Mono", Menlo, Consolas, monospace;
  font-size: 11px;
  font-weight: 600;
  color: rgb(10, 132, 255);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 18px;
  transition: opacity 320ms var(--ease-out), transform 320ms var(--ease-out);
}
.qrotator-eyebrow::before {
  content: "";
  width: 6px; height: 6px; border-radius: 50%;
  background: rgb(10, 132, 255);
  box-shadow: 0 0 0 4px rgba(10, 132, 255, 0.12);
  animation: qrotatorPulse 2.2s ease-in-out infinite;
}
@keyframes qrotatorPulse {
  0%, 100% { opacity: 0.55; transform: scale(0.85); box-shadow: 0 0 0 0 rgba(10, 132, 255, 0.18); }
  50%       { opacity: 1;    transform: scale(1.05); box-shadow: 0 0 0 6px rgba(10, 132, 255, 0); }
}
.qrotator .qtext {
  font-family: Georgia, "Source Serif 4", "Times New Roman", Times, serif;
  font-style: normal;
  font-weight: 400;
  font-size: clamp(22px, 2.6vw, 32px);
  line-height: 1.36;
  letter-spacing: -0.012em;
  color: rgba(255, 255, 255, 0.94);
  max-width: 820px;
  transition: opacity 380ms var(--ease-out), transform 380ms var(--ease-out);
}
.qrotator.q-fade .qtext,
.qrotator.q-fade .qrotator-eyebrow { opacity: 0; transform: translateY(6px); }
.qrotator .qmark {
  font-family: Georgia, serif;
  font-style: italic;
  font-size: 1.35em;
  line-height: 0;
  vertical-align: -0.08em;
  color: rgba(95, 209, 255, 0.62);
  padding: 0 3px;
}
.qrotator .dots {
  display: flex;
  justify-content: center;
  gap: 7px;
  margin-top: 22px;
}
.qrotator .dots button {
  width: 6px; height: 6px;
  border-radius: 4px;
  border: none;
  padding: 0;
  background: rgba(255, 255, 255, 0.10);
  cursor: pointer;
  transition:
    width 360ms cubic-bezier(0.22, 1, 0.36, 1),
    background 360ms var(--ease-out),
    transform 220ms var(--ease-out);
}
.qrotator .dots button:hover { background: rgba(255, 255, 255, 0.26); transform: translateY(-1px); }
.qrotator .dots button.on {
  width: 24px;
  background: rgb(10, 132, 255);
  box-shadow: 0 0 0 0 rgba(10, 132, 255, 0.30);
  animation: qrotatorOnPing 1.6s ease-out;
}
@keyframes qrotatorOnPing {
  0%  { box-shadow: 0 0 0 0 rgba(10, 132, 255, 0.30); }
  60% { box-shadow: 0 0 0 6px rgba(10, 132, 255, 0); }
  100%{ box-shadow: 0 0 0 0 rgba(10, 132, 255, 0); }
}
.qrotator-active section.hero > .inner > .eyebrow { display: none; }
@media (max-width: 720px) {
  .qrotator { margin-bottom: 26px; }
  .qrotator .qtext { font-size: 19px; max-width: 92%; }
  .qrotator-stage { min-height: 132px; }
  .qrotator::before { inset: -20px -16px; }
}

/* ============================================================== */
/* Hero                                                            */
/* ============================================================== */
section.hero {
  background: var(--bg);
  padding: 48px 40px 96px;
  position: relative;
}
section.hero .inner { max-width: 1180px; margin: 0 auto; }
.eyebrow {
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink-4);
  margin: 0 0 22px;
}
.eyebrow .sep { color: var(--ink-4); margin: 0 8px; }
section.hero h1 {
  font-family: var(--serif);
  font-size: clamp(48px, 7vw, 96px);
  font-weight: 500;
  letter-spacing: -0.025em;
  line-height: 1.02;
  margin: 0 0 36px;
  max-width: 14ch;
  color: var(--ink);
}
section.hero h1 .end-dot { color: var(--cyan); }
section.hero .lede {
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(18px, 1.55vw, 22px);
  line-height: 1.55;
  color: var(--ink-2);
  max-width: 64ch;
  margin: 0 0 28px;
  font-weight: 400;
}
section.hero .support {
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.65;
  color: var(--ink-3);
  max-width: 64ch;
  margin: 0 0 36px;
}
section.hero .cta-row {
  display: flex; gap: 12px; flex-wrap: wrap; align-items: center;
}
section.hero .meta-strip {
  margin-top: 56px;
  padding-top: 24px;
  border-top: 1px solid var(--line-soft);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 22px;
}
section.hero .meta-strip .item .k {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-4);
  margin-bottom: 6px;
}
section.hero .meta-strip .item .v {
  font-family: var(--serif);
  font-size: 17px;
  color: var(--ink-2);
  line-height: 1.4;
}

/* ============================================================== */
/* Section bands                                                   */
/* ============================================================== */
section.band {
  padding: 96px 40px;
  border-top: 1px solid var(--line-soft);
}
section.band.muted { background: var(--bg-2); }
section.band .inner { max-width: 1180px; margin: 0 auto; }
section.band h2 {
  font-family: var(--serif);
  font-size: clamp(34px, 4.4vw, 56px);
  font-weight: 500;
  letter-spacing: -0.022em;
  line-height: 1.08;
  margin: 0 0 24px;
  max-width: 22ch;
  color: var(--ink);
}
section.band h2 .end-dot { color: var(--cyan); }
section.band .lede {
  font-family: var(--serif);
  font-style: italic;
  font-size: 19px;
  line-height: 1.55;
  color: var(--ink-2);
  max-width: 64ch;
  margin: 0 0 28px;
}
section.band .body {
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.65;
  color: var(--ink-3);
  max-width: 64ch;
  margin: 0 0 22px;
}
section.band .eyebrow { margin-bottom: 14px; color: var(--cyan); }

/* ============================================================== */
/* Card grid                                                       */
/* ============================================================== */
.grid { display: grid; gap: 14px; margin-top: 32px; }
.grid-2 { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.grid-3 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.grid-4 { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.grid-5 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.card {
  padding: 22px 22px 24px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  transition: border-color 280ms var(--ease-out), transform 280ms var(--ease-out), background 280ms var(--ease-out);
}
.card:hover {
  border-color: var(--cyan);
  background: var(--surface-2);
  transform: translateY(-2px);
}
.card .num {
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--cyan);
  margin: 0 0 10px;
}
.card h3 {
  font-family: var(--serif);
  font-size: 21px;
  font-weight: 500;
  letter-spacing: -0.012em;
  margin: 0 0 8px;
  color: var(--ink);
  line-height: 1.25;
}
.card p {
  font-family: var(--sans);
  font-size: 14.5px;
  line-height: 1.55;
  color: var(--ink-3);
  margin: 0;
}

/* ============================================================== */
/* Loop strip                                                       */
/* ============================================================== */
.loop-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
  margin: 36px 0 0;
  padding: 28px 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}
.loop-step .step-num {
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--cyan);
  margin-bottom: 8px;
}
.loop-step h4 {
  font-family: var(--serif);
  font-size: 20px;
  font-weight: 500;
  letter-spacing: -0.012em;
  margin: 0 0 6px;
  color: var(--ink);
}
.loop-step p {
  font-family: var(--sans);
  font-size: 13.5px;
  color: var(--ink-3);
  margin: 0;
  line-height: 1.5;
}

/* ============================================================== */
/* Callout                                                         */
/* ============================================================== */
.callout {
  margin: 32px 0 0;
  padding: 16px 22px;
  background: var(--yellow-soft);
  border: 1px solid rgba(255, 212, 73, 0.30);
  border-radius: 6px;
  font-family: var(--mono);
  font-size: 12.5px;
  line-height: 1.6;
  color: var(--ink-2);
  letter-spacing: 0.02em;
}
.callout strong {
  color: var(--yellow);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 11px;
  margin-right: 10px;
}
.callout.cyan { background: var(--cyan-soft); border-color: rgba(95, 209, 255, 0.30); }
.callout.cyan strong { color: var(--cyan); }
.callout.green { background: var(--green-soft); border-color: rgba(102, 226, 155, 0.30); }
.callout.green strong { color: var(--green); }
.callout.purple { background: var(--purple-soft); border-color: rgba(185, 164, 255, 0.30); }
.callout.purple strong { color: var(--purple); }

/* ============================================================== */
/* Diagram wrapper                                                 */
/* ============================================================== */
.mn-diagram {
  max-width: 1180px;
  /* Give each diagram extra vertical room so the zoom-up doesn't clip
     into neighbours. The scroll-zoom JS scales up to 1.22× at the
     viewport-center pass, then back to 1.00× as it moves on. */
  margin: 96px auto;
  padding: 0 40px;
  position: relative;
  z-index: 1;
  transition: opacity 360ms ease-out, filter 360ms ease-out;
}
/* When this diagram is the most-zoomed in viewport, elevate it and
   give it a soft halo so the surrounding page recedes visually. */
.mn-diagram.mn-zooming {
  z-index: 30;
  filter: drop-shadow(0 32px 60px rgba(0, 0, 0, 0.55));
}
/* Soft dim the un-zoomed neighbours when ANY diagram is zoomed-in. */
body:has(.mn-diagram.mn-zooming) .mn-diagram:not(.mn-zooming) {
  opacity: 0.45;
  filter: saturate(0.85);
}
@media (max-width: 760px) {
  /* JS disables scroll-zoom under 760px; keep tight spacing too. */
  .mn-diagram { margin: 56px auto; }
  .mn-diagram.mn-zooming { filter: none; }
  body:has(.mn-diagram.mn-zooming) .mn-diagram:not(.mn-zooming) { opacity: 1; filter: none; }
}
.mn-diagram-label {
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cyan);
  margin: 0 0 12px;
}
.mn-diagram-title {
  font-family: var(--serif);
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 500;
  letter-spacing: -0.018em;
  margin: 0 0 12px;
  color: var(--ink);
  max-width: 28ch;
  line-height: 1.18;
}
.mn-diagram-caption {
  font-family: var(--serif);
  font-style: italic;
  font-size: 17px;
  line-height: 1.55;
  color: var(--ink-3);
  max-width: 64ch;
  margin: 0 0 24px;
}

/* ============================================================== */
/* Window-chrome packet                                            */
/* ============================================================== */
.win {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  overflow: hidden;
}
.win-bar {
  display: flex; align-items: center;
  padding: 10px 14px;
  background: var(--surface-2);
  border-bottom: 1px solid var(--line-soft);
  gap: 12px;
}
.win-bar .dots { display: flex; gap: 6px; }
.win-bar .dots span {
  width: 11px; height: 11px; border-radius: 50%;
  display: block;
}
.win-bar .dots .r { background: #ff5f56; }
.win-bar .dots .y { background: #ffbd2e; }
.win-bar .dots .g { background: #27c93f; }
.win-bar .url {
  flex: 1;
  font-family: var(--mono);
  font-size: 11px;
  color: var(--ink-3);
  text-align: center;
  letter-spacing: 0.02em;
}
.win-bar .actions {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cyan);
}

.win-tabs {
  display: flex; gap: 28px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--line-soft);
  background: var(--surface);
}
.win-tabs .tab {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-4);
  padding-bottom: 2px;
  border-bottom: 1px solid transparent;
}
.win-tabs .tab.active { color: var(--cyan); border-color: var(--cyan); }

.win-meta {
  display: flex; gap: 18px;
  padding: 12px 18px;
  border-bottom: 1px solid var(--line-soft);
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.win-meta .pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px;
  border-radius: 4px;
  background: var(--surface-2);
  border: 1px solid var(--line);
}
.win-meta .pill.purple { color: var(--purple); border-color: rgba(185, 164, 255, 0.28); background: var(--purple-soft); }
.win-meta .pill.cyan   { color: var(--cyan);   border-color: rgba(95, 209, 255, 0.28); background: var(--cyan-soft); }
.win-meta .pill.yellow { color: var(--yellow); border-color: rgba(255, 212, 73, 0.28); background: var(--yellow-soft); }
.win-meta .pill.green  { color: var(--green);  border-color: rgba(102, 226, 155, 0.28); background: var(--green-soft); }

/* ============================================================== */
/* Desk view (3-column run / pipeline / forecast)                  */
/* ============================================================== */
.desk {
  display: grid;
  grid-template-columns: 220px 1fr 320px;
  gap: 0;
  min-height: 480px;
}
@media (max-width: 1000px) {
  .desk { grid-template-columns: 1fr; }
}
.desk-col {
  padding: 18px 18px 22px;
  border-right: 1px solid var(--line-soft);
}
.desk-col:last-child { border-right: 0; }
.desk-col .col-label {
  font-family: var(--mono);
  font-size: 10.5px; letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-4);
  margin: 0 0 16px;
}
.desk-col .col-label.world { color: var(--purple); }
.desk-col .col-label.pipeline { color: var(--ink-4); }
.desk-col .col-label.forecast { color: var(--ink-4); }

/* Run list cards */
.run-card {
  padding: 12px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-2);
  margin-bottom: 10px;
  transition: border-color 220ms var(--ease-out);
}
.run-card:hover { border-color: var(--cyan); }
.run-card.dim { opacity: 0.45; }
.run-card .top {
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--mono); font-size: 11px;
  color: var(--ink-3); letter-spacing: 0.06em;
  margin-bottom: 4px;
}
.run-card .top .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--ink-4); }
.run-card .top .dot.yellow { background: var(--yellow); box-shadow: 0 0 6px var(--yellow-soft); }
.run-card .top .dot.cyan { background: var(--cyan); box-shadow: 0 0 6px var(--cyan-soft); }
.run-card .top .dot.green { background: var(--green); box-shadow: 0 0 6px var(--green-soft); }
.run-card .name { font-family: var(--sans); font-size: 13.5px; color: var(--ink); line-height: 1.35; }
.run-card .sub { font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); letter-spacing: 0.12em; text-transform: uppercase; margin-top: 4px; }

.desk-stats {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid var(--line-soft);
}
.desk-stats .stats-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.desk-stats .stat-box {
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-2);
}
.desk-stats .stat-box .n {
  font-family: var(--mono); font-size: 22px; font-weight: 700;
  color: var(--ink);
}
.desk-stats .stat-box.cyan .n { color: var(--cyan); }
.desk-stats .stat-box .l {
  font-family: var(--mono); font-size: 10px; color: var(--ink-4);
  letter-spacing: 0.10em; text-transform: uppercase; margin-top: 4px;
}
.desk-stats .note {
  margin-top: 12px;
  padding: 10px 12px;
  background: var(--yellow-soft);
  border-left: 2px solid var(--yellow);
  border-radius: 4px;
  font-family: var(--mono); font-size: 11px; color: var(--ink-2);
  line-height: 1.5;
}

/* Pipeline column */
.pipeline-stage {
  padding: 10px 12px;
  border-radius: 4px;
  display: flex; align-items: center; gap: 12px;
  font-family: var(--mono); font-size: 12px; color: var(--ink-2);
  margin-bottom: 4px;
  transition: background 220ms var(--ease-out);
}
.pipeline-stage:hover { background: var(--surface-2); }
.pipeline-stage .sym { color: var(--green); font-weight: 700; width: 12px; display: inline-block; }
.pipeline-stage .sym.run { color: var(--cyan); }
.pipeline-stage .sym.queue { color: var(--ink-4); }
.pipeline-stage .nn { color: var(--ink-4); font-size: 11px; margin-right: 4px; }
.pipeline-stage .sub { color: var(--ink-4); font-size: 11px; margin-left: 8px; font-style: italic; }
.pipeline-stage.active { background: var(--cyan-soft); color: var(--ink); }
.pipeline-stage.active .sub { color: var(--cyan); font-style: normal; }

.pipeline-cal {
  margin-top: 22px;
  padding: 10px 12px;
  border: 1px solid rgba(102, 226, 155, 0.28);
  background: var(--green-soft);
  border-radius: 4px;
  font-family: var(--mono); font-size: 11px; color: var(--ink-2);
  line-height: 1.6;
}
.pipeline-cal strong { color: var(--green); letter-spacing: 0.14em; text-transform: uppercase; font-size: 10.5px; margin-right: 10px; }

/* Forecast column */
.forecast-row {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 8px;
  font-family: var(--mono); font-size: 12px; color: var(--ink-2);
}
.forecast-row .pct { font-weight: 700; }
.forecast-row .pct.cyan { color: var(--cyan); }
.forecast-row .pct.yellow { color: var(--yellow); }
.forecast-bar {
  height: 4px; background: var(--surface-2); border-radius: 2px; overflow: hidden;
  margin-bottom: 14px; position: relative;
}
.forecast-bar .fill { height: 100%; background: var(--cyan); border-radius: 2px; }
.forecast-bar .fill.yellow { background: var(--yellow); }

.sections-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 4px 14px;
  font-family: var(--mono); font-size: 11px; color: var(--ink-2);
  margin: 14px 0 0;
}
.sections-grid .nn { color: var(--ink-4); margin-right: 6px; }
.sections-grid .sec { padding: 3px 0; }

.assembling {
  margin-top: 18px;
  padding: 10px 12px;
  border-radius: 6px;
  background: var(--yellow-soft);
  border: 1px solid rgba(255, 212, 73, 0.30);
  font-family: var(--mono); font-size: 11px; color: var(--ink-2); line-height: 1.55;
}
.assembling .badge { color: var(--yellow); letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700; font-size: 10.5px; }

.resolution {
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid var(--line-soft);
}
.resolution .rh {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--ink-4);
  margin-bottom: 12px;
}
.resolution-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 0;
  font-family: var(--mono); font-size: 12px;
  border-bottom: 1px solid var(--line-soft);
}
.resolution-row:last-child { border-bottom: 0; }
.resolution-row .arr { width: 16px; color: var(--cyan); font-weight: 700; }
.resolution-row .arr.down { color: var(--yellow); }
.resolution-row .arr.right { color: var(--ink-3); }
.resolution-row .lbl { flex: 1; color: var(--ink-2); }
.resolution-row .src { color: var(--ink-4); }

.desk-footer {
  border-top: 1px solid var(--line-soft);
  padding: 14px 22px;
  font-family: var(--mono); font-size: 11px; color: var(--ink-2);
  letter-spacing: 0.04em;
  background: var(--surface);
}
.desk-footer strong { color: var(--green); letter-spacing: 0.14em; text-transform: uppercase; margin-right: 10px; }
.desk-footer .runid { color: var(--cyan); font-weight: 700; }

/* ============================================================== */
/* Range table (forecast comparison)                               */
/* ============================================================== */
.range-table { padding: 22px 22px 8px; }
.range-row {
  display: grid;
  grid-template-columns: 1fr 110px 110px;
  align-items: center;
  gap: 18px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line-soft);
}
.range-row:last-child { border-bottom: 0; }
.range-row .name {
  font-family: var(--sans);
  font-size: 14.5px; color: var(--ink);
  display: flex; align-items: center; gap: 12px;
}
.range-row .name .letter { color: var(--cyan); font-family: var(--mono); font-weight: 700; }
.range-row.yellow .name .letter { color: var(--yellow); }
.range-row .barwrap {
  height: 6px; background: var(--surface-2); border-radius: 3px;
  position: relative; flex: 1; margin-left: 12px;
}
.range-row .barwrap .seg {
  position: absolute; top: 0; bottom: 0;
  background: var(--cyan); border-radius: 3px;
}
.range-row.yellow .barwrap .seg { background: var(--yellow); }
.range-row.dim .barwrap .seg { background: var(--ink-4); }
.range-row .range-val {
  font-family: var(--mono); font-size: 12px; color: var(--ink-2);
  text-align: right;
}
.range-row .conf {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.12em; text-transform: uppercase;
  padding: 3px 8px;
  border: 1px solid var(--cyan);
  color: var(--cyan);
  border-radius: 4px;
  text-align: center;
}
.range-row.yellow .conf { border-color: var(--yellow); color: var(--yellow); }
.range-row.dim .conf { border-color: var(--ink-4); color: var(--ink-4); }

.range-foot {
  padding: 14px 22px;
  border-top: 1px solid var(--line-soft);
  font-family: var(--serif); font-style: italic; font-size: 14px;
  color: var(--ink-2); line-height: 1.6;
}

/* ============================================================== */
/* Schedule strip                                                  */
/* ============================================================== */
.schedule-meta {
  display: flex; gap: 10px; padding: 14px 22px;
  border-bottom: 1px solid var(--line-soft);
}
.schedule-meta .tag {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.14em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 4px;
  border: 1px solid var(--purple); color: var(--purple);
  background: var(--purple-soft);
}
.schedule-meta .tag.cyan { border-color: var(--cyan); color: var(--cyan); background: var(--cyan-soft); }

.schedule {
  padding: 28px 22px;
  position: relative;
}
.schedule-track {
  position: relative; height: 30px;
  margin: 0 18px;
}
.schedule-track .line {
  position: absolute; top: 50%; left: 0; right: 0; height: 1px;
  background: var(--line);
}
.schedule-track .line .progress {
  position: absolute; left: 0; height: 100%;
  background: var(--cyan);
}
.schedule-track .nodes {
  display: flex; justify-content: space-between; align-items: center;
  position: relative; height: 100%;
}
.schedule-track .nodes .node {
  width: 22px; height: 22px;
  border-radius: 50%; border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 10px; color: var(--ink-4);
  background: var(--surface);
}
.schedule-track .nodes .node.done { color: var(--green); border-color: var(--green); }
.schedule-track .nodes .node.active { color: var(--cyan); border-color: var(--cyan); background: var(--cyan-soft); box-shadow: 0 0 0 4px var(--cyan-soft); }
.schedule-labels {
  display: flex; justify-content: space-between; margin: 6px 18px 0;
  font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); letter-spacing: 0.10em;
}
.schedule-foot {
  padding: 12px 22px;
  border-top: 1px solid var(--line-soft);
  font-family: var(--mono); font-size: 11px; color: var(--ink-2); line-height: 1.55;
  background: var(--surface);
}
.schedule-foot strong { color: var(--yellow); letter-spacing: 0.14em; text-transform: uppercase; margin-right: 10px; font-weight: 700; }

/* ============================================================== */
/* Form                                                            */
/* ============================================================== */
.form-stack { display: flex; flex-direction: column; gap: 22px; max-width: 720px; margin-top: 36px; }
.form-row label {
  display: block;
  font-family: var(--mono);
  font-size: 11px; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--cyan); margin-bottom: 8px;
}
.form-row .hint {
  font-family: var(--serif); font-style: italic;
  font-size: 14px; color: var(--ink-3); margin-bottom: 10px; line-height: 1.5;
}
.form-row input, .form-row textarea {
  width: 100%; padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 4px;
  font-family: var(--mono); font-size: 13.5px;
  background: var(--surface);
  color: var(--ink);
  transition: border-color 200ms var(--ease-out), background 200ms var(--ease-out);
}
.form-row input:focus, .form-row textarea:focus {
  outline: none; border-color: var(--cyan); background: var(--surface-2);
}
.form-row textarea { min-height: 84px; resize: vertical; }

/* ============================================================== */
/* Footer                                                          */
/* ============================================================== */
footer.site {
  padding: 72px 40px 56px;
  background: var(--bg-2);
  border-top: 1px solid var(--line-soft);
}
footer.site .inner { max-width: 1180px; margin: 0 auto; }
footer.site .tag {
  font-family: var(--serif);
  font-size: clamp(24px, 3.4vw, 44px);
  font-weight: 500;
  letter-spacing: -0.022em;
  max-width: 22ch;
  color: var(--ink);
  margin: 0 0 8px;
  line-height: 1.15;
}
footer.site .tag .end-dot { color: var(--cyan); }
footer.site .ops {
  font-family: var(--mono); font-size: 12px;
  color: var(--ink-3); letter-spacing: 0.06em;
  margin: 0 0 32px;
}
footer.site .ops a { color: var(--cyan); }
footer.site .columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 32px;
  margin: 40px 0 32px;
}
footer.site .col-label {
  font-family: var(--mono); font-size: 10.5px; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink-4); margin-bottom: 12px;
}
footer.site .col a {
  display: block; font-family: var(--sans); font-size: 13.5px; color: var(--ink-2);
  margin-bottom: 8px; transition: color 200ms var(--ease-out);
}
footer.site .col a:hover { color: var(--cyan); text-decoration: none; }
footer.site .meta {
  font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); letter-spacing: 0.08em;
  padding-top: 22px; border-top: 1px solid var(--line-soft);
}

/* ============================================================== */
/* Reveal animations                                                */
/* ============================================================== */
@media (prefers-reduced-motion: no-preference) {
  .mn-reveal {
    opacity: 0; transform: translateY(18px);
    transition: opacity 720ms var(--ease), transform 720ms var(--ease);
    will-change: opacity, transform;
  }
  .mn-reveal.mn-in { opacity: 1; transform: translateY(0); }
}

/* ============================================================== */
/* Responsive                                                       */
/* ============================================================== */
@media (max-width: 720px) {
  header.site { padding: 14px 20px; }
  section.hero { padding: 32px 20px 64px; }
  section.band { padding: 64px 20px; }
  footer.site { padding: 48px 20px; }
  .mn-diagram { padding: 0 20px; }
}

/* ============================================================== */
/* PACKET PREVIEW                                                  */
/* ============================================================== */
.win.packet { }
.packet-body {
  display: grid;
  grid-template-columns: 220px 1fr;
  min-height: 480px;
}
@media (max-width: 900px) { .packet-body { grid-template-columns: 1fr; } }
.packet-contents {
  padding: 18px 16px;
  border-right: 1px solid var(--line-soft);
  background: var(--bg-2);
}
.rail-label {
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink-4);
  margin: 0 0 14px;
}
.rail-label.center { text-align: center; }
.rail-item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px;
  border-radius: 4px;
  font-family: var(--mono); font-size: 11.5px;
  color: var(--ink-3);
  cursor: default;
  transition: background 200ms var(--ease-out), color 200ms var(--ease-out);
}
.rail-item:hover { background: var(--surface); color: var(--ink-2); }
.rail-item.active { background: var(--cyan-soft); color: var(--cyan); border-left: 2px solid var(--cyan); padding-left: 8px; }
.rail-item .nn { color: var(--ink-4); font-size: 10.5px; min-width: 18px; }
.rail-item.active .nn { color: var(--cyan); }
.rail-item .rail-page { margin-left: auto; color: var(--ink-4); font-size: 10px; }
.packet-main { padding: 22px 26px; }
.packet-header { margin-bottom: 28px; padding-bottom: 22px; border-bottom: 1px solid var(--line-soft); }
.packet-eyebrow {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--ink-4); margin: 0 0 12px;
}
.packet-title {
  font-family: var(--serif);
  font-size: clamp(20px, 2.2vw, 28px);
  font-weight: 500;
  letter-spacing: -0.018em;
  margin: 0 0 14px;
  color: var(--ink);
  line-height: 1.25;
  max-width: 32ch;
}
.packet-title.small { font-size: clamp(18px, 1.7vw, 22px); margin-bottom: 10px; }
.packet-pills { display: flex; gap: 6px; flex-wrap: wrap; }
.pill {
  font-family: var(--mono); font-size: 10px;
  font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 3px;
  display: inline-flex; align-items: center; gap: 5px;
}
.pill.purple { color: var(--purple); border: 1px solid rgba(185,164,255,.32); background: var(--purple-soft); }
.pill.cyan   { color: var(--cyan);   border: 1px solid rgba(95,209,255,.32);  background: var(--cyan-soft); }
.pill.yellow { color: var(--yellow); border: 1px solid rgba(255,212,73,.32);  background: var(--yellow-soft); }
.pill.green  { color: var(--green);  border: 1px solid rgba(102,226,155,.32); background: var(--green-soft); }
.pill.red    { color: var(--red);    border: 1px solid rgba(255,119,102,.32); background: rgba(255,119,102,.08); }
.pill.orange { color: #ffa14a;       border: 1px solid rgba(255,161,74,.32);  background: rgba(255,161,74,.08); }
.pill.purple2 { color: #d4b8ff; border: 1px solid rgba(212,184,255,.32); background: rgba(212,184,255,.08); }
.packet-section { margin-bottom: 24px; }
.section-label {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--cyan); margin: 0 0 10px;
}
.section-title {
  font-family: var(--serif); font-size: 22px;
  font-weight: 500; letter-spacing: -0.012em;
  margin: 0 0 12px; color: var(--ink); line-height: 1.35;
  max-width: 30ch;
}
.section-body {
  font-family: var(--sans); font-size: 14.5px; line-height: 1.65;
  color: var(--ink-3); margin: 0; max-width: 76ch;
}

/* Adoption forecast block */
.adoption-forecast { margin-top: 6px; }
.forecast-meta {
  display: flex; justify-content: space-between;
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--ink-4); margin-bottom: 14px;
  padding-bottom: 10px; border-bottom: 1px solid var(--line-soft);
}
.range-row {
  display: grid;
  grid-template-columns: 240px 1fr 100px 150px;
  align-items: center;
  gap: 18px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line-soft);
}
.range-row:last-child { border-bottom: 0; }
.range-name {
  font-family: var(--sans); font-size: 14px; color: var(--ink);
  display: flex; align-items: center; gap: 10px;
}
.range-name .letter {
  font-family: var(--mono); font-weight: 700; color: var(--cyan);
  font-size: 13px;
}
.range-row.yellow .range-name .letter { color: var(--yellow); }
.range-row.dim .range-name .letter, .range-row.dim .range-name { color: var(--ink-4); }
.range-track {
  position: relative; height: 8px;
  background: var(--surface-2);
  border-radius: 4px; overflow: hidden;
}
.range-track .threshold {
  position: absolute; top: -3px; bottom: -3px; left: 35%;
  width: 1px; background: var(--ink-4);
  opacity: 0.8;
}
.range-track .seg {
  position: absolute; top: 0; bottom: 0;
  background: var(--cyan); border-radius: 4px;
}
.range-row.yellow .range-track .seg { background: var(--yellow); }
.range-row.dim .range-track { background: var(--surface-2); }
.range-val {
  font-family: var(--mono); font-size: 12.5px;
  color: var(--ink); text-align: right; font-weight: 600;
}
.range-row.dim .range-val { color: var(--ink-4); }
.range-conf {
  font-family: var(--mono); font-size: 9.5px;
  letter-spacing: 0.12em; text-transform: uppercase;
  padding: 4px 8px;
  border: 1px solid var(--cyan); color: var(--cyan);
  background: var(--cyan-soft);
  border-radius: 3px; text-align: center;
}
.range-row.yellow .range-conf { border-color: var(--yellow); color: var(--yellow); background: var(--yellow-soft); }
.range-row.dim .range-conf { border-color: var(--ink-4); color: var(--ink-4); background: transparent; }
.packet-foot {
  margin-top: 22px; padding-top: 18px;
  border-top: 1px solid var(--line-soft);
  font-family: var(--serif); font-size: 14px;
  color: var(--ink-3); line-height: 1.65;
  max-width: 76ch;
}

/* ============================================================== */
/* SCHEDULE                                                        */
/* ============================================================== */
.sched-head { padding: 22px 26px; border-bottom: 1px solid var(--line-soft); }
.progress-row {
  display: flex; align-items: center; gap: 14px;
  margin-top: 20px;
}
.progress-label {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--ink-4); min-width: 70px;
}
.progress-bar {
  flex: 1; height: 6px; background: var(--surface-2);
  border-radius: 3px; overflow: hidden;
}
.progress-bar .fill { height: 100%; background: var(--cyan); border-radius: 3px; }
.progress-pct {
  font-family: var(--mono); font-size: 11px;
  color: var(--cyan); letter-spacing: 0.04em;
}
.sched-body { padding: 28px 26px 16px; }
.sched-body .rail-label { margin-bottom: 18px; }
.schedule-track {
  position: relative; margin: 0 18px;
}
.schedule-track .line {
  position: relative; height: 1px;
  background: var(--line);
  top: 14px;
}
.schedule-track .line .progress {
  position: absolute; left: 0; height: 100%;
  background: linear-gradient(90deg, var(--green) 0%, var(--cyan) 100%);
}
.schedule-track .nodes {
  display: flex; justify-content: space-between; align-items: center;
  position: relative; height: 28px;
  margin-top: -14px;
}
.schedule-track .node {
  width: 28px; height: 28px;
  border-radius: 50%; border: 1px solid var(--line);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 11px; color: var(--ink-4);
  background: var(--surface);
}
.schedule-track .node.done { color: var(--green); border-color: var(--green); }
.schedule-track .node.active {
  color: var(--cyan); border-color: var(--cyan);
  background: var(--cyan-soft);
  box-shadow: 0 0 0 4px rgba(95,209,255,.08);
}
.schedule-labels {
  display: flex; justify-content: space-between;
  margin: 16px 18px 0;
  font-family: var(--mono);
}
.schedule-labels span {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  font-size: 10.5px; color: var(--ink-4); letter-spacing: 0.10em;
  text-align: center;
}
.schedule-labels strong { color: var(--ink-2); font-weight: 700; }
.schedule-labels em {
  font-style: normal; color: var(--ink-4);
  text-transform: uppercase; font-size: 9.5px; letter-spacing: 0.12em;
  max-width: 110px;
}
.schedule-foot {
  padding: 12px 26px;
  border-top: 1px solid var(--line-soft);
  font-family: var(--mono); font-size: 11px; color: var(--ink-2);
  letter-spacing: 0.02em; background: var(--bg-2);
}
.schedule-foot strong { color: var(--yellow); font-weight: 700; letter-spacing: 0.14em; margin-right: 10px; }
.schedule-foot .ink { color: var(--ink); }

/* ============================================================== */
/* FACTORY (rebuilt)                                               */
/* ============================================================== */
.factory-bar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 14px 22px;
  border-bottom: 1px solid var(--line-soft);
  background: var(--bg-2);
}
.factory-bar .factory-bar-l { display: flex; gap: 6px; flex-wrap: wrap; }
.factory-bar .factory-bar-r {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.16em; text-transform: uppercase;
}
.tri-step { color: var(--ink-4); padding: 4px 10px; border-radius: 3px; border: 1px solid transparent; transition: all 220ms var(--ease-out); }
.tri-step.done   { color: var(--green); border-color: rgba(102,226,155,0.32); background: var(--green-soft); }
.tri-step.active { color: var(--cyan);  border-color: rgba(95,209,255,0.32);  background: var(--cyan-soft);  box-shadow: 0 0 0 1px rgba(95,209,255,0.18); }
.tri-sep { color: var(--ink-4); }

.factory-body {
  display: grid;
  grid-template-columns: 280px 1fr;
  min-height: 460px;
}
@media (max-width: 980px) {
  .factory-body { grid-template-columns: 1fr; }
}

.factory-inputs {
  padding: 22px 18px 18px;
  border-right: 1px solid var(--line-soft);
  background: var(--bg-2);
}
.factory-inputs .rail-label { margin-bottom: 14px; }
.input-card {
  position: relative;
  display: flex; align-items: stretch; gap: 12px;
  border: 1px solid var(--line); border-radius: 8px;
  padding: 12px 14px;
  margin-bottom: 10px;
  background: var(--surface);
  transition: border-color 280ms var(--ease-out), background 280ms var(--ease-out), transform 280ms var(--ease-out);
  cursor: default;
}
.input-card:hover {
  background: var(--surface-2);
  transform: translateX(2px);
}
.input-card.green:hover  { border-color: rgba(102,226,155,0.45); }
.input-card.cyan:hover   { border-color: rgba(95,209,255,0.45); }
.input-card.purple:hover { border-color: rgba(185,164,255,0.45); }
.input-card.active.purple { border-color: rgba(185,164,255,0.55); box-shadow: 0 0 0 1px rgba(185,164,255,0.20), 0 6px 20px -10px rgba(185,164,255,0.30); }
.input-card.dim { opacity: 0.45; }
.input-card .ic-dot {
  width: 6px; flex: 0 0 6px;
  border-radius: 3px;
  background: var(--ink-4);
  align-self: stretch;
  margin-right: 2px;
  box-shadow: 0 0 8px transparent;
  transition: box-shadow 320ms var(--ease-out);
}
.input-card .ic-dot.green  { background: var(--green);  box-shadow: 0 0 10px rgba(102,226,155,0.42); }
.input-card .ic-dot.cyan   { background: var(--cyan);   box-shadow: 0 0 10px rgba(95,209,255,0.42); }
.input-card .ic-dot.purple { background: var(--purple); box-shadow: 0 0 10px rgba(185,164,255,0.42); }
.input-card .ic-dot.dim    { background: var(--ink-4); box-shadow: none; }
.input-card .ic-content { flex: 1; min-width: 0; }
.input-card .ic-top {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 8px; margin-bottom: 4px;
}
.input-card .ic-name { font-family: var(--sans); font-size: 13.5px; color: var(--ink); font-weight: 500; }
.input-card .ic-rows {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.10em; text-transform: uppercase;
  color: var(--ink-3);
}
.input-card.green  .ic-rows { color: var(--green); }
.input-card.cyan   .ic-rows { color: var(--cyan); }
.input-card.purple .ic-rows { color: var(--purple); }
.input-card .ic-sub {
  font-family: var(--mono); font-size: 10.5px;
  color: var(--ink-4); letter-spacing: 0.02em;
}

.factory-canvas {
  padding: 24px 28px 16px;
  display: flex; align-items: center; justify-content: center;
  background:
    radial-gradient(800px circle at 30% 50%, rgba(95,209,255,0.04), transparent 60%),
    radial-gradient(600px circle at 80% 70%, rgba(102,226,155,0.04), transparent 60%);
}
.factory-svg { width: 100%; height: auto; max-height: 460px; }

/* Stage groups */
.factory-svg .factory-stage { cursor: default; transition: transform 320ms var(--ease-out); }
.factory-svg .factory-stage:hover { transform: translate(0, -2px); }
.factory-svg .factory-stage .ring { transition: stroke 280ms var(--ease-out), stroke-width 280ms var(--ease-out); }
.factory-svg .factory-stage:hover .ring { stroke-width: 2; }
.factory-svg .factory-stage.active .ring { animation: ringPulse 2.2s ease-in-out infinite; }
@keyframes ringPulse {
  0%, 100% { stroke-opacity: 1; r: 18; }
  50%      { stroke-opacity: 0.5; r: 22; }
}
.factory-svg .factory-stage.active .dot { animation: dotGlow 2.2s ease-in-out infinite; }
@keyframes dotGlow {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.5; }
}
.factory-svg .factory-stage:hover .sname { fill: var(--ink); }
.factory-svg .factory-stage:hover .snum  { fill: var(--cyan); }

/* Animated pulse traveling through the line */
.factory-svg .factory-pulse {
  stroke-dasharray: 6 18;
  animation: pulseFlow 4s linear infinite;
  opacity: 0.6;
}
@keyframes pulseFlow { to { stroke-dashoffset: -240; } }

/* Input curves: subtle fade-in on scroll */
.mn-diagram .factory-svg .factory-line { stroke-dasharray: 1000; stroke-dashoffset: 1000; }
.mn-diagram.mn-in .factory-svg .factory-line { animation: drawIn 1500ms var(--ease) forwards; }
.mn-diagram.mn-in .factory-svg .factory-line.in-1 { animation-delay: 120ms; }
.mn-diagram.mn-in .factory-svg .factory-line.in-2 { animation-delay: 240ms; }
.mn-diagram.mn-in .factory-svg .factory-line.in-3 { animation-delay: 360ms; }
@keyframes drawIn { to { stroke-dashoffset: 0; } }

/* Stage line draw-in */
.mn-diagram .factory-svg .factory-stage-line { stroke-dasharray: 200; stroke-dashoffset: 200; }
.mn-diagram.mn-in .factory-svg .factory-stage-line { animation: drawIn 900ms var(--ease) forwards; }
.mn-diagram.mn-in .factory-svg .factory-stage-line:nth-of-type(1) { animation-delay: 500ms; }
.mn-diagram.mn-in .factory-svg .factory-stage-line:nth-of-type(2) { animation-delay: 580ms; }
.mn-diagram.mn-in .factory-svg .factory-stage-line:nth-of-type(3) { animation-delay: 660ms; }
.mn-diagram.mn-in .factory-svg .factory-stage-line:nth-of-type(4) { animation-delay: 740ms; }
.mn-diagram.mn-in .factory-svg .factory-stage-line:nth-of-type(5) { animation-delay: 820ms; }
.mn-diagram.mn-in .factory-svg .factory-stage-line:nth-of-type(6) { animation-delay: 900ms; }

/* Stage nodes pop in */
.factory-svg .factory-stage { opacity: 0; transform: translate(0, 8px); }
.mn-diagram.mn-in .factory-svg .factory-stage { animation: stagePop 540ms var(--ease) forwards; }
.mn-diagram.mn-in .factory-svg .factory-stage:nth-of-type(1) { animation-delay: 600ms; }
.mn-diagram.mn-in .factory-svg .factory-stage:nth-of-type(2) { animation-delay: 700ms; }
.mn-diagram.mn-in .factory-svg .factory-stage:nth-of-type(3) { animation-delay: 800ms; }
.mn-diagram.mn-in .factory-svg .factory-stage:nth-of-type(4) { animation-delay: 900ms; }
.mn-diagram.mn-in .factory-svg .factory-stage:nth-of-type(5) { animation-delay: 1000ms; }
.mn-diagram.mn-in .factory-svg .factory-stage:nth-of-type(6) { animation-delay: 1100ms; }
.mn-diagram.mn-in .factory-svg .factory-stage:nth-of-type(7) { animation-delay: 1200ms; }
@keyframes stagePop { to { opacity: 1; transform: translate(0, 0); } }

/* Output node fade-in */
.factory-svg .factory-output-node { opacity: 0; }
.mn-diagram.mn-in .factory-svg .factory-output-node { animation: fadeIn 600ms var(--ease) 1400ms forwards; }
@keyframes fadeIn { to { opacity: 1; } }

/* Calibration loop traces last */
.factory-svg .factory-cal-loop { stroke-dasharray: 600; stroke-dashoffset: 600; opacity: 0; }
.mn-diagram.mn-in .factory-svg .factory-cal-loop { animation: calDraw 1800ms var(--ease) 1600ms forwards; }
@keyframes calDraw { to { stroke-dashoffset: 0; opacity: 1; } }

.factory-foot {
  padding: 14px 22px;
  border-top: 1px solid var(--line-soft);
  background: var(--bg-2);
  display: flex; justify-content: space-between; align-items: center; gap: 18px;
}
.calibration-line { display: flex; align-items: center; gap: 12px; }
.calibration-line .cal-label {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--green);
  padding: 4px 9px; border-radius: 3px;
  background: var(--green-soft);
  border: 1px solid rgba(102,226,155,0.30);
}
.calibration-line .cal-text { font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--ink-3); }
.factory-meta { display: flex; gap: 8px; font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); letter-spacing: 0.08em; text-transform: uppercase; }
.factory-meta .dim { color: var(--ink-4); }

/* Backwards-compat (some pages still reference old calibration-box markup) */
.calibration-box {
  padding: 12px 14px;
  border: 1px solid rgba(102,226,155,.34);
  background: var(--green-soft);
  border-radius: 6px;
}
.calibration-box .cal-label {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--green); margin: 0 0 8px;
}
.calibration-box .cal-body {
  font-family: var(--serif); font-size: 13px;
  color: var(--ink-2); line-height: 1.55; margin: 0;
}

/* ============================================================== */
/* DESK                                                            */
/* ============================================================== */
.desk-stats-row {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 12px;
  padding: 18px;
}
@media (max-width: 900px) { .desk-stats-row { grid-template-columns: 1fr; } }
.desk-zone {
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}
.desk-zone.yellow { border-color: rgba(255,212,73,.30); }
.desk-zone.cyan { border-color: rgba(95,209,255,.30); }
.zone-label {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.14em; text-transform: uppercase;
  margin: 0 0 8px;
}
.desk-zone.yellow .zone-label { color: var(--yellow); }
.desk-zone.cyan .zone-label { color: var(--cyan); }
.zone-body {
  font-family: var(--sans); font-size: 13px;
  color: var(--ink-3); margin: 0 0 12px; line-height: 1.5;
}
.zone-body em { font-family: var(--serif); font-style: italic; }
.zone-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.zone-metrics.four { grid-template-columns: repeat(4, 1fr); }
.zone-metrics .zm .zm-n {
  font-family: var(--serif); font-size: 26px;
  font-weight: 500; color: var(--ink); line-height: 1;
}
.zone-metrics .zm .zm-l {
  font-family: var(--mono); font-size: 10px; color: var(--ink-4);
  letter-spacing: 0.10em; text-transform: uppercase;
  margin-top: 4px;
}
.desk-cols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  padding: 0 18px 18px;
}
@media (max-width: 900px) { .desk-cols { grid-template-columns: 1fr; } }
.desk-col-body {
  padding: 14px 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}
.col-h {
  font-family: var(--mono); font-size: 10.5px;
  font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase;
  margin: 0 0 12px;
}
.col-h.yellow { color: var(--yellow); }
.col-h.green { color: var(--green); }
.desk-card {
  padding: 11px 12px;
  border: 1px solid var(--line); border-radius: 6px;
  background: var(--bg-2);
  margin-bottom: 8px;
  transition: border-color 200ms var(--ease-out);
}
.desk-card:hover { border-color: var(--cyan); }
.desk-card-top {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 6px;
}
.dc-id {
  font-family: var(--mono); font-size: 11px;
  color: var(--ink-3); letter-spacing: 0.06em;
}
.dc-title {
  font-family: var(--sans); font-size: 13.5px;
  color: var(--ink); line-height: 1.4; margin-bottom: 4px;
}
.dc-sub {
  font-family: var(--mono); font-size: 10.5px;
  color: var(--ink-4); letter-spacing: 0.04em;
}

/* ============================================================== */
/* BUYERS                                                          */
/* ============================================================== */
.buyers-toolbar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 18px;
  border-bottom: 1px solid var(--line-soft);
}
.seg { display: flex; align-items: center; gap: 6px; }
.seg-label {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink-4); margin-right: 8px;
}
.seg-btn {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.08em; text-transform: uppercase;
  padding: 5px 12px; border-radius: 4px;
  color: var(--ink-3); background: var(--surface);
  border: 1px solid var(--line);
  cursor: default;
  transition: all 200ms var(--ease-out);
}
.seg-btn.active { color: var(--cyan); background: var(--cyan-soft); border-color: var(--cyan); }
.seg-btn:hover:not(.active) { color: var(--ink-2); border-color: var(--ink-3); }
.buyers-meta {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-4);
}
.buyers-table {
  width: 100%; border-collapse: collapse;
  font-family: var(--sans); font-size: 14px;
}
.buyers-table th {
  text-align: left;
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink-4); font-weight: 700;
  padding: 12px 18px; border-bottom: 1px solid var(--line);
}
.buyers-table td {
  padding: 14px 18px;
  border-bottom: 1px solid var(--line-soft);
  color: var(--ink-2);
}
.buyers-table tr:hover td { background: var(--bg-2); }
.buyers-table tr:last-child td { border-bottom: 0; }
.badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%;
  margin-right: 10px;
  font-family: var(--mono); font-size: 9.5px; font-weight: 700;
  letter-spacing: 0.06em;
}
.badge.green  { background: var(--green-soft);  color: var(--green);  border: 1px solid rgba(102,226,155,.40); }
.badge.cyan   { background: var(--cyan-soft);   color: var(--cyan);   border: 1px solid rgba(95,209,255,.40); }
.badge.red    { background: rgba(255,119,102,.08); color: var(--red); border: 1px solid rgba(255,119,102,.40); }
.badge.yellow { background: var(--yellow-soft); color: var(--yellow); border: 1px solid rgba(255,212,73,.40); }
.badge.orange { background: rgba(255,161,74,.08); color: #ffa14a; border: 1px solid rgba(255,161,74,.40); }
.badge.purple { background: var(--purple-soft); color: var(--purple); border: 1px solid rgba(185,164,255,.40); }
.badge.purple2{ background: rgba(212,184,255,.08); color: #d4b8ff; border: 1px solid rgba(212,184,255,.40); }
.run-link { color: var(--cyan); }
.run-link:hover { color: #97e1ff; }
.mono { font-family: var(--mono); font-size: 12.5px; }
.mono.dim { color: var(--ink-4); }
.buyers-foot {
  padding: 14px 18px;
  font-family: var(--serif); font-style: italic;
  font-size: 13.5px; color: var(--ink-3);
  border-top: 1px solid var(--line-soft);
}

/* ============================================================== */
/* LIBRARY                                                         */
/* ============================================================== */
.lib-meta {
  padding: 10px 18px;
  border-bottom: 1px solid var(--line-soft);
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.12em; color: var(--ink-4);
}
.lib-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--line-soft);
  padding: 1px;
}
@media (max-width: 900px) { .lib-grid { grid-template-columns: 1fr; } }
.lib-card {
  padding: 22px 22px 20px;
  background: var(--surface);
  display: flex; flex-direction: column; gap: 12px;
  transition: background 220ms var(--ease-out);
}
.lib-card:hover { background: var(--surface-2); }
.lc-head { display: flex; align-items: center; gap: 12px; }
.lc-type {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--ink-4);
}
.lc-title {
  font-family: var(--serif); font-size: 22px;
  font-weight: 500; letter-spacing: -0.014em;
  color: var(--ink); line-height: 1.3;
}
.lc-body {
  font-family: var(--sans); font-size: 14px;
  color: var(--ink-3); line-height: 1.6;
}
.lc-foot {
  display: flex; gap: 10px; align-items: center;
  font-family: var(--mono); font-size: 11px;
  color: var(--ink-3); letter-spacing: 0.04em;
  padding-top: 10px; border-top: 1px solid var(--line-soft);
}
.lc-foot .sep { opacity: 0.5; }
.lib-foot {
  padding: 14px 18px;
  font-family: var(--serif); font-style: italic;
  font-size: 13.5px; color: var(--ink-3);
  border-top: 1px solid var(--line-soft);
}

/* ============================================================== */
/* SMALL PILL                                                       */
/* ============================================================== */
.pill.small { padding: 2px 6px; font-size: 9.5px; letter-spacing: 0.10em; }

/* ============================================================== */
/* SLACK                                                            */
/* ============================================================== */
.slack-body { display: grid; grid-template-columns: 220px 1fr; min-height: 460px; }
@media (max-width: 900px) { .slack-body { grid-template-columns: 1fr; } }
.slack-rail { padding: 16px 14px; border-right: 1px solid var(--line-soft); background: var(--bg-2); }
.slack-channel {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 10px; border-radius: 4px;
  font-family: var(--mono); font-size: 12.5px; color: var(--ink-3);
  margin-bottom: 2px;
  transition: background 200ms var(--ease-out);
}
.slack-channel:hover { background: var(--surface); color: var(--ink-2); }
.slack-channel.active { background: var(--cyan-soft); color: var(--cyan); }
.slack-channel .ch-sym { color: var(--ink-4); width: 10px; text-align: center; }
.slack-channel.active .ch-sym { color: var(--cyan); }
.slack-channel .ch-name { flex: 1; }
.slack-channel .ch-unread {
  font-family: var(--mono); font-size: 10px; font-weight: 700;
  padding: 1px 6px; border-radius: 8px;
  background: var(--cyan); color: var(--bg);
}
.slack-main { padding: 16px 22px 22px; }
.slack-head {
  display: flex; align-items: baseline; gap: 8px;
  padding-bottom: 12px; border-bottom: 1px solid var(--line-soft); margin-bottom: 16px;
}
.slack-head .ch-sym { font-family: var(--mono); color: var(--ink-4); }
.slack-head .ch-title { font-family: var(--sans); font-size: 16px; color: var(--ink); font-weight: 600; }
.slack-head .ch-meta { font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); letter-spacing: 0.06em; margin-left: 10px; }
.msg { display: flex; gap: 12px; padding: 10px 0; }
.msg .avatar {
  width: 34px; height: 34px; border-radius: 4px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 11.5px; font-weight: 700; color: var(--bg);
}
.msg .avatar.cyan { background: var(--cyan); }
.msg-body { flex: 1; font-family: var(--sans); font-size: 14px; color: var(--ink-2); line-height: 1.55; }
.msg-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 4px; }
.msg-head strong { color: var(--ink); font-weight: 600; font-size: 14px; }
.msg-head .msg-time { font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); letter-spacing: 0.06em; }
.reactions { margin-top: 6px; display: flex; gap: 6px; }
.rxn {
  display: inline-flex; align-items: center; gap: 4px;
  font-family: var(--mono); font-size: 11px;
  padding: 2px 7px; border-radius: 10px;
  background: var(--surface-2); border: 1px solid var(--line);
  color: var(--ink-3);
}
.forecast-attachment {
  margin-top: 8px; border-left: 3px solid var(--cyan);
  background: var(--surface-2); border-radius: 0 6px 6px 0;
  overflow: hidden;
}
.att-bar {
  padding: 8px 12px; border-bottom: 1px solid var(--line-soft);
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3);
  display: flex; justify-content: space-between; align-items: center;
}
.att-body { padding: 8px 12px; }
.att-line {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 0;
  font-family: var(--sans); font-size: 13.5px; color: var(--ink-2);
}
.att-line .att-letter { font-family: var(--mono); font-weight: 700; color: var(--cyan); }
.att-line .att-range { font-family: var(--mono); font-size: 11.5px; color: var(--ink-3); margin-left: auto; }
.att-line .att-range.mn-accent { color: var(--cyan); }
.att-foot {
  padding: 8px 12px; border-top: 1px solid var(--line-soft);
  font-family: var(--mono); font-size: 10.5px; color: var(--ink-3);
  letter-spacing: 0.04em;
}
.att-foot .ink { color: var(--ink); }

/* ============================================================== */
/* WHATSAPP                                                         */
/* ============================================================== */
.win.whatsapp { max-width: 480px; margin: 0 auto; }
.wa-head {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 18px;
  background: var(--surface-2);
  border-bottom: 1px solid var(--line-soft);
}
.wa-avatar {
  width: 38px; height: 38px; border-radius: 50%;
  background: linear-gradient(135deg, var(--green), var(--cyan));
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-weight: 700; color: var(--bg); font-size: 12px;
}
.wa-name { font-family: var(--sans); color: var(--ink); font-weight: 600; font-size: 15px; }
.wa-sub { font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); letter-spacing: 0.08em; }
.wa-body { padding: 18px; min-height: 460px; display: flex; flex-direction: column; gap: 8px; }
.wa-day {
  font-family: var(--mono); font-size: 10px;
  color: var(--ink-4); letter-spacing: 0.14em;
  text-align: center; padding: 6px 0;
}
.bubble {
  max-width: 78%; padding: 10px 14px; border-radius: 14px;
  font-family: var(--sans); font-size: 14px; line-height: 1.55;
}
.bubble.in { align-self: flex-start; background: var(--surface-2); color: var(--ink-2); border-top-left-radius: 4px; }
.bubble.out { align-self: flex-end; background: var(--cyan-soft); color: var(--ink); border-top-right-radius: 4px; border: 1px solid rgba(95,209,255,0.30); }
.bubble.tiny { font-size: 12.5px; opacity: 0.85; }
.bubble strong { color: var(--ink); }
.bubble em { font-style: italic; color: var(--ink-3); }
.bubble .mono { font-family: var(--mono); font-size: 13px; }
.bubble .cyan { color: var(--cyan); }
.wa-rule { border: 0; border-top: 1px solid var(--line-soft); margin: 8px 0; }

/* ============================================================== */
/* FIRST 10 MOVES TRACKER                                           */
/* ============================================================== */
.ft-head { padding: 16px 22px; border-bottom: 1px solid var(--line-soft); }
.ft-grid {
  padding: 18px; display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px;
}
.ft-card {
  padding: 14px 14px 14px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--surface); transition: border-color 200ms var(--ease-out);
}
.ft-card.green { border-color: rgba(102,226,155,0.32); }
.ft-card.red { border-color: rgba(255,119,102,0.32); }
.ft-card.yellow { border-color: rgba(255,212,73,0.32); }
.ft-card.cyan { border-color: rgba(95,209,255,0.32); }
.ft-card.purple { border-color: rgba(185,164,255,0.32); }
.ft-card.dim { opacity: 0.55; }
.ft-card:hover { background: var(--surface-2); }
.ft-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.ft-n { font-family: var(--mono); font-size: 11px; color: var(--ink-4); letter-spacing: 0.14em; }
.ft-name { font-family: var(--serif); font-size: 16px; font-weight: 500; color: var(--ink); margin-bottom: 4px; letter-spacing: -0.01em; }
.ft-v { font-family: var(--mono); font-size: 11px; color: var(--ink-3); letter-spacing: 0.04em; }
.ft-foot { padding: 12px 22px; border-top: 1px solid var(--line-soft); font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--ink-3); }

/* ============================================================== */
/* SIX QUESTIONS PANEL                                              */
/* ============================================================== */
.sq-head { padding: 18px 22px; border-bottom: 1px solid var(--line-soft); }
.sq-list { padding: 8px 22px 18px; }
.sq-row {
  display: grid; grid-template-columns: 60px 1fr 1fr; align-items: center; gap: 18px;
  padding: 14px 0; border-bottom: 1px solid var(--line-soft);
}
.sq-row:last-child { border-bottom: 0; }
.sq-n {
  font-family: var(--mono); font-weight: 700; font-size: 16px;
  padding: 8px 0; text-align: center;
  border-radius: 4px;
  letter-spacing: 0.08em;
}
.sq-n.cyan { color: var(--cyan); background: var(--cyan-soft); }
.sq-n.yellow { color: var(--yellow); background: var(--yellow-soft); }
.sq-n.green { color: var(--green); background: var(--green-soft); }
.sq-n.purple { color: var(--purple); background: var(--purple-soft); }
.sq-q { font-family: var(--serif); font-size: 17px; color: var(--ink); font-style: italic; }
.sq-a { font-family: var(--mono); font-size: 12.5px; color: var(--ink-2); letter-spacing: 0.02em; }
.sq-foot { padding: 12px 22px; border-top: 1px solid var(--line-soft); font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--ink-3); }

/* ============================================================== */
/* FORECAST CONTRACT JSON                                          */
/* ============================================================== */
.fc-head { padding: 18px 22px; border-bottom: 1px solid var(--line-soft); }
.fc-json {
  margin: 0; padding: 22px 24px;
  font-family: var(--mono); font-size: 13px; line-height: 1.85;
  background: var(--bg);
  border-bottom: 1px solid var(--line-soft);
  overflow-x: auto;
}
.fc-json .brace { color: var(--ink-3); }
.fc-json .key { color: var(--cyan); }
.fc-json .punct { color: var(--ink-4); }
.fc-json .val { color: var(--ink-2); }
.fc-foot { padding: 12px 22px; font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--ink-3); }

/* ============================================================== */
/* VENDOR SCORECARDS                                                */
/* ============================================================== */
.vs-head { padding: 18px 22px; border-bottom: 1px solid var(--line-soft); }
.vs-table { width: 100%; border-collapse: collapse; font-family: var(--sans); font-size: 13.5px; }
.vs-table th {
  text-align: left;
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink-4); font-weight: 700;
  padding: 12px 14px; border-bottom: 1px solid var(--line);
}
.vs-table td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--line-soft);
  vertical-align: middle;
}
.vs-table tr:hover td { background: var(--bg-2); }
.vs-table tr:last-child td { border-bottom: 0; }
.vs-engine { font-family: var(--sans); font-weight: 600; padding: 3px 8px; border-radius: 3px; }
.vs-engine.cyan { color: var(--cyan); }
.vs-engine.purple { color: var(--purple); }
.vs-engine.green { color: var(--green); }
.vs-engine.yellow { color: var(--yellow); }
.vs-bar { position: relative; height: 8px; background: var(--surface-2); border-radius: 4px; min-width: 90px; }
.vs-fill { position: absolute; left: 0; top: 0; bottom: 0; background: var(--ink-3); border-radius: 4px; }
.vs-fill.cyan { background: var(--cyan); }
.vs-fill.green { background: var(--green); }
.vs-fill.yellow { background: var(--yellow); }
.vs-bar-n { position: absolute; right: -28px; top: -3px; font-family: var(--mono); font-size: 11px; color: var(--ink-3); }
.vs-foot { padding: 12px 22px; font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--ink-3); border-top: 1px solid var(--line-soft); }

/* ============================================================== */
/* 10-LAYER STACK                                                   */
/* ============================================================== */
.stack-head { padding: 18px 22px; border-bottom: 1px solid var(--line-soft); }
.stack { padding: 18px; display: flex; flex-direction: column; gap: 6px; }
.stack-layer {
  display: grid; grid-template-columns: 60px 220px 1fr; align-items: center; gap: 18px;
  padding: 14px 18px;
  border: 1px solid var(--line); border-radius: 6px;
  background: var(--surface);
  transition: border-color 200ms var(--ease-out), background 200ms var(--ease-out);
}
.stack-layer:hover { background: var(--surface-2); }
.stack-layer.cyan { border-left: 3px solid var(--cyan); }
.stack-layer.purple { border-left: 3px solid var(--purple); }
.stack-layer.green { border-left: 3px solid var(--green); }
.stack-layer.yellow { border-left: 3px solid var(--yellow); }
.sl-id { font-family: var(--mono); font-weight: 700; color: var(--cyan); letter-spacing: 0.10em; }
.stack-layer.purple .sl-id { color: var(--purple); }
.stack-layer.green .sl-id { color: var(--green); }
.stack-layer.yellow .sl-id { color: var(--yellow); }
.sl-name { font-family: var(--serif); font-size: 17px; font-weight: 500; color: var(--ink); }
.sl-sub { font-family: var(--mono); font-size: 11.5px; color: var(--ink-3); letter-spacing: 0.02em; }
.stack-foot { padding: 12px 22px; font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--ink-3); border-top: 1px solid var(--line-soft); }

/* ============================================================== */
/* NOT CLAIMABLE                                                    */
/* ============================================================== */
.nc-banner {
  padding: 22px 26px;
  background: var(--yellow-soft);
  border-bottom: 1px solid rgba(255,212,73,0.32);
}
.nc-label {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--yellow); margin-bottom: 8px;
}
.nc-title {
  font-family: var(--serif); font-size: 24px; font-weight: 500; letter-spacing: -0.018em;
  color: var(--ink); margin: 0 0 8px; line-height: 1.25;
}
.nc-body { font-family: var(--sans); font-size: 14.5px; color: var(--ink-2); line-height: 1.6; margin: 0; max-width: 70ch; }
.nc-reasons { padding: 18px 22px 4px; }
.nc-row {
  display: flex; align-items: flex-start; gap: 14px;
  padding: 12px 14px; border-radius: 6px;
  background: var(--surface); border: 1px solid var(--line);
  margin-bottom: 8px;
}
.nc-row.yellow { border-color: rgba(255,212,73,0.32); }
.nc-row.red { border-color: rgba(255,119,102,0.32); background: rgba(255,119,102,0.04); }
.nc-sym { font-size: 18px; line-height: 1; padding-top: 2px; }
.nc-row.yellow .nc-sym { color: var(--yellow); }
.nc-row.red .nc-sym { color: var(--red); }
.nc-name { font-family: var(--sans); font-size: 14.5px; color: var(--ink); font-weight: 600; margin-bottom: 2px; }
.nc-sub { font-family: var(--mono); font-size: 11.5px; color: var(--ink-3); letter-spacing: 0.02em; line-height: 1.55; }
.nc-foot { padding: 14px 22px; font-family: var(--serif); font-style: italic; font-size: 13.5px; color: var(--ink-3); border-top: 1px solid var(--line-soft); }

/* ============================================================== */
/* EVIDENCE FRONTIER                                                */
/* ============================================================== */
.ef-head { padding: 18px 22px; border-bottom: 1px solid var(--line-soft); }
.ef-bar {
  display: flex; height: 56px;
  border-radius: 6px; overflow: hidden;
  margin: 18px 22px;
}
.ef-seg {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 4px;
}
.ef-seg.green { background: var(--green); }
.ef-seg.cyan { background: var(--cyan); }
.ef-seg.yellow { background: var(--yellow); }
.ef-seg .ef-pct { font-family: var(--mono); font-size: 16px; font-weight: 700; color: var(--bg); letter-spacing: 0.02em; }
.ef-seg .ef-label { font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: rgba(10,10,8,0.7); }
.ef-rows { padding: 0 22px 18px; }
.ef-row {
  display: grid; grid-template-columns: 100px 1fr; align-items: center; gap: 18px;
  padding: 14px 0; border-bottom: 1px solid var(--line-soft);
}
.ef-row:last-child { border-bottom: 0; }
.ef-n {
  font-family: var(--serif); font-size: 36px; font-weight: 500; line-height: 1;
  text-align: right;
}
.ef-row.green .ef-n { color: var(--green); }
.ef-row.cyan .ef-n { color: var(--cyan); }
.ef-row.yellow .ef-n { color: var(--yellow); }
.ef-rows-l { font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); letter-spacing: 0.10em; margin-left: 6px; }
.ef-name { font-family: var(--sans); font-size: 15px; font-weight: 600; color: var(--ink); margin-bottom: 4px; }
.ef-sub { font-family: var(--mono); font-size: 12px; color: var(--ink-3); letter-spacing: 0.02em; line-height: 1.55; }
.ef-foot { padding: 12px 22px; font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--ink-3); border-top: 1px solid var(--line-soft); }

/* ============================================================== */
/* MOVE TEMPLATE                                                    */
/* ============================================================== */
.mt-head { padding: 18px 22px; border-bottom: 1px solid var(--line-soft); }
.mt-fields { padding: 18px 22px; }
.mt-row {
  display: grid; grid-template-columns: 180px 1fr; align-items: baseline; gap: 18px;
  padding: 12px 0; border-bottom: 1px solid var(--line-soft);
}
.mt-row:last-child { border-bottom: 0; }
.mt-label {
  font-family: var(--mono); font-size: 10.5px;
  font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
}
.mt-label.cyan { color: var(--cyan); }
.mt-label.purple { color: var(--purple); }
.mt-label.green { color: var(--green); }
.mt-label.yellow { color: var(--yellow); }
.mt-value { font-family: var(--sans); font-size: 14.5px; color: var(--ink-2); line-height: 1.5; }
.mt-foot { padding: 12px 22px; font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--ink-3); border-top: 1px solid var(--line-soft); }

/* ============================================================== */
/* APPROVAL ROUTING                                                */
/* ============================================================== */
.ap-head { padding: 18px 22px; border-bottom: 1px solid var(--line-soft); }
.ap-flow { padding: 22px 28px; display: flex; flex-direction: column; align-items: stretch; }
.ap-node {
  display: flex; align-items: center; gap: 14px;
  padding: 12px 14px;
  border: 1px solid var(--line); border-radius: 8px;
  background: var(--surface);
}
.ap-node.start { border-color: var(--cyan); background: var(--cyan-soft); }
.ap-node.done { border-color: rgba(102,226,155,0.32); }
.ap-node.active { border-color: var(--yellow); background: var(--yellow-soft); }
.ap-node.queue { opacity: 0.55; }
.ap-node strong { display: block; font-family: var(--sans); font-size: 14px; color: var(--ink); margin-bottom: 2px; }
.ap-node > div > span { font-family: var(--mono); font-size: 11px; color: var(--ink-3); letter-spacing: 0.04em; }
.ap-line { width: 1px; height: 20px; background: var(--line); margin: 4px auto; }
.ap-branch { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 720px) { .ap-branch { grid-template-columns: 1fr; } }
.badge.dim { background: var(--surface-2); color: var(--ink-4); border-color: var(--line); }

/* ============================================================== */
/* BOARD AUDIT                                                      */
/* ============================================================== */
.ba-head { padding: 18px 22px; border-bottom: 1px solid var(--line-soft); }
.ba-kpis {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 1px; background: var(--line-soft); padding: 1px;
}
.ba-kpi { padding: 22px; background: var(--surface); }
.ba-kpi:hover { background: var(--surface-2); }
.ba-n {
  font-family: var(--serif); font-size: 42px; font-weight: 500;
  letter-spacing: -0.025em; color: var(--ink); line-height: 1; margin-bottom: 8px;
}
.ba-l {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-3);
  margin-bottom: 8px;
}
.ba-d { font-family: var(--mono); font-size: 11px; letter-spacing: 0.04em; }
.ba-d.green { color: var(--green); }
.ba-d.cyan { color: var(--cyan); }
.ba-d.yellow { color: var(--yellow); }
.ba-d.red { color: var(--red); }
.ba-foot { padding: 14px 22px; font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--ink-3); border-top: 1px solid var(--line-soft); }

/* ============================================================== */
/* SCORED CASE-STUDY SCORECARD (interactive tabs)                  */
/* ============================================================== */
.sc-tabs {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border-bottom: 1px solid var(--line-soft);
  background: var(--bg-2);
}
@media (max-width: 900px) { .sc-tabs { grid-template-columns: repeat(2, 1fr); } }
.sc-tab {
  display: flex; flex-direction: column; gap: 4px;
  padding: 12px 16px;
  background: transparent;
  border: 0; border-right: 1px solid var(--line-soft); border-bottom: 2px solid transparent;
  font-family: var(--mono); text-align: left; cursor: pointer;
  color: var(--ink-3);
  transition: background 220ms var(--ease-out), border-color 220ms var(--ease-out), color 220ms var(--ease-out);
}
.sc-tab:last-child { border-right: 0; }
.sc-tab:hover { background: var(--surface); color: var(--ink-2); }
.sc-tab.active {
  background: var(--surface);
  border-bottom-color: var(--cyan);
  color: var(--ink);
}
.sc-tab-id { font-size: 10.5px; font-weight: 700; letter-spacing: 0.08em; color: var(--ink-2); }
.sc-tab.active .sc-tab-id { color: var(--ink); }
.sc-tab-kind { font-size: 9px; letter-spacing: 0.14em; color: var(--ink-4); }
.sc-tab-delta {
  align-self: flex-start;
  font-size: 11px; font-weight: 700; letter-spacing: 0.04em;
  margin-top: 4px;
  padding: 2px 6px; border-radius: 3px;
  background: var(--surface-2);
}
.sc-tab-delta.green { color: var(--green); }
.sc-tab-delta.cyan  { color: var(--cyan); }
.sc-tab-delta.yellow{ color: var(--yellow); }
.sc-tab-delta.red   { color: var(--red); }
.sc-body { padding: 0; }
.sc-panel { padding: 24px 28px; animation: scFade 380ms var(--ease) both; }
.sc-panel[hidden] { display: none !important; }
.sc-panel.sc-fade { animation: scFade 420ms var(--ease) both; }
@keyframes scFade {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.sc-hdr { margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid var(--line-soft); }
.sc-bars {
  background: var(--bg-2);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  padding: 16px 18px;
  margin-bottom: 16px;
}
.sc-bars-label { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; color: var(--ink-4); margin-bottom: 12px; }
.sc-bar-row {
  display: grid; grid-template-columns: 100px 1fr 100px; align-items: center; gap: 14px;
  padding: 8px 0;
}
.sc-bar-lab { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; color: var(--ink-3); }
.sc-bar { position: relative; height: 8px; background: var(--surface-2); border-radius: 4px; overflow: hidden; }
.sc-bar-fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 4px;
  background: var(--ink-4);
  transition: background 220ms var(--ease-out);
}
.sc-bar-fill.cyan { background: var(--cyan); box-shadow: 0 0 12px rgba(95,209,255,.22); }
.sc-bar-fill.green { background: var(--green); box-shadow: 0 0 12px rgba(102,226,155,.22); }
.sc-bar-fill.red { background: var(--red); box-shadow: 0 0 12px rgba(255,119,102,.22); }
.sc-bar-fill.yellow { background: var(--yellow); box-shadow: 0 0 12px rgba(255,212,73,.22); }
.sc-bar-fill.dim { background: var(--ink-4); }
.sc-bar-val { font-family: var(--mono); font-size: 13px; color: var(--ink); text-align: right; font-weight: 600; }
.sc-multi {
  margin: 8px 0 16px;
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  overflow: hidden;
}
.sc-multi-label { padding: 12px 16px; font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; color: var(--yellow); background: var(--yellow-soft); border-bottom: 1px solid rgba(255,212,73,0.22); }
.sc-multi-table { width: 100%; border-collapse: collapse; font-family: var(--sans); font-size: 13.5px; }
.sc-multi-table th { text-align: left; font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em; color: var(--ink-4); padding: 10px 16px; border-bottom: 1px solid var(--line-soft); font-weight: 700; }
.sc-multi-table td { padding: 12px 16px; border-bottom: 1px solid var(--line-soft); color: var(--ink-2); vertical-align: middle; }
.sc-multi-table tr:last-child td { border-bottom: 0; }
.sc-lesson {
  border-top: 1px solid var(--line-soft);
  padding: 16px 0 0;
  margin-top: 8px;
}
.sc-lesson-lab { font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.16em; color: var(--green); margin-bottom: 8px; }
.sc-lesson p { font-family: var(--serif); font-style: italic; font-size: 15px; color: var(--ink-2); line-height: 1.55; margin: 0 0 10px; }
.sc-source { font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); letter-spacing: 0.04em; }
.sc-foot { padding: 12px 22px; font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--ink-3); border-top: 1px solid var(--line-soft); }

/* Interactive accents */
.stack-layer.selected { background: var(--cyan-soft); box-shadow: inset 0 0 0 1px var(--cyan); }
.ft-card.flipped { background: var(--cyan-soft); border-color: var(--cyan); }
.win.packet .win-tabs .tab { cursor: pointer; transition: color 200ms var(--ease-out), border-color 200ms var(--ease-out); }
.win.packet .win-tabs .tab:hover { color: var(--ink-2); }

/* ============================================================== */
/* GLOBAL DIAGRAM ENTRY POLISH                                     */
/* ============================================================== */

/* On scroll-in: stagger reveal of children inside any .win */
.mn-diagram .win {
  opacity: 0; transform: translateY(20px);
  transition: opacity 720ms var(--ease), transform 720ms var(--ease);
  box-shadow: 0 1px 0 rgba(255,255,255,0.02), 0 20px 60px -40px rgba(0,0,0,0.6);
}
.mn-diagram.mn-in .win { opacity: 1; transform: translateY(0); }

/* Window chrome — subtle gradient sheen */
.win-bar {
  background: linear-gradient(180deg, rgba(255,255,255,0.02), transparent);
}

/* PACKET range bars: stagger fill width on scroll-in */
.packet .range-track .seg { transform-origin: left; transform: scaleX(0); transition: transform 720ms var(--ease); }
.mn-diagram.mn-in .packet .range-track .seg { transform: scaleX(1); }
.mn-diagram.mn-in .packet .range-row:nth-of-type(1) .seg { transition-delay: 360ms; }
.mn-diagram.mn-in .packet .range-row:nth-of-type(2) .seg { transition-delay: 440ms; }
.mn-diagram.mn-in .packet .range-row:nth-of-type(3) .seg { transition-delay: 520ms; }
.mn-diagram.mn-in .packet .range-row:nth-of-type(4) .seg { transition-delay: 600ms; }

/* PACKET range pills float in on scroll */
.packet .range-conf { opacity: 0; transform: translateX(6px); transition: all 420ms var(--ease); }
.mn-diagram.mn-in .packet .range-conf { opacity: 1; transform: translateX(0); }
.mn-diagram.mn-in .packet .range-row:nth-of-type(1) .range-conf { transition-delay: 760ms; }
.mn-diagram.mn-in .packet .range-row:nth-of-type(2) .range-conf { transition-delay: 840ms; }
.mn-diagram.mn-in .packet .range-row:nth-of-type(3) .range-conf { transition-delay: 920ms; }
.mn-diagram.mn-in .packet .range-row:nth-of-type(4) .range-conf { transition-delay: 1000ms; }

/* PACKET tabs: hover underline grow */
.win.packet .win-tabs .tab { position: relative; padding-bottom: 4px; }
.win.packet .win-tabs .tab:not(.active)::after {
  content: ""; position: absolute; left: 0; right: 100%; bottom: -1px;
  height: 1px; background: var(--cyan); transition: right 280ms var(--ease-out);
}
.win.packet .win-tabs .tab:not(.active):hover::after { right: 0; }

/* PACKET contents rail: indicator slides */
.packet .rail-item {
  position: relative;
  cursor: default;
}
.packet .rail-item .nn { transition: color 200ms; }
.packet .rail-item:hover { background: var(--surface); }

/* SCHEDULE: progress fill grows from 0 */
.win .progress-bar .fill { transform-origin: left; transform: scaleX(0); transition: transform 1100ms var(--ease) 400ms; }
.mn-diagram.mn-in .win .progress-bar .fill { transform: scaleX(1); }

/* SCHEDULE timeline track: gradient fill grows */
.schedule-track .line .progress { transform-origin: left; transform: scaleX(0); transition: transform 1200ms var(--ease) 600ms; }
.mn-diagram.mn-in .schedule-track .line .progress { transform: scaleX(1); }

/* SCHEDULE nodes pop in */
.schedule-track .nodes .node { opacity: 0; transform: scale(0.6); transition: all 380ms var(--ease); }
.mn-diagram.mn-in .schedule-track .nodes .node { opacity: 1; transform: scale(1); }
.mn-diagram.mn-in .schedule-track .nodes .node:nth-child(1) { transition-delay: 200ms; }
.mn-diagram.mn-in .schedule-track .nodes .node:nth-child(2) { transition-delay: 320ms; }
.mn-diagram.mn-in .schedule-track .nodes .node:nth-child(3) { transition-delay: 440ms; }
.mn-diagram.mn-in .schedule-track .nodes .node:nth-child(4) { transition-delay: 560ms; }
.mn-diagram.mn-in .schedule-track .nodes .node:nth-child(5) { transition-delay: 680ms; }
.mn-diagram.mn-in .schedule-track .nodes .node:nth-child(6) { transition-delay: 800ms; }

.schedule-track .nodes .node.active {
  animation: nodeActivePulse 2.4s ease-in-out infinite;
  animation-delay: 1200ms;
}
@keyframes nodeActivePulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(95,209,255,0.08), 0 0 12px rgba(95,209,255,0.18); }
  50%      { box-shadow: 0 0 0 6px rgba(95,209,255,0.18), 0 0 24px rgba(95,209,255,0.32); }
}

/* DESK zone metric numbers: count effect via gradient sweep */
.desk-zone .zm .zm-n { background: linear-gradient(90deg, var(--ink) 0%, var(--ink) 100%); -webkit-background-clip: text; }
.mn-diagram.mn-in .desk-zone .zm { animation: deskZmIn 540ms var(--ease) both; }
.mn-diagram.mn-in .desk-zone .zm:nth-child(1) { animation-delay: 200ms; }
.mn-diagram.mn-in .desk-zone .zm:nth-child(2) { animation-delay: 280ms; }
.mn-diagram.mn-in .desk-zone .zm:nth-child(3) { animation-delay: 360ms; }
.mn-diagram.mn-in .desk-zone .zm:nth-child(4) { animation-delay: 440ms; }
@keyframes deskZmIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

/* DESK cards entry */
.desk-card { opacity: 0; transform: translateY(6px); transition: all 420ms var(--ease); }
.mn-diagram.mn-in .desk-card { opacity: 1; transform: translateY(0); }
.mn-diagram.mn-in .desk-col-body:nth-child(1) .desk-card:nth-child(2) { transition-delay: 400ms; }
.mn-diagram.mn-in .desk-col-body:nth-child(1) .desk-card:nth-child(3) { transition-delay: 480ms; }
.mn-diagram.mn-in .desk-col-body:nth-child(2) .desk-card:nth-child(2) { transition-delay: 560ms; }
.mn-diagram.mn-in .desk-col-body:nth-child(2) .desk-card:nth-child(3) { transition-delay: 640ms; }
.mn-diagram.mn-in .desk-col-body:nth-child(3) .desk-card:nth-child(2) { transition-delay: 720ms; }

/* VENDOR scorecard bars: fill on scroll-in */
.vs-fill { transform-origin: left; transform: scaleX(0); transition: transform 800ms var(--ease); }
.mn-diagram.mn-in .vs-fill { transform: scaleX(1); }
.mn-diagram.mn-in .vs-table tr:nth-child(1) .vs-fill { transition-delay: 200ms; }
.mn-diagram.mn-in .vs-table tr:nth-child(2) .vs-fill { transition-delay: 280ms; }
.mn-diagram.mn-in .vs-table tr:nth-child(3) .vs-fill { transition-delay: 360ms; }
.mn-diagram.mn-in .vs-table tr:nth-child(4) .vs-fill { transition-delay: 440ms; }
.mn-diagram.mn-in .vs-table tr:nth-child(5) .vs-fill { transition-delay: 520ms; }
.mn-diagram.mn-in .vs-table tr:nth-child(6) .vs-fill { transition-delay: 600ms; }

/* STACK layers slide-in from right */
.stack-layer { opacity: 0; transform: translateX(20px); transition: all 540ms var(--ease); }
.mn-diagram.mn-in .stack-layer { opacity: 1; transform: translateX(0); }
.mn-diagram.mn-in .stack-layer:nth-child(1) { transition-delay: 80ms; }
.mn-diagram.mn-in .stack-layer:nth-child(2) { transition-delay: 160ms; }
.mn-diagram.mn-in .stack-layer:nth-child(3) { transition-delay: 240ms; }
.mn-diagram.mn-in .stack-layer:nth-child(4) { transition-delay: 320ms; }
.mn-diagram.mn-in .stack-layer:nth-child(5) { transition-delay: 400ms; }
.mn-diagram.mn-in .stack-layer:nth-child(6) { transition-delay: 480ms; }
.mn-diagram.mn-in .stack-layer:nth-child(7) { transition-delay: 560ms; }
.mn-diagram.mn-in .stack-layer:nth-child(8) { transition-delay: 640ms; }
.mn-diagram.mn-in .stack-layer:nth-child(9) { transition-delay: 720ms; }
.mn-diagram.mn-in .stack-layer:nth-child(10){ transition-delay: 800ms; }

/* BOARD AUDIT KPI numbers — fade-in with stagger */
.ba-kpi { opacity: 0; transform: translateY(8px); transition: all 540ms var(--ease); }
.mn-diagram.mn-in .ba-kpi { opacity: 1; transform: translateY(0); }
.mn-diagram.mn-in .ba-kpi:nth-child(1) { transition-delay: 200ms; }
.mn-diagram.mn-in .ba-kpi:nth-child(2) { transition-delay: 280ms; }
.mn-diagram.mn-in .ba-kpi:nth-child(3) { transition-delay: 360ms; }
.mn-diagram.mn-in .ba-kpi:nth-child(4) { transition-delay: 440ms; }
.mn-diagram.mn-in .ba-kpi:nth-child(5) { transition-delay: 520ms; }
.mn-diagram.mn-in .ba-kpi:nth-child(6) { transition-delay: 600ms; }

/* SIX QUESTIONS rows entry */
.sq-row { opacity: 0; transform: translateX(-8px); transition: all 440ms var(--ease); }
.mn-diagram.mn-in .sq-row { opacity: 1; transform: translateX(0); }
.mn-diagram.mn-in .sq-row:nth-child(1) { transition-delay: 200ms; }
.mn-diagram.mn-in .sq-row:nth-child(2) { transition-delay: 280ms; }
.mn-diagram.mn-in .sq-row:nth-child(3) { transition-delay: 360ms; }
.mn-diagram.mn-in .sq-row:nth-child(4) { transition-delay: 440ms; }
.mn-diagram.mn-in .sq-row:nth-child(5) { transition-delay: 520ms; }
.mn-diagram.mn-in .sq-row:nth-child(6) { transition-delay: 600ms; }
.sq-row:hover .sq-q { color: var(--cyan); }
.sq-row:hover { background: var(--bg-2); cursor: default; }
.sq-row { padding-left: 8px; padding-right: 8px; border-radius: 4px; transition: background 200ms var(--ease-out); }

/* EVIDENCE FRONTIER bar segment grow */
.ef-seg { transform-origin: left; transform: scaleX(0); transition: transform 720ms var(--ease); }
.mn-diagram.mn-in .ef-seg { transform: scaleX(1); }
.mn-diagram.mn-in .ef-seg:nth-child(1) { transition-delay: 240ms; }
.mn-diagram.mn-in .ef-seg:nth-child(2) { transition-delay: 380ms; }
.mn-diagram.mn-in .ef-seg:nth-child(3) { transition-delay: 520ms; }

/* APPROVAL routing nodes */
.ap-node { opacity: 0; transform: translateX(-10px); transition: all 460ms var(--ease); }
.mn-diagram.mn-in .ap-node { opacity: 1; transform: translateX(0); }
.mn-diagram.mn-in .ap-node:nth-of-type(1) { transition-delay: 200ms; }
.mn-diagram.mn-in .ap-node:nth-of-type(2) { transition-delay: 360ms; }
.mn-diagram.mn-in .ap-branch .ap-node:nth-child(1) { transition-delay: 520ms; }
.mn-diagram.mn-in .ap-branch .ap-node:nth-child(2) { transition-delay: 620ms; }
.mn-diagram.mn-in .ap-node:nth-of-type(4) { transition-delay: 740ms; }
.mn-diagram.mn-in .ap-node:nth-of-type(5) { transition-delay: 860ms; }
.ap-line { transform: scaleY(0); transform-origin: top; transition: transform 320ms var(--ease); }
.mn-diagram.mn-in .ap-line { transform: scaleY(1); }
.mn-diagram.mn-in .ap-line:nth-of-type(1) { transition-delay: 280ms; }
.mn-diagram.mn-in .ap-line:nth-of-type(2) { transition-delay: 440ms; }
.mn-diagram.mn-in .ap-line:nth-of-type(3) { transition-delay: 680ms; }
.mn-diagram.mn-in .ap-line:nth-of-type(4) { transition-delay: 800ms; }
.ap-node.active { animation: apActive 2.4s ease-in-out infinite; animation-delay: 1100ms; }
@keyframes apActive {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,212,73,0); }
  50%      { box-shadow: 0 0 0 4px rgba(255,212,73,0.12); }
}

/* RUN-CARD style hover (used in Library & Desk) */
.lib-card .lc-title, .desk-card .dc-title { transition: color 200ms var(--ease-out); }
.lib-card:hover .lc-title { color: var(--cyan); }
.desk-card:hover .dc-title { color: var(--cyan); }

/* WHATSAPP bubbles fly in */
.bubble { opacity: 0; transform: translateY(6px); transition: all 380ms var(--ease); }
.mn-diagram.mn-in .bubble { opacity: 1; transform: translateY(0); }
.mn-diagram.mn-in .wa-body .bubble:nth-of-type(1) { transition-delay: 200ms; }
.mn-diagram.mn-in .wa-body .bubble:nth-of-type(2) { transition-delay: 380ms; }
.mn-diagram.mn-in .wa-body .bubble:nth-of-type(3) { transition-delay: 560ms; }
.mn-diagram.mn-in .wa-body .bubble:nth-of-type(4) { transition-delay: 720ms; }
.mn-diagram.mn-in .wa-body .bubble:nth-of-type(5) { transition-delay: 880ms; }

/* SLACK messages */
.msg { opacity: 0; transform: translateY(8px); transition: all 420ms var(--ease); }
.mn-diagram.mn-in .msg { opacity: 1; transform: translateY(0); }
.mn-diagram.mn-in .msg:nth-of-type(1) { transition-delay: 240ms; }
.mn-diagram.mn-in .msg:nth-of-type(2) { transition-delay: 480ms; }
.mn-diagram.mn-in .msg:nth-of-type(3) { transition-delay: 720ms; }

/* FIRST-10 cards stagger */
.ft-card { opacity: 0; transform: translateY(8px) scale(0.96); transition: all 440ms var(--ease); }
.mn-diagram.mn-in .ft-card { opacity: 1; transform: translateY(0) scale(1); }
.mn-diagram.mn-in .ft-grid > .ft-card:nth-child(1) { transition-delay: 80ms; }
.mn-diagram.mn-in .ft-grid > .ft-card:nth-child(2) { transition-delay: 140ms; }
.mn-diagram.mn-in .ft-grid > .ft-card:nth-child(3) { transition-delay: 200ms; }
.mn-diagram.mn-in .ft-grid > .ft-card:nth-child(4) { transition-delay: 260ms; }
.mn-diagram.mn-in .ft-grid > .ft-card:nth-child(5) { transition-delay: 320ms; }
.mn-diagram.mn-in .ft-grid > .ft-card:nth-child(6) { transition-delay: 380ms; }
.mn-diagram.mn-in .ft-grid > .ft-card:nth-child(7) { transition-delay: 440ms; }
.mn-diagram.mn-in .ft-grid > .ft-card:nth-child(8) { transition-delay: 500ms; }
.mn-diagram.mn-in .ft-grid > .ft-card:nth-child(9) { transition-delay: 560ms; }
.mn-diagram.mn-in .ft-grid > .ft-card:nth-child(10){ transition-delay: 620ms; }

/* FORECAST CONTRACT JSON: line-by-line type-in */
.fc-json {
  position: relative;
}
.fc-json::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent 0%, var(--bg) 100%);
  transform: translateX(-100%);
  transition: transform 1400ms var(--ease) 200ms;
  pointer-events: none;
}
.mn-diagram.mn-in .fc-json::after { transform: translateX(0); }

/* SCORECARD tab indicator */
.sc-tabs { position: relative; }
.sc-tab .sc-tab-delta { transition: transform 220ms var(--ease-out); }
.sc-tab:hover .sc-tab-delta { transform: translateY(-1px) scale(1.04); }

/* Subtle background grid on the win-bar for product feel */
.win-bar::before {
  content: ""; position: absolute;
  inset: 0; opacity: 0.6;
  background-image: linear-gradient(90deg, transparent 49.5%, rgba(255,255,255,0.025) 50%, transparent 50.5%);
  background-size: 16px 100%;
  pointer-events: none;
}
.win-bar { position: relative; }

/* ============================================================== */
/* FACTORY v2 — stage cards instead of tiny SVG dots               */
/* ============================================================== */
.factory-body {
  grid-template-columns: 280px 1fr 280px !important;
}
@media (max-width: 1100px) {
  .factory-body { grid-template-columns: 1fr !important; }
}

.factory-pipeline {
  position: relative;
  padding: 22px 22px 24px;
  border-right: 1px solid var(--line-soft);
  background:
    radial-gradient(900px circle at 0% 30%, rgba(95,209,255,0.05), transparent 60%),
    radial-gradient(700px circle at 100% 70%, rgba(102,226,155,0.04), transparent 60%);
}
.fpipe-head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 18px;
}
.fpipe-meta {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.12em; color: var(--cyan);
}
.fstage-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
@media (max-width: 720px) { .fstage-grid { grid-template-columns: repeat(2, 1fr); } }
.fstage {
  position: relative;
  padding: 14px 14px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface);
  display: flex; flex-direction: column; gap: 6px;
  min-height: 110px;
  transition: transform 280ms var(--ease-out), border-color 280ms var(--ease-out), background 280ms var(--ease-out), box-shadow 280ms var(--ease-out);
  cursor: default;
  overflow: hidden;
}
.fstage::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0;
  width: 3px; background: var(--ink-4);
  transition: background 220ms var(--ease-out);
}
.fstage:hover {
  transform: translateY(-2px);
  background: var(--surface-2);
}
.fstage.done {
  border-color: rgba(102,226,155,0.30);
  background: linear-gradient(135deg, rgba(102,226,155,0.05), transparent 60%);
}
.fstage.done::before { background: var(--green); box-shadow: 0 0 12px rgba(102,226,155,0.4); }
.fstage.done:hover { border-color: rgba(102,226,155,0.55); }
.fstage.active {
  border-color: rgba(95,209,255,0.55);
  background:
    linear-gradient(135deg, rgba(95,209,255,0.10), transparent 70%),
    var(--surface);
  box-shadow: 0 0 0 1px rgba(95,209,255,0.25), 0 8px 28px -14px rgba(95,209,255,0.45);
}
.fstage.active::before { background: var(--cyan); box-shadow: 0 0 14px rgba(95,209,255,0.6); animation: fstageBarPulse 2s ease-in-out infinite; }
@keyframes fstageBarPulse {
  0%, 100% { box-shadow: 0 0 14px rgba(95,209,255,0.4); }
  50%      { box-shadow: 0 0 22px rgba(95,209,255,0.85); }
}
.fstage.queue { opacity: 0.7; }
.fstage.queue::before { background: rgba(140,137,126,0.45); }
.fstage-row {
  display: flex; align-items: center; gap: 10px;
}
.fstage-num {
  font-family: var(--mono); font-size: 10px; font-weight: 700;
  letter-spacing: 0.14em; color: var(--ink-3);
  padding: 2px 6px; border-radius: 3px;
  background: var(--bg-2); border: 1px solid var(--line-soft);
}
.fstage.done .fstage-num { color: var(--green); border-color: rgba(102,226,155,0.32); background: var(--green-soft); }
.fstage.active .fstage-num { color: var(--cyan); border-color: rgba(95,209,255,0.32); background: var(--cyan-soft); }
.fstage-icon {
  font-family: var(--mono); font-size: 18px;
  color: var(--ink-3);
  margin-left: auto;
  margin-right: 4px;
  line-height: 1;
}
.fstage.done .fstage-icon { color: var(--green); }
.fstage.active .fstage-icon { color: var(--cyan); animation: iconSpin 6s linear infinite; transform-origin: center; display: inline-block; }
@keyframes iconSpin { to { transform: rotate(360deg); } }
.fstage-status .fst-dot {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: 50%;
  font-size: 10px; font-weight: 700;
}
.fst-dot.done { color: var(--green); border: 1px solid rgba(102,226,155,0.42); background: var(--green-soft); }
.fst-dot.active { color: var(--cyan); border: 1px solid var(--cyan); background: var(--cyan-soft); box-shadow: 0 0 0 4px rgba(95,209,255,0.10); animation: ringPulse2 2s ease-in-out infinite; }
@keyframes ringPulse2 {
  0%, 100% { box-shadow: 0 0 0 4px rgba(95,209,255,0.08); }
  50%      { box-shadow: 0 0 0 8px rgba(95,209,255,0.18); }
}
.fst-dot.queue { color: var(--ink-4); border: 1px solid var(--line); background: var(--surface-2); }
.fstage-name {
  font-family: var(--serif); font-size: 14.5px; font-weight: 500;
  color: var(--ink); letter-spacing: -0.012em; line-height: 1.25;
  margin-top: 4px;
}
.fstage-dur {
  font-family: var(--mono); font-size: 10.5px;
  color: var(--ink-4); letter-spacing: 0.06em;
}
.fstage.active .fstage-dur { color: var(--cyan); }
.fstage-progress {
  position: absolute; left: 14px; right: 14px; bottom: 8px;
  height: 2px; background: var(--surface-2); border-radius: 1px; overflow: hidden;
}
.fstage-progress-fill {
  height: 100%;
  background: var(--ink-4);
  width: 0;
  transition: width 1100ms var(--ease) 600ms;
}
.fstage.done .fstage-progress-fill { background: var(--green); }
.fstage.active .fstage-progress-fill { background: var(--cyan); animation: activeFillSlide 2.4s ease-in-out infinite alternate; }
@keyframes activeFillSlide {
  from { width: 30%; }
  to   { width: 70%; }
}
.mn-diagram.mn-in .fstage.done .fstage-progress-fill { width: 100%; }
.mn-diagram.mn-in .fstage.queue .fstage-progress-fill { width: 0; }

/* Stage entry animation */
.fstage { opacity: 0; transform: translateY(10px); transition: all 480ms var(--ease), border-color 280ms var(--ease-out), background 280ms var(--ease-out); }
.mn-diagram.mn-in .fstage { opacity: 1; transform: translateY(0); }
.mn-diagram.mn-in .fstage:nth-child(1) { transition-delay: 220ms; }
.mn-diagram.mn-in .fstage:nth-child(2) { transition-delay: 320ms; }
.mn-diagram.mn-in .fstage:nth-child(3) { transition-delay: 420ms; }
.mn-diagram.mn-in .fstage:nth-child(4) { transition-delay: 520ms; }
.mn-diagram.mn-in .fstage:nth-child(5) { transition-delay: 620ms; }
.mn-diagram.mn-in .fstage:nth-child(6) { transition-delay: 720ms; }
.mn-diagram.mn-in .fstage:nth-child(7) { transition-delay: 820ms; }

.fpipe-overlay {
  position: absolute; inset: 60px 22px 24px;
  pointer-events: none; opacity: 0.4;
}

/* Right column: output card */
.factory-output {
  padding: 22px 18px 18px;
  background: var(--bg-2);
  border-left: 1px solid var(--line-soft);
}
.factory-output-card {
  border: 1px solid rgba(95,209,255,0.32);
  background:
    linear-gradient(180deg, rgba(95,209,255,0.06), transparent 60%),
    var(--surface);
  border-radius: 10px;
  padding: 14px 14px 12px;
  box-shadow: 0 8px 32px -16px rgba(95,209,255,0.30);
  opacity: 0;
  transform: translateX(10px);
  transition: all 600ms var(--ease) 900ms;
}
.mn-diagram.mn-in .factory-output-card { opacity: 1; transform: translateX(0); }
.foc-label {
  font-family: var(--mono); font-size: 9.5px;
  font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--cyan); margin-bottom: 8px;
}
.foc-title { font-family: var(--serif); font-size: 22px; font-weight: 500; color: var(--ink); letter-spacing: -0.02em; line-height: 1; }
.foc-sub { font-family: var(--mono); font-size: 10.5px; color: var(--ink-4); letter-spacing: 0.04em; margin: 4px 0 14px; }
.foc-sections {
  border-top: 1px solid var(--line-soft);
  padding-top: 10px;
  display: flex; flex-direction: column; gap: 2px;
}
.foc-sec {
  display: grid; grid-template-columns: 26px 1fr 14px;
  align-items: center; gap: 6px;
  font-family: var(--mono); font-size: 10.5px;
  padding: 3px 0;
  color: var(--ink-3);
}
.foc-sec-n { color: var(--ink-4); letter-spacing: 0.04em; }
.foc-sec-name { color: var(--ink-2); }
.foc-sec-state { font-size: 11px; text-align: right; }
.foc-sec.done .foc-sec-state { color: var(--green); }
.foc-sec.pending { opacity: 0.5; }
.foc-sec.pending .foc-sec-state { color: var(--ink-4); }
.foc-foot {
  margin-top: 12px; padding-top: 10px;
  border-top: 1px solid var(--line-soft);
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 6px;
}
.foc-eta { font-family: var(--mono); font-size: 10px; color: var(--ink-4); letter-spacing: 0.10em; text-transform: uppercase; }

/* Hide the old SVG-only factory canvas (no longer used) */
.factory-canvas { display: none; }

/* ============================================================== */
/* CALIBRATION VERDICT — all 5 cases on one chart                  */
/* ============================================================== */
.cv-head { padding: 20px 24px; border-bottom: 1px solid var(--line-soft); }
.cv-body { font-family: var(--serif); font-style: italic; font-size: 14.5px; color: var(--ink-3); line-height: 1.55; max-width: 70ch; margin: 8px 0 0; }
.cv-axis {
  display: flex; justify-content: space-between; align-items: center;
  padding: 18px 24px 12px;
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink-4);
}
.cv-axis-c { color: var(--cyan); font-weight: 700; }
.cv-chart { padding: 4px 24px 16px; position: relative; }
.cv-center-line {
  position: absolute; top: 0; bottom: 0;
  left: 50%; width: 1px;
  background: linear-gradient(to bottom, transparent 0%, rgba(95,209,255,0.42) 12%, rgba(95,209,255,0.42) 88%, transparent 100%);
  pointer-events: none;
}
.cv-row {
  display: grid;
  grid-template-columns: 130px 220px 1fr 80px 130px;
  align-items: center; gap: 14px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line-soft);
  position: relative;
  cursor: default;
  transition: background 220ms var(--ease-out);
}
.cv-row:last-child { border-bottom: 0; }
.cv-row:hover { background: var(--bg-2); }
.cv-row-meta { display: flex; flex-direction: column; gap: 2px; }
.cv-row-id { font-family: var(--mono); font-size: 11px; color: var(--ink-2); letter-spacing: 0.06em; font-weight: 600; }
.cv-row-kind { font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.14em; color: var(--ink-4); text-transform: uppercase; }
.cv-row-name { font-family: var(--serif); font-size: 15px; color: var(--ink); letter-spacing: -0.01em; }
.cv-track { position: relative; height: 36px; }
.cv-tick-center {
  position: absolute; left: 50%; top: 6px; bottom: 6px; width: 1px;
  background: rgba(255,255,255,0.10);
}
.cv-bar {
  position: absolute; top: 14px; height: 8px; border-radius: 4px;
  background: var(--ink-4);
  transform-origin: left;
  transform: scaleX(0);
  transition: transform 900ms var(--ease) 200ms;
}
.cv-bar.green { background: var(--green); box-shadow: 0 0 14px rgba(102,226,155,0.40); }
.cv-bar.red   { background: var(--red);   box-shadow: 0 0 14px rgba(255,119,102,0.40); }
.cv-bar.cyan  { background: var(--cyan);  box-shadow: 0 0 14px rgba(95,209,255,0.40); }
.mn-diagram.mn-in .cv-bar { transform: scaleX(1); }
.cv-dot {
  position: absolute; top: 50%; transform: translate(-50%, -50%);
  width: 16px; height: 16px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
}
.cv-dot span {
  position: absolute; bottom: 18px;
  font-family: var(--mono); font-size: 9px;
  letter-spacing: 0.10em; text-transform: uppercase;
  color: var(--ink-4); white-space: nowrap;
  opacity: 0; transition: opacity 200ms var(--ease-out);
}
.cv-row:hover .cv-dot span { opacity: 1; }
.cv-dot.baseline { width: 10px; height: 10px; background: var(--ink-3); border: 1px solid var(--ink-2); }
.cv-dot.forecast { width: 14px; height: 14px; background: var(--cyan); border: 2px solid var(--bg); box-shadow: 0 0 12px rgba(95,209,255,0.65); z-index: 3; }
.cv-dot.actual {
  width: 16px; height: 16px;
  border: 2px solid var(--bg);
  z-index: 4;
  animation: cvDotPulse 2.4s ease-in-out infinite;
}
.cv-dot.actual.green { background: var(--green); box-shadow: 0 0 14px rgba(102,226,155,0.55); }
.cv-dot.actual.red   { background: var(--red);   box-shadow: 0 0 14px rgba(255,119,102,0.55); }
.cv-dot.actual.cyan  { background: var(--cyan);  box-shadow: 0 0 14px rgba(95,209,255,0.55); }
@keyframes cvDotPulse {
  0%, 100% { transform: translate(-50%, -50%) scale(1); }
  50%      { transform: translate(-50%, -50%) scale(1.15); }
}
.cv-row-delta {
  font-family: var(--mono); font-size: 16px; font-weight: 700;
  letter-spacing: 0.02em; text-align: right;
}
.cv-row-delta.green { color: var(--green); }
.cv-row-delta.red   { color: var(--red); }
.cv-row-delta.cyan  { color: var(--cyan); }
.cv-row-world {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.10em; text-transform: uppercase;
  color: var(--ink-4); text-align: right;
}
.cv-summary {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 1px; background: var(--line-soft); padding: 1px;
  margin: 8px 0 0;
}
.cv-sum-item {
  padding: 18px 22px;
  background: var(--surface);
  display: flex; flex-direction: column; gap: 6px;
}
.cv-sum-n {
  font-family: var(--serif); font-size: 34px; font-weight: 500;
  line-height: 1; letter-spacing: -0.02em;
  color: var(--ink);
}
.cv-sum-n.green { color: var(--green); }
.cv-sum-n.cyan  { color: var(--cyan); }
.cv-sum-n.red   { color: var(--red); }
.cv-sum-l {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.10em; color: var(--ink-3);
  text-transform: uppercase;
}
.cv-foot {
  padding: 14px 24px;
  font-family: var(--serif); font-style: italic;
  font-size: 13.5px; color: var(--ink-3);
  border-top: 1px solid var(--line-soft);
}

/* Row entry stagger */
.cv-row { opacity: 0; transform: translateY(8px); transition: opacity 420ms var(--ease), transform 420ms var(--ease), background 220ms var(--ease-out); }
.mn-diagram.mn-in .cv-row { opacity: 1; transform: translateY(0); }
.mn-diagram.mn-in .cv-row:nth-child(2) { transition-delay: 200ms; }
.mn-diagram.mn-in .cv-row:nth-child(3) { transition-delay: 320ms; }
.mn-diagram.mn-in .cv-row:nth-child(4) { transition-delay: 440ms; }
.mn-diagram.mn-in .cv-row:nth-child(5) { transition-delay: 560ms; }
.mn-diagram.mn-in .cv-row:nth-child(6) { transition-delay: 680ms; }
.mn-diagram.mn-in .cv-bar { transition-delay: 700ms; }
.mn-diagram.mn-in .cv-row:nth-child(3) .cv-bar { transition-delay: 820ms; }
.mn-diagram.mn-in .cv-row:nth-child(4) .cv-bar { transition-delay: 940ms; }
.mn-diagram.mn-in .cv-row:nth-child(5) .cv-bar { transition-delay: 1060ms; }
.mn-diagram.mn-in .cv-row:nth-child(6) .cv-bar { transition-delay: 1180ms; }

/* ============================================================== */
/* DISTRIBUTION (forecast pdf vs actual)                           */
/* ============================================================== */
.dist-head { padding: 20px 24px; border-bottom: 1px solid var(--line-soft); }
.dist-canvas { padding: 22px 18px 12px; }
.dist-svg { width: 100%; height: auto; max-height: 380px; }
.dist-curve {
  stroke-dasharray: 3000; stroke-dashoffset: 3000;
}
.mn-diagram.mn-in .dist-curve { animation: distDraw 1800ms var(--ease) 200ms forwards; }
@keyframes distDraw { to { stroke-dashoffset: 0; } }
.dist-fill { opacity: 0; }
.mn-diagram.mn-in .dist-fill { animation: distFade 800ms var(--ease) 1600ms forwards; }
@keyframes distFade { to { opacity: 1; } }
.dist-marker { opacity: 0; }
.mn-diagram.mn-in .dist-marker.baseline { animation: distFade 600ms var(--ease) 2000ms forwards; }
.mn-diagram.mn-in .dist-marker.forecast { animation: distFade 600ms var(--ease) 2200ms forwards; }
.mn-diagram.mn-in .dist-marker.actual { animation: distFadeActual 800ms var(--ease) 2400ms forwards; }
@keyframes distFadeActual {
  0%   { opacity: 0; transform: translate(0, 10px); }
  100% { opacity: 1; transform: translate(0, 0); }
}
.dist-foot {
  padding: 14px 22px;
  border-top: 1px solid var(--line-soft);
  background: var(--bg-2);
  display: flex; flex-direction: column; gap: 8px;
}
.dist-foot-row {
  display: flex; align-items: baseline; gap: 16px;
  font-family: var(--sans); font-size: 14px; color: var(--ink-2);
}
.dist-key {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.14em; text-transform: uppercase;
  padding: 3px 9px; border-radius: 3px;
  flex: 0 0 auto;
}
.dist-key.cyan  { color: var(--cyan);  background: var(--cyan-soft);  border: 1px solid rgba(95,209,255,0.32); }
.dist-key.red   { color: var(--red);   background: rgba(255,119,102,0.10); border: 1px solid rgba(255,119,102,0.32); }
.dist-key.green { color: var(--green); background: var(--green-soft); border: 1px solid rgba(102,226,155,0.32); }
.dist-key-val { color: var(--ink-2); flex: 1; }

/* ============================================================== */
/* TEAM MOVES — 6 move-type cards with mini-viz                    */
/* ============================================================== */
.tm-head { padding: 20px 22px; border-bottom: 1px solid var(--line-soft); }
.tm-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--line-soft);
  padding: 1px;
}
@media (max-width: 900px) { .tm-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .tm-grid { grid-template-columns: 1fr; } }
.tm-card {
  padding: 18px 18px 16px;
  background: var(--surface);
  display: flex; flex-direction: column; gap: 10px;
  position: relative;
  cursor: default;
  transition: background 240ms var(--ease-out);
  overflow: hidden;
}
.tm-card:hover { background: var(--surface-2); }
.tm-card::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: var(--ink-4);
  transition: background 220ms var(--ease-out);
}
.tm-card.cyan::before   { background: var(--cyan);   box-shadow: 0 0 12px rgba(95,209,255,0.4); }
.tm-card.green::before  { background: var(--green);  box-shadow: 0 0 12px rgba(102,226,155,0.4); }
.tm-card.yellow::before { background: var(--yellow); box-shadow: 0 0 12px rgba(255,212,73,0.4); }
.tm-card.red::before    { background: var(--red);    box-shadow: 0 0 12px rgba(255,119,102,0.4); }
.tm-card.purple::before { background: var(--purple); box-shadow: 0 0 12px rgba(185,164,255,0.4); }
.tm-head-row { display: flex; justify-content: space-between; align-items: center; }
.tm-kind {
  font-family: var(--mono); font-size: 9.5px; font-weight: 700;
  letter-spacing: 0.16em; text-transform: uppercase;
  padding: 3px 8px; border-radius: 3px;
}
.tm-kind.cyan   { color: var(--cyan);   background: var(--cyan-soft);   border: 1px solid rgba(95,209,255,0.30); }
.tm-kind.green  { color: var(--green);  background: var(--green-soft);  border: 1px solid rgba(102,226,155,0.30); }
.tm-kind.yellow { color: var(--yellow); background: var(--yellow-soft); border: 1px solid rgba(255,212,73,0.30); }
.tm-kind.red    { color: var(--red);    background: rgba(255,119,102,0.10); border: 1px solid rgba(255,119,102,0.30); }
.tm-kind.purple { color: var(--purple); background: var(--purple-soft); border: 1px solid rgba(185,164,255,0.30); }
.tm-num {
  font-family: var(--mono); font-size: 11px;
  color: var(--ink-4); letter-spacing: 0.10em;
}
.tm-name {
  font-family: var(--serif); font-size: 19px; font-weight: 500;
  color: var(--ink); letter-spacing: -0.014em; line-height: 1.2;
}
.tm-viz {
  margin: 4px 0;
  padding: 8px;
  border: 1px solid var(--line-soft);
  border-radius: 6px;
  background: var(--bg);
  min-height: 130px;
  display: flex; align-items: center; justify-content: center;
}
.tm-viz-svg { width: 100%; height: auto; max-height: 130px; }
.tm-meta { display: flex; flex-direction: column; gap: 6px; margin-top: 4px; }
.tm-meta-row {
  display: flex; align-items: baseline; gap: 8px;
  font-family: var(--mono); font-size: 10.5px;
  line-height: 1.45;
}
.tm-meta-k {
  font-size: 9px; letter-spacing: 0.14em;
  color: var(--ink-4); text-transform: uppercase;
  flex: 0 0 80px;
}
.tm-meta-v { color: var(--ink-2); flex: 1; }
.tm-foot {
  padding: 14px 22px;
  font-family: var(--serif); font-style: italic;
  font-size: 13.5px; color: var(--ink-3);
  border-top: 1px solid var(--line-soft);
  background: var(--bg-2);
}

/* Entry transitions */
.tm-card { opacity: 0; transform: translateY(10px); transition: all 480ms var(--ease), background 240ms var(--ease-out); }
.mn-diagram.mn-in .tm-card { opacity: 1; transform: translateY(0); }
.mn-diagram.mn-in .tm-card:nth-child(1) { transition-delay: 200ms; }
.mn-diagram.mn-in .tm-card:nth-child(2) { transition-delay: 300ms; }
.mn-diagram.mn-in .tm-card:nth-child(3) { transition-delay: 400ms; }
.mn-diagram.mn-in .tm-card:nth-child(4) { transition-delay: 500ms; }
.mn-diagram.mn-in .tm-card:nth-child(5) { transition-delay: 600ms; }
.mn-diagram.mn-in .tm-card:nth-child(6) { transition-delay: 700ms; }

/* ============================================================== */
/* SIT-ABOVE — control tower over decision tools                   */
/* ============================================================== */
.sa-head { padding: 20px 22px; border-bottom: 1px solid var(--line-soft); }
.sa-stack { padding: 22px; display: flex; flex-direction: column; align-items: stretch; gap: 0; }

.sa-tier { position: relative; }
.sa-tower {
  padding: 22px 26px;
  border: 1px solid rgba(95,209,255,0.45);
  border-radius: 12px;
  background:
    radial-gradient(800px circle at 0% 50%, rgba(95,209,255,0.18), transparent 60%),
    radial-gradient(600px circle at 100% 50%, rgba(102,226,155,0.10), transparent 60%),
    var(--surface);
  box-shadow: 0 0 0 1px rgba(95,209,255,0.20), 0 16px 48px -24px rgba(95,209,255,0.55);
}
.sa-tower-glow {
  position: absolute; inset: -1px; border-radius: 12px;
  background: linear-gradient(90deg, transparent, rgba(95,209,255,0.18), transparent);
  background-size: 200% 100%;
  animation: saTowerSheen 6s ease-in-out infinite;
  pointer-events: none; opacity: 0.6;
}
@keyframes saTowerSheen {
  0%   { background-position: -100% 0; }
  100% { background-position: 200% 0; }
}
.sa-tower-row {
  position: relative; z-index: 1;
  display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; gap: 12px;
}
.sa-tower-brand { display: flex; align-items: center; gap: 14px; }
.sa-tower-mark {
  width: 28px; height: 28px; border-radius: 6px;
  background: var(--cyan);
  box-shadow: 0 0 18px rgba(95,209,255,0.6);
}
.sa-tower-name { font-family: var(--serif); font-size: 22px; font-weight: 500; color: var(--ink); letter-spacing: -0.02em; }
.sa-tower-sub { font-family: var(--mono); font-size: 10.5px; color: var(--ink-3); letter-spacing: 0.10em; margin-top: 2px; }
.sa-tower-actions { display: flex; gap: 6px; flex-wrap: wrap; }

.sa-flow {
  height: 60px; position: relative;
  display: flex; justify-content: space-between; align-items: center;
  padding: 0 22px;
}
.sa-flow-up, .sa-flow-down {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.16em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 3px;
}
.sa-flow-up   { color: var(--cyan);  background: var(--cyan-soft);  border: 1px solid rgba(95,209,255,0.32); }
.sa-flow-down { color: var(--green); background: var(--green-soft); border: 1px solid rgba(102,226,155,0.32); }
.sa-flow::before {
  content: ""; position: absolute;
  left: 50%; top: 0; bottom: 0; width: 1px;
  background: linear-gradient(180deg, rgba(95,209,255,0.55), rgba(102,226,155,0.55));
}
.sa-flow::after {
  content: ""; position: absolute;
  left: 50%; transform: translateX(-50%);
  top: 8px; height: 6px; width: 6px; border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 10px var(--cyan);
  animation: saPulseUp 2.4s ease-in-out infinite;
}
@keyframes saPulseUp {
  0%   { top: 50px; opacity: 0; }
  20%  { opacity: 1; }
  80%  { opacity: 1; }
  100% { top: 4px;  opacity: 0; }
}

.sa-tools {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}
@media (max-width: 900px) { .sa-tools { grid-template-columns: repeat(2, 1fr); } }
.sa-tool {
  padding: 12px 14px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
  transition: all 240ms var(--ease-out);
  cursor: default;
  position: relative;
}
.sa-tool::before {
  content: ""; position: absolute;
  top: -8px; left: 50%; transform: translateX(-50%);
  width: 1px; height: 8px; background: rgba(95,209,255,0.32);
}
.sa-tool:hover { transform: translateY(-2px); }
.sa-tool.cyan:hover   { border-color: rgba(95,209,255,0.55); }
.sa-tool.green:hover  { border-color: rgba(102,226,155,0.55); }
.sa-tool.yellow:hover { border-color: rgba(255,212,73,0.55); }
.sa-tool.purple:hover { border-color: rgba(185,164,255,0.55); }
.sa-tool-head { display: flex; justify-content: space-between; align-items: baseline; }
.sa-tool-name { font-family: var(--sans); font-size: 13.5px; color: var(--ink); font-weight: 600; }
.sa-tool-win {
  font-family: var(--mono); font-size: 12px; font-weight: 700;
  letter-spacing: 0.02em;
}
.sa-tool-win.cyan   { color: var(--cyan); }
.sa-tool-win.green  { color: var(--green); }
.sa-tool-win.yellow { color: var(--yellow); }
.sa-tool-win.purple { color: var(--purple); }
.sa-tool-domain {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.10em; text-transform: uppercase;
  color: var(--ink-4); margin: 2px 0 8px;
}
.sa-tool-bar {
  height: 4px; background: var(--surface-2); border-radius: 2px;
  overflow: hidden; margin-bottom: 8px;
}
.sa-tool-bar-fill {
  height: 100%; border-radius: 2px;
  background: var(--ink-4);
  transform-origin: left;
  transform: scaleX(0);
  transition: transform 800ms var(--ease) 600ms;
}
.sa-tool-bar-fill.cyan   { background: var(--cyan); }
.sa-tool-bar-fill.green  { background: var(--green); }
.sa-tool-bar-fill.yellow { background: var(--yellow); }
.sa-tool-bar-fill.purple { background: var(--purple); }
.mn-diagram.mn-in .sa-tool-bar-fill { transform: scaleX(1); }
.sa-tool-foot {
  display: flex; justify-content: space-between; align-items: center;
}
.sa-tool-tag {
  font-family: var(--mono); font-size: 9px;
  letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--ink-4);
}
.sa-tool-arrow { color: var(--cyan); font-size: 13px; font-weight: 700; }
.sa-foot {
  padding: 14px 22px;
  font-family: var(--serif); font-style: italic;
  font-size: 13.5px; color: var(--ink-3);
  border-top: 1px solid var(--line-soft);
  background: var(--bg-2);
}
/* Enterprise differentiator block — replaces the small italic footer
   with a dramatic two-part claim that anchors the diagram. */
.sa-claim {
  position: relative;
  padding: 36px 32px 32px;
  border-top: 1px solid var(--line-soft);
  background:
    radial-gradient(120% 180% at 10% 0%, rgba(95,209,255,0.06), transparent 55%),
    radial-gradient(120% 180% at 90% 100%, rgba(102,226,155,0.05), transparent 55%),
    var(--bg-2);
  overflow: hidden;
}
.sa-claim::before {
  content: "";
  position: absolute; left: 32px; top: 0; height: 2px; width: 56px;
  background: linear-gradient(90deg, var(--cyan), var(--purple));
  transform-origin: left center;
  transform: scaleX(0);
  transition: transform 720ms var(--ease) 200ms;
}
.mn-diagram.mn-in .sa-claim::before { transform: scaleX(1); }
.sa-claim-lead {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(34px, 4vw, 56px);
  line-height: 1.02;
  letter-spacing: -0.018em;
  color: var(--ink-1);
  margin-bottom: 10px;
  opacity: 0; transform: translateY(8px);
  transition: opacity 560ms var(--ease) 320ms, transform 560ms var(--ease) 320ms;
}
.mn-diagram.mn-in .sa-claim-lead { opacity: 1; transform: translateY(0); }
.sa-claim-body {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(20px, 2.2vw, 28px);
  line-height: 1.32;
  letter-spacing: -0.005em;
  color: var(--ink-2);
  max-width: 760px;
  opacity: 0; transform: translateY(8px);
  transition: opacity 560ms var(--ease) 520ms, transform 560ms var(--ease) 520ms;
}
.mn-diagram.mn-in .sa-claim-body { opacity: 1; transform: translateY(0); }
.sa-claim-accent {
  background-image: linear-gradient(120deg, var(--cyan), var(--green));
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  font-style: italic;
}
.sa-claim-meta {
  margin-top: 18px;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.10em;
  color: var(--ink-3);
  text-transform: uppercase;
  max-width: 760px;
  opacity: 0;
  transition: opacity 540ms var(--ease) 760ms;
}
.mn-diagram.mn-in .sa-claim-meta { opacity: 0.7; }
@media (max-width: 720px) {
  .sa-claim { padding: 26px 20px 22px; }
  .sa-claim-lead { font-size: 32px; }
  .sa-claim-body { font-size: 18px; }
}

/* Entry transitions */
.sa-tower, .sa-tool { opacity: 0; transform: translateY(10px); transition: all 540ms var(--ease); }
.mn-diagram.mn-in .sa-tower { opacity: 1; transform: translateY(0); transition-delay: 100ms; }
.mn-diagram.mn-in .sa-tool { opacity: 1; transform: translateY(0); }
.mn-diagram.mn-in .sa-tool:nth-child(1) { transition-delay: 300ms; }
.mn-diagram.mn-in .sa-tool:nth-child(2) { transition-delay: 380ms; }
.mn-diagram.mn-in .sa-tool:nth-child(3) { transition-delay: 460ms; }
.mn-diagram.mn-in .sa-tool:nth-child(4) { transition-delay: 540ms; }
.mn-diagram.mn-in .sa-tool:nth-child(5) { transition-delay: 620ms; }
.mn-diagram.mn-in .sa-tool:nth-child(6) { transition-delay: 700ms; }
.mn-diagram.mn-in .sa-tool:nth-child(7) { transition-delay: 780ms; }
.mn-diagram.mn-in .sa-tool:nth-child(8) { transition-delay: 860ms; }

/* Industry strip — single-row compact replacement for 5-card grid */
.industry-strip {
  display: grid; grid-template-columns: repeat(5, 1fr);
  gap: 12px; margin-top: 24px;
}
.industry-strip .ind {
  display: flex; flex-direction: column; gap: 10px;
  padding: 18px 16px;
  background: var(--bg-2);
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  transition: border-color 280ms var(--ease), transform 280ms var(--ease);
}
.industry-strip .ind:hover { border-color: var(--cyan); transform: translateY(-2px); }
.industry-strip .ind-tag {
  font-family: var(--mono); font-size: 10.5px;
  letter-spacing: 0.16em; color: var(--cyan);
  text-transform: uppercase;
}
.industry-strip .ind > span:last-child {
  font-family: var(--serif); font-size: 15px; color: var(--ink-2);
}
@media (max-width: 880px) {
  .industry-strip { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px) {
  .industry-strip { grid-template-columns: 1fr; }
}

/* =========================================================
   Signature diagram — Three windows / One loop (home-only)
   ========================================================= */
.win.signature { background: var(--bg-1); }
.sig-stage {
  display: grid;
  grid-template-columns: 1fr 38px 1fr 38px 1fr;
  align-items: stretch;
  gap: 0;
  padding: 26px 24px 6px;
}
.sig-pane {
  display: flex; flex-direction: column;
  background: var(--bg-2);
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  padding: 18px 18px 16px;
  min-height: 280px;
  transition: border-color 320ms var(--ease), transform 320ms var(--ease);
}
.sig-pane:hover { border-color: rgba(95,209,255,0.55); transform: translateY(-2px); }
.sig-pane.before:hover { border-color: rgba(95,209,255,0.55); }
.sig-pane.during:hover { border-color: rgba(185,164,255,0.55); }
.sig-pane.after:hover { border-color: rgba(102,226,155,0.55); }

.sig-pane-head {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 8px;
}
.sig-step {
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em;
  background: rgba(95,209,255,0.10);
  color: var(--cyan);
  padding: 3px 8px; border-radius: 4px;
  border: 1px solid rgba(95,209,255,0.30);
}
.sig-pane.during .sig-step { background: rgba(185,164,255,0.10); color: var(--purple); border-color: rgba(185,164,255,0.30); }
.sig-pane.after  .sig-step { background: rgba(102,226,155,0.10); color: var(--green); border-color: rgba(102,226,155,0.30); }

.sig-eyebrow {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.18em; color: var(--ink-3);
  text-transform: uppercase;
}
.sig-pane-title {
  font-family: var(--serif); font-size: 17px;
  color: var(--ink-1);
  line-height: 1.2;
  margin-bottom: 14px;
}

.sig-svg { width: 100%; height: 130px; }
.sig-curve { stroke-dasharray: 600; stroke-dashoffset: 600; transition: stroke-dashoffset 1100ms var(--ease); }
.sig-curve-fill { opacity: 0; transition: opacity 700ms var(--ease) 400ms; }
.mn-diagram.mn-in .sig-curve { stroke-dashoffset: 0; }
.mn-diagram.mn-in .sig-curve-fill { opacity: 1; }
.sig-actual-dot { transform-origin: center; opacity: 0; transform: scale(0.4); transition: opacity 460ms var(--ease) 1100ms, transform 460ms var(--ease) 1100ms; }
.mn-diagram.mn-in .sig-actual-dot { opacity: 1; transform: scale(1); }

.sig-pane-foot {
  display: flex; align-items: flex-start; gap: 10px;
  margin-top: auto; padding-top: 12px;
  border-top: 1px dashed var(--line-soft);
  font-family: var(--serif); font-size: 13.5px;
  color: var(--ink-2); line-height: 1.4;
}
.sig-q {
  flex: 0 0 22px; height: 22px; border-radius: 50%;
  background: rgba(95,209,255,0.14); color: var(--cyan);
  font-family: var(--mono); font-size: 11px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(95,209,255,0.40);
}
.sig-q-green { background: rgba(102,226,155,0.14); color: var(--green); border-color: rgba(102,226,155,0.40); }

/* During pane internal layout */
.sig-route {
  display: flex; flex-direction: column;
  gap: 9px; margin-bottom: 12px;
}
.sig-route-row {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--sans); font-size: 12.5px;
  color: var(--ink-2);
}
.sig-route-row strong { color: var(--ink-1); }
.sig-avatar {
  flex: 0 0 26px; height: 26px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 10px; font-weight: 700;
  color: var(--bg-0);
}
.sig-avatar.cyan { background: linear-gradient(135deg, var(--cyan), var(--purple)); }
.sig-avatar.muted { background: rgba(140,137,126,0.18); color: var(--ink-2); border: 1px solid var(--line-soft); }
.sig-tag {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.14em;
  padding: 2px 6px; border-radius: 3px; margin-left: 4px;
}
.sig-tag.green { background: rgba(102,226,155,0.14); color: var(--green); border: 1px solid rgba(102,226,155,0.40); }
.sig-route-foot {
  display: flex; align-items: center; justify-content: center;
  padding-top: 4px;
}
.sig-pill {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.16em;
  padding: 4px 10px; border-radius: 16px;
  background: rgba(255,212,73,0.10); color: var(--yellow);
  border: 1px solid rgba(255,212,73,0.32);
}

/* Connecting arrow between panes */
.sig-arrow {
  display: flex; align-items: center; justify-content: center;
  opacity: 0; transform: translateX(-6px);
  transition: opacity 540ms var(--ease) 600ms, transform 540ms var(--ease) 600ms;
}
.mn-diagram.mn-in .sig-arrow { opacity: 1; transform: translateX(0); }
.sig-arrow svg { width: 100%; height: 16px; }
.sig-arrow-path { stroke-dasharray: 60; stroke-dashoffset: 60; transition: stroke-dashoffset 900ms var(--ease) 700ms; }
.mn-diagram.mn-in .sig-arrow-path { stroke-dashoffset: 0; }

.sig-foot {
  padding: 14px 22px 18px;
  font-family: var(--serif); font-style: italic;
  font-size: 13.5px; color: var(--ink-3);
  border-top: 1px solid var(--line-soft);
  background: var(--bg-2);
  margin-top: 18px;
}
.sig-foot .ink { color: var(--ink-2); font-style: normal; font-family: var(--mono); font-size: 12px; letter-spacing: 0.08em; }

/* Entry transitions for panes */
.sig-pane { opacity: 0; transform: translateY(8px); transition: opacity 560ms var(--ease), transform 560ms var(--ease), border-color 320ms var(--ease); }
.mn-diagram.mn-in .sig-pane { opacity: 1; transform: translateY(0); }
.mn-diagram.mn-in .sig-pane.before { transition-delay: 100ms; }
.mn-diagram.mn-in .sig-pane.during { transition-delay: 320ms; }
.mn-diagram.mn-in .sig-pane.after  { transition-delay: 540ms; }

/* Responsive collapse */
@media (max-width: 900px) {
  .sig-stage {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .sig-arrow { display: none; }
  .sig-pane { min-height: 0; }
}

/* =========================================================
   Proof Strip — aggregate 5-case score (home-only)
   ========================================================= */
.win.proof-strip { background: var(--bg-1); }
.ps-summary {
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 12px; padding: 22px 24px 14px;
  border-bottom: 1px solid var(--line-soft);
}
.ps-stat {
  display: flex; flex-direction: column; align-items: flex-start; gap: 6px;
  padding: 14px 16px;
  background: var(--bg-2);
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  transition: border-color 320ms var(--ease), transform 320ms var(--ease);
}
.ps-stat:hover { transform: translateY(-2px); border-color: rgba(95,209,255,0.40); }
.ps-stat-num {
  font-family: var(--mono); font-size: 28px; font-weight: 700;
  letter-spacing: -0.01em;
}
.ps-stat-num.cyan  { color: var(--cyan); }
.ps-stat-num.green { color: var(--green); }
.ps-stat-num.red   { color: var(--red); }
.ps-stat-label {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.15em; color: var(--ink-3);
  text-transform: uppercase;
}

.ps-table { padding: 8px 24px 16px; }
.ps-row {
  display: grid;
  grid-template-columns: 150px 1fr 130px 80px 1.2fr;
  align-items: center;
  gap: 14px;
  padding: 11px 12px;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  font-size: 13px;
  opacity: 0; transform: translateX(-6px);
  transition: opacity 460ms var(--ease), transform 460ms var(--ease);
  transition-delay: var(--ps-delay, 0ms);
}
.mn-diagram.mn-in .ps-row { opacity: 1; transform: translateX(0); }
.ps-row.head {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.15em; color: var(--ink-3);
  text-transform: uppercase;
  border-bottom: 1px solid var(--line-soft);
  opacity: 1; transform: none;
}
.ps-code   { font-family: var(--mono); font-size: 11px; letter-spacing: 0.10em; color: var(--ink-3); }
.ps-name   { font-family: var(--serif); font-size: 14.5px; color: var(--ink-1); }
.ps-verdict {
  display: inline-block;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.15em;
  padding: 4px 8px; border-radius: 3px;
}
.ps-verdict.green { background: rgba(102,226,155,0.12); color: var(--green); border: 1px solid rgba(102,226,155,0.32); }
.ps-verdict.red   { background: rgba(255,119,102,0.12); color: var(--red);   border: 1px solid rgba(255,119,102,0.32); }
.ps-verdict.cyan  { background: rgba(95,209,255,0.12);  color: var(--cyan);  border: 1px solid rgba(95,209,255,0.32); }
.ps-delta { font-family: var(--mono); font-size: 13px; font-weight: 700; text-align: right; }
.ps-delta.green { color: var(--green); }
.ps-delta.red   { color: var(--red); }
.ps-delta.cyan  { color: var(--cyan); }
.ps-note  { font-family: var(--serif); font-style: italic; font-size: 13px; color: var(--ink-3); }
.ps-foot {
  padding: 14px 22px;
  font-family: var(--serif); font-style: italic;
  font-size: 13.5px; color: var(--ink-3);
  border-top: 1px solid var(--line-soft);
  background: var(--bg-2);
}
@media (max-width: 900px) {
  .ps-summary { grid-template-columns: 1fr 1fr; }
  .ps-row { grid-template-columns: 100px 1fr 90px; gap: 8px; font-size: 12px; }
  .ps-row .ps-delta, .ps-row .ps-note { display: none; }
}

/* =========================================================
   Audiences — Teams + Stores around one loop (home-only)
   ========================================================= */
.win.audiences { background: var(--bg-1); }
.aud-stage {
  display: grid;
  grid-template-columns: 1fr 200px 1fr;
  gap: 22px;
  padding: 26px 24px 14px;
  align-items: stretch;
}
.aud-col {
  display: flex; flex-direction: column;
  background: var(--bg-2);
  border: 1px solid var(--line-soft);
  border-radius: 14px;
  padding: 18px 18px 16px;
  opacity: 0; transform: translateY(8px);
  transition: opacity 560ms var(--ease), transform 560ms var(--ease), border-color 320ms var(--ease);
}
.mn-diagram.mn-in .aud-col.teams  { opacity: 1; transform: translateY(0); transition-delay: 120ms; }
.mn-diagram.mn-in .aud-col.stores { opacity: 1; transform: translateY(0); transition-delay: 360ms; }
.aud-col:hover { border-color: rgba(95,209,255,0.40); }
.aud-col.stores:hover { border-color: rgba(102,226,155,0.40); }

.aud-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.aud-eyebrow {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  padding: 3px 8px; border-radius: 4px;
}
.aud-eyebrow.cyan  { background: rgba(95,209,255,0.10);  color: var(--cyan);  border: 1px solid rgba(95,209,255,0.32); }
.aud-eyebrow.green { background: rgba(102,226,155,0.10); color: var(--green); border: 1px solid rgba(102,226,155,0.32); }
.aud-scale {
  font-family: var(--mono); font-size: 9.5px; letter-spacing: 0.12em;
  color: var(--ink-3); text-transform: uppercase;
}
.aud-title {
  font-family: var(--serif); font-size: 16px;
  color: var(--ink-1); line-height: 1.3;
  margin-bottom: 14px;
}
.aud-moves { display: flex; flex-direction: column; gap: 8px; margin-top: auto; }
.aud-move {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px;
  background: rgba(255,255,255,0.02);
  border: 1px solid var(--line-soft);
  border-radius: 8px;
  opacity: 0; transform: translateX(-4px);
  transition: opacity 420ms var(--ease), transform 420ms var(--ease), border-color 240ms var(--ease);
  transition-delay: var(--aud-delay, 0ms);
}
.mn-diagram.mn-in .aud-move { opacity: 1; transform: translateX(0); }
.aud-move:hover { border-color: rgba(95,209,255,0.40); }
.aud-move.green:hover { border-color: rgba(102,226,155,0.40); }
.aud-ic {
  flex: 0 0 24px; height: 24px; border-radius: 6px;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 11px;
}
.aud-move.cyan  .aud-ic { background: rgba(95,209,255,0.14);  color: var(--cyan); }
.aud-move.green .aud-ic { background: rgba(102,226,155,0.14); color: var(--green); }
.aud-move-text { display: flex; flex-direction: column; gap: 2px; }
.aud-move-t {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em;
  color: var(--ink-1); text-transform: uppercase;
}
.aud-move-s {
  font-family: var(--serif); font-style: italic;
  font-size: 12px; color: var(--ink-3);
}

.aud-loop {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 12px; padding: 22px 0;
}
.aud-loop-svg { width: 160px; height: 160px; }
.aud-loop-ring {
  stroke-dasharray: 365;
  stroke-dashoffset: 365;
  transition: stroke-dashoffset 1300ms var(--ease) 200ms;
  transform-origin: 80px 80px;
}
.mn-diagram.mn-in .aud-loop-ring { stroke-dashoffset: 0; }
.aud-loop-pulse {
  transform-origin: 80px 80px;
  animation: audLoopPulse 4.4s linear infinite;
  opacity: 0;
  transition: opacity 460ms var(--ease) 1300ms;
}
.mn-diagram.mn-in .aud-loop-pulse { opacity: 1; }
@keyframes audLoopPulse {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
.aud-loop-label {
  font-family: var(--mono); font-size: 10px;
  letter-spacing: 0.18em; color: var(--ink-3);
  text-align: center;
}
.aud-foot {
  padding: 14px 22px;
  font-family: var(--serif); font-style: italic;
  font-size: 13.5px; color: var(--ink-3);
  border-top: 1px solid var(--line-soft);
  background: var(--bg-2);
}
@media (max-width: 900px) {
  .aud-stage { grid-template-columns: 1fr; gap: 16px; }
  .aud-loop { padding: 0; }
}

/* =========================================================
   Slim email-only capture form
   ========================================================= */
.form-email {
  margin: 28px auto 0;
  max-width: 620px;
  width: 100%;
}
.form-email-row {
  display: flex;
  align-items: stretch;
  gap: 10px;
  background: var(--bg-2);
  border: 1px solid var(--line-soft);
  border-radius: 12px;
  padding: 6px 6px 6px 18px;
  transition: border-color 240ms var(--ease), box-shadow 240ms var(--ease);
}
.form-email-row:focus-within {
  border-color: rgba(95, 209, 255, 0.55);
  box-shadow: 0 0 0 4px rgba(95, 209, 255, 0.08);
}
.form-email input[type="email"] {
  flex: 1;
  border: none;
  background: transparent;
  color: var(--ink-1);
  font-family: var(--sans);
  font-size: 17px;
  outline: none;
  padding: 14px 0;
  min-width: 0;
}
.form-email input[type="email"]::placeholder {
  color: var(--ink-4);
}
.form-email input[type="email"]:disabled {
  opacity: 0.55;
}
.form-email button.cta {
  white-space: nowrap;
  padding: 12px 22px;
  border-radius: 8px;
  margin: 0;
  flex-shrink: 0;
}
.form-email-hint {
  margin-top: 14px;
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: 0.04em;
  color: var(--ink-3);
  text-align: center;
}
.form-email-hint a.mn-link,
.form-email-hint .mn-link {
  color: var(--cyan);
  text-decoration: none;
  border-bottom: 1px dashed rgba(95, 209, 255, 0.45);
}
.form-email-hint a.mn-link:hover { border-bottom-style: solid; }
@media (max-width: 560px) {
  .form-email-row {
    flex-direction: column;
    padding: 6px;
  }
  .form-email input[type="email"] {
    padding: 14px 12px;
  }
  .form-email button.cta {
    width: 100%;
  }
}

/* =========================================================
   Simple / Advanced version switcher (top-right of header)
   ========================================================= */
.ml-version-switch {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 4px;
  margin: 0 6px 0 20px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid var(--line-soft);
  border-radius: 999px;
  position: relative;
  isolation: isolate;
  white-space: nowrap;
  line-height: 1;
  flex: 0 0 auto;
}
/* Specificity high enough to win against `header.site nav a:not(.cta)` */
header.site nav a.ml-version-switch__side,
.ml-version-switch__side {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--mono);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-3);
  padding: 8px 14px;
  border-radius: 999px;
  text-decoration: none;
  background: transparent;
  transition: color 240ms ease-out, background 240ms ease-out, box-shadow 280ms ease-out;
  line-height: 1;
  white-space: nowrap;
}
header.site nav a.ml-version-switch__side:hover,
.ml-version-switch__side:hover { color: var(--ink-1); }
header.site nav a.ml-version-switch__side--active,
.ml-version-switch__side--active {
  color: #0a1418;
  background: linear-gradient(135deg, var(--cyan), #4cb8e8);
  box-shadow: 0 0 0 1px rgba(95, 209, 255, 0.55), 0 8px 18px -8px rgba(95, 209, 255, 0.55);
}
header.site nav a.ml-version-switch__side--active:hover,
.ml-version-switch__side--active:hover { color: #0a1418; }
@media (max-width: 760px) {
  .ml-version-switch { margin: 0 6px; }
  .ml-version-switch__side { padding: 7px 11px; font-size: 10px; letter-spacing: 0.12em; }
}