/* The Hive factory: native machinery, useful motion, inspectable work.
   Workspace styles remain confined to the existing recorded-demo frame. */
@font-face {
  font-family: "Space Grotesk";
  src: url("/fonts/SpaceGrotesk.woff2") format("woff2");
  font-weight: 300 700;
  font-display: swap;
}
.demo-landing {
  --lp-bg: #0b0c0c;
  --lp-surface: #121413;
  --lp-surface-2: #1c1f1d;
  --lp-card: #101211;
  --lp-ink: #f3f2ed;
  --lp-ink-muted: #b6b9b2;
  --lp-ink-faint: #92988e;
  --lp-accent: #f0b429;
  --lp-accent-ink: #f0bc46;
  --lp-line: #2b302b;
  --lp-line-strong: #495047;
  --lp-line-gold: #665327;
  --lp-machine: #687269;
  --lp-machine-face: #191d19;
  --lp-machine-paper: #20271f;
  --lp-grid: #252b25;
  --lp-hero-mask: 11, 12, 12;
  --lp-display-font: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;
  background: var(--lp-bg);
  color: var(--lp-ink);
  font-size: 16px;
}
@media (prefers-color-scheme: light) {
  .demo-landing {
    --lp-bg: #f8f7f2;
    --lp-surface: #fffefa;
    --lp-surface-2: #eeeee5;
    --lp-card: #f3f3eb;
    --lp-ink: #20271f;
    --lp-ink-muted: #545e51;
    --lp-ink-faint: #616b5d;
    --lp-accent: #edb62e;
    --lp-accent-ink: #805500;
    --lp-line: #d9ddd0;
    --lp-line-strong: #acb6a4;
    --lp-line-gold: #d1b672;
    --lp-machine: #84907d;
    --lp-machine-face: #e8ecdf;
    --lp-machine-paper: #fafff2;
    --lp-grid: #e1e5d9;
    --lp-hero-mask: 248, 247, 242;
  }
}
.lp-wrap {
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: 40px;
  box-sizing: border-box;
}
.demo-landing :focus-visible:not(.lp-demo-frame *) {
  outline: 3px solid var(--lp-accent-ink);
  outline-offset: 4px;
}
.demo-landing .demo-skip {
  background: var(--lp-surface);
  color: var(--lp-ink);
}
#what-is-hive,
#why-hive,
#real-task,
#demo,
#availability,
#how-it-works {
  scroll-margin-top: 28px;
}
.lp-hex {
  display: inline-block;
  width: 8px;
  height: 9px;
  flex-shrink: 0;
  background: var(--lp-accent-ink);
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
}
.lp-kicker {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 18px;
  font: 500 13px/1.4 var(--lp-display-font);
  color: var(--lp-ink-muted);
}
.lp-btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  min-height: 48px;
  box-sizing: border-box;
  padding: 13px 23px;
  border: 1px solid transparent;
  border-radius: 6px;
  cursor: pointer;
  font: 500 15px/1.3 var(--lp-display-font);
  text-decoration: none;
  transition:
    background-color 0.15s,
    border-color 0.15s;
}
.lp-btn:hover {
  text-decoration: none;
}
.lp-btn-primary {
  background: var(--lp-accent);
  color: #241c08;
}
.lp-btn-primary:hover {
  background: #ffcb4c;
}
.lp-btn-ghost {
  color: var(--lp-ink);
  background: var(--lp-surface);
  border-color: var(--lp-line-strong);
}
.lp-btn-ghost:hover {
  border-color: var(--lp-accent-ink);
}
.lp-text-link {
  display: inline-flex;
  gap: 14px;
  align-items: center;
  color: var(--lp-ink);
  font: 500 14px/1.5 var(--lp-display-font);
  text-decoration: underline;
  text-decoration-color: var(--lp-line-strong);
  text-underline-offset: 5px;
}
.lp-text-link:hover {
  color: var(--lp-accent-ink);
  text-decoration-color: currentColor;
}
.lp-topbar {
  border-bottom: 1px solid var(--lp-line);
}
.lp-topbar-inner {
  display: flex;
  align-items: center;
  min-height: 68px;
}
.lp-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--lp-ink);
  font: 500 20px/1 var(--lp-display-font);
  letter-spacing: -0.02em;
  text-decoration: none;
}
.lp-brand:hover {
  text-decoration: none;
}
.lp-brand svg {
  color: var(--lp-accent-ink);
}
.lp-hero-stage {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  padding: 24px 0;
  min-height: 398px;
  box-sizing: border-box;
}
.lp-hero-content {
  position: relative;
  z-index: 1;
  width: 100%;
  pointer-events: none;
}
.lp-hero-copy {
  max-width: 850px;
  pointer-events: auto;
}
.lp-display {
  margin: 0;
  font: 500 clamp(46px, 4.8vw, 70px) / 1.03 var(--lp-display-font);
  letter-spacing: -0.03em;
  color: var(--lp-ink);
}
.lp-display span {
  display: block;
}
.lp-lead {
  margin: 20px 0 0;
  max-width: 54ch;
  font-size: 17px;
  line-height: 1.65;
  color: var(--lp-ink-muted);
}
.lp-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 24px 0 0;
}
.lp-hero .lp-kicker {
  color: var(--lp-accent-ink);
  margin-bottom: 21px;
}
.lp-hive {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.lp-hive-canvas {
  display: block;
  width: 100%;
  height: 100%;
}
.lp-hive-mask {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    rgba(var(--lp-hero-mask), 0.9),
    rgba(var(--lp-hero-mask), 0.7) 36%,
    rgba(var(--lp-hero-mask), 0.08) 72%
  );
}
.lp-hive-static {
  position: absolute;
  inset: 0;
  width: min(46%, 380px);
  height: 72%;
  margin: auto;
  display: none;
}
.lp-hive:not([data-hive-state]) .lp-hive-static,
.lp-hive[data-hive-state="fallback"] .lp-hive-static {
  display: block;
}
.lp-hive:not([data-hive-state]) .lp-hive-canvas,
.lp-hive[data-hive-state="fallback"] .lp-hive-canvas {
  display: none;
}
@media (min-width: 821px) {
  .lp-hive-canvas {
    pointer-events: auto;
  }
}
.lp-section {
  padding: 90px 0;
  border-top: 1px solid var(--lp-line);
}
.lp-h2 {
  margin: 0 0 18px;
  max-width: 24ch;
  font: 500 clamp(30px, 3vw, 36px) / 1.08 var(--lp-display-font);
  letter-spacing: -0.045em;
  color: var(--lp-ink);
}
.lp-sub {
  margin: 0;
  max-width: 55ch;
  color: var(--lp-ink-muted);
  font-size: 16px;
  line-height: 1.65;
}
/* The scene has one focal work panel, not nine repeating cards. */
.lp-factory {
  border: 0;
  padding: 0 0 78px;
}
.lp-factory-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 48px;
  margin-bottom: 28px;
}
.lp-factory-heading .lp-h2 {
  font-size: clamp(30px, 3vw, 36px);
  max-width: 22ch;
  margin: 0;
  letter-spacing: -0.03em;
}
.lp-factory-heading .lp-sub {
  max-width: 35ch;
  font-size: 14px;
  line-height: 1.5;
}
.lp-line {
  margin: 0;
  position: relative;
  overflow: hidden;
  border: 1px solid var(--lp-line-strong);
  border-radius: 12px;
  background: var(--lp-surface);
}
.factory-toolbar {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 24px;
  border-bottom: 1px solid var(--lp-line);
  font: 500 13px/1.3 var(--lp-display-font);
  color: var(--lp-ink-muted);
}
.factory-toolbar > span {
  display: flex;
  align-items: center;
  gap: 9px;
}
.lp-line-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  min-width: 88px;
  padding: 8px 12px;
  margin: 0;
  border: 1px solid var(--lp-line);
  border-radius: 5px;
  background: var(--lp-card);
  color: var(--lp-ink);
  font: 500 12px/1.2 var(--lp-display-font);
  cursor: pointer;
}
.lp-line-toggle:hover {
  border-color: var(--lp-accent-ink);
  background: var(--lp-surface-2);
}
.factory-toggle-icon {
  width: 12px;
  font-size: 15px;
}
.lp-line-toggle[hidden] {
  display: none;
}
.factory-theatre {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(310px, 1fr);
  min-height: 492px;
}
.factory-viewport {
  position: relative;
  overflow: hidden;
  min-width: 0;
  background: var(--lp-bg);
  isolation: isolate;
}
.factory-svg {
  width: 100%;
  height: 100%;
  min-height: 480px;
  display: block;
  position: absolute;
  inset: 0;
}
.factory-svg [hidden] {
  display: none;
}
.factory-camera {
  transform-origin: 0 0;
}
.factory-grid path,
#factory-grid path {
  stroke: var(--lp-grid);
  stroke-width: 1;
}
.factory-ground {
  opacity: 0.8;
}
.factory-memory-rail {
  stroke: var(--lp-line-gold);
  stroke-width: 1;
  stroke-dasharray: 4 5;
  opacity: 0.48;
}
.factory-belts {
  stroke-linejoin: round;
  stroke-linecap: round;
}
.belt-bed {
  stroke: var(--lp-machine-face);
  stroke-width: 20;
}
.belt-rollers {
  stroke: var(--lp-line-strong);
  stroke-width: 14;
  stroke-dasharray: 1 7;
}
.belt-edge {
  stroke: var(--lp-machine);
  stroke-width: 1;
  opacity: 0.65;
}
.belt-progress {
  stroke: var(--lp-accent);
  stroke-width: 2;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
}
.factory-return-bed {
  stroke: var(--lp-machine-face);
  stroke-width: 13;
  stroke-linejoin: round;
}
.factory-return {
  stroke: var(--lp-line-strong);
  stroke-width: 1.5;
  stroke-dasharray: 4 5;
  stroke-linejoin: round;
}
.lp-line[data-review="fixing"] .factory-return {
  stroke: var(--lp-accent);
  stroke-width: 2;
}
.factory-machine {
  stroke: var(--lp-machine);
  stroke-width: 1.5;
  stroke-linejoin: round;
  stroke-linecap: round;
}
.machine-plinth,
.machine-face {
  fill: var(--lp-machine-face);
}
.machine-paper {
  fill: var(--lp-machine-paper);
}
.machine-plate {
  stroke: var(--lp-line-strong);
  fill: var(--lp-machine-face);
  opacity: 0.6;
}
.machine-accent {
  stroke: var(--lp-machine);
}
.machine-detail {
  stroke: var(--lp-machine);
  stroke-width: 2;
}
.machine-number {
  fill: var(--lp-ink-faint);
  stroke: none;
  font: 500 16px var(--lp-display-font);
}
.factory-machine.is-active {
  stroke: var(--lp-ink-muted);
}
.factory-machine.is-active .machine-accent,
.factory-machine.is-active .machine-detail,
.factory-machine.is-active .machine-operation {
  stroke: var(--lp-accent-ink);
}
.factory-machine.is-active .machine-plate {
  stroke: var(--lp-accent);
  stroke-dasharray: none;
  opacity: 0.65;
}
.factory-machine.is-done .machine-number {
  fill: var(--lp-accent-ink);
}
/* Surfaces that print an accent under the carried work mute it while the work
   rests there (--dock-occupancy eases through the landing and the lift). */
.factory-machine[data-machine="brainstorm"] .machine-accent {
  opacity: calc(1 - var(--dock-occupancy, 0));
}
.factory-machine[data-machine="pr"] .machine-accent {
  opacity: calc(1 - 0.75 * var(--dock-occupancy, 0));
}
.machine-scan {
  stroke: var(--lp-accent-ink);
  stroke-width: 3;
}
.factory-packet {
  stroke: var(--lp-accent-ink);
  stroke-width: 1.6;
  stroke-linejoin: round;
  fill: var(--lp-machine-paper);
  pointer-events: none;
}
.packet-ink {
  fill: none;
}
.factory-gate-front {
  stroke: var(--lp-machine);
  stroke-width: 1.5;
  stroke-linecap: round;
  pointer-events: none;
}
.factory-gate-front.is-active {
  stroke: var(--lp-accent-ink);
}
.factory-packet[data-moving="true"] .packet-shadow {
  opacity: 0;
}
.packet-shadow {
  stroke: none;
  fill: var(--lp-accent);
  opacity: 0.13;
}
.lp-line-bees {
  pointer-events: none;
}
.lp-line-bees rect {
  fill: var(--lp-accent);
}
.lp-line-bees ellipse {
  fill: var(--lp-ink-muted);
  opacity: 0.75;
}
.factory-caption {
  position: absolute;
  bottom: 22px;
  left: 22px;
  right: 22px;
  display: flex;
  align-items: center;
  gap: 8px;
  font: 500 14px/1.5 var(--lp-display-font);
  color: var(--lp-ink-muted);
  pointer-events: none;
}
.factory-caption-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--lp-accent-ink);
  flex-shrink: 0;
}
.factory-work {
  border-left: 1px solid var(--lp-line);
  padding: 29px 28px;
  min-width: 0;
  background: var(--lp-surface);
  display: grid;
  align-items: start;
}
.factory-panel {
  grid-area: 1/1;
  min-width: 0;
}
.factory-panel[hidden] {
  display: none;
}
.work-stage {
  display: flex;
  align-items: center;
  gap: 13px;
  margin: 0 0 17px;
  font: 500 13px/1.4 var(--lp-display-font);
  color: var(--lp-ink);
}
.work-stage > span {
  font-size: 11px;
  color: var(--lp-accent-ink);
  font-variant-numeric: tabular-nums;
}
.factory-panel h3 {
  font: 500 27px/1.13 var(--lp-display-font);
  letter-spacing: -0.035em;
  margin: 0 0 11px;
  max-width: 19ch;
}
.work-description {
  font-size: 14px;
  line-height: 1.6;
  color: var(--lp-ink-muted);
  margin: 0 0 24px;
  max-width: 36ch;
}
.factory-panel h4 {
  font: 500 19px/1.3 var(--lp-display-font);
  letter-spacing: -0.02em;
  margin: 12px 0;
}
.work-file {
  display: block;
  font:
    11px/1.5 ui-monospace,
    monospace;
  color: var(--lp-ink-faint);
  overflow-wrap: anywhere;
}
.work-request,
.work-pr {
  padding: 18px;
  border: 1px solid var(--lp-line-strong);
  border-radius: 7px;
  background: var(--lp-card);
}
.work-request p {
  font-size: 13px;
  line-height: 1.6;
  margin: 0 0 19px;
  color: var(--lp-ink-muted);
}
.work-tag {
  display: inline-block;
  border: 1px solid var(--lp-line);
  padding: 4px 8px;
  border-radius: 4px;
  font: 11px/1.4 var(--lp-display-font);
  color: var(--lp-ink-muted);
}
.work-question {
  border-left: 2px solid var(--lp-accent);
  padding-left: 16px;
  font-size: 13px;
  line-height: 1.55;
}
.work-question span {
  display: block;
  color: var(--lp-ink-muted);
  margin-bottom: 8px;
}
.work-question strong {
  font-weight: 500;
  color: var(--lp-ink);
}
.work-checklist {
  list-style: none;
  padding: 0;
  margin: 20px 0 0;
  font-size: 12px;
  line-height: 1.6;
}
.work-checklist li {
  margin: 8px 0;
  padding-left: 19px;
  position: relative;
}
.work-checklist li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--lp-accent-ink);
}
.work-plan {
  list-style: none;
  padding: 0;
  margin: 0;
}
.work-plan li {
  display: flex;
  gap: 12px;
  align-items: center;
  border-bottom: 1px solid var(--lp-line);
  padding: 12px 0;
  font-size: 13px;
}
.work-plan li > span {
  font: 11px var(--lp-display-font);
  color: var(--lp-ink-faint);
}
.work-wiki {
  border: 1px solid var(--lp-line-gold);
  border-radius: 5px;
  padding: 12px 14px;
  margin-top: 17px;
  background: var(--lp-card);
}
.work-wiki span {
  display: block;
  font-size: 11px;
  color: var(--lp-accent-ink);
  margin-bottom: 6px;
}
.work-wiki strong {
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  display: block;
}
.work-code {
  padding: 14px 0;
  background: var(--lp-card);
  border: 1px solid var(--lp-line);
  border-radius: 5px;
}
.work-code > .work-file {
  padding: 0 13px 12px;
  border-bottom: 1px solid var(--lp-line);
  font-size: 11px;
}
.work-code > code {
  display: block;
  font:
    11px/1.9 ui-monospace,
    monospace;
  padding: 15px 11px;
  white-space: normal;
  overflow-wrap: anywhere;
  background: none;
  color: var(--lp-ink);
}
.code-comment {
  color: var(--lp-ink-faint);
}
.work-code-foot {
  padding: 10px 13px 0;
  border-top: 1px solid var(--lp-line);
  font-size: 11px;
  color: var(--lp-accent-ink);
}
.work-review {
  border: 1px solid var(--lp-line-gold);
  border-radius: 7px;
  padding: 15px;
  background: var(--lp-card);
}
.work-review-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  font: 12px/1.5 var(--lp-display-font);
  color: var(--lp-accent-ink);
}
.work-review-head > span:last-child {
  color: var(--lp-ink-faint);
}
.work-review h4 {
  font-size: 19px;
  margin: 13px 0 10px;
}
.work-review > p {
  font-size: 13px;
  line-height: 1.55;
  color: var(--lp-ink-muted);
  margin: 0 0 14px;
}
.work-review-fix {
  border-top: 1px solid var(--lp-line);
  padding-top: 11px;
  font-size: 12px;
  line-height: 1.6;
  color: var(--lp-accent-ink);
}
.work-review-track {
  display: flex;
  gap: 12px;
  margin-top: 16px;
  font: 11px/1.5 var(--lp-display-font);
  color: var(--lp-ink-faint);
}
.work-review-track .is-current {
  color: var(--lp-accent-ink);
}
.work-captures {
  position: relative;
  min-height: 173px;
  margin-top: 6px;
}
.work-capture {
  position: absolute;
  left: 0;
  top: 0;
  width: 66%;
  min-height: 138px;
  background: var(--lp-card);
  border: 1px solid var(--lp-line-strong);
  border-radius: 6px;
  box-shadow: 0 8px 16px #00000009;
}
.work-capture > span {
  display: block;
  font:
    11px/1.4 ui-monospace,
    monospace;
  padding: 9px 10px;
  border-bottom: 1px solid var(--lp-line);
  color: var(--lp-ink-muted);
}
.work-capture code {
  display: block;
  font:
    11px/1.6 ui-monospace,
    monospace;
  padding: 10px;
  background: none;
  color: var(--lp-ink);
}
.work-capture-front {
  left: auto;
  right: 0;
  top: 35px;
  width: 53%;
  border-color: var(--lp-line-gold);
}
.work-proof-status {
  font-size: 12px;
  color: var(--lp-accent-ink);
  margin: 14px 0 0;
}
.work-bundle {
  border: 1px solid var(--lp-line-gold);
  border-radius: 6px;
  overflow: hidden;
}
.work-bundle > div {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 15px;
  font-size: 13px;
  background: var(--lp-card);
}
.work-bundle > div > span {
  font-size: 23px;
  color: var(--lp-accent-ink);
}
.work-bundle strong {
  font-weight: 500;
}
.work-bundle ul {
  list-style: none;
  margin: 0;
  padding: 6px 15px 13px;
  border-top: 1px solid var(--lp-line);
}
.work-bundle li {
  display: flex;
  gap: 10px;
  font-size: 12px;
  line-height: 1.5;
  margin-top: 10px;
  color: var(--lp-ink-muted);
}
.work-bundle li > span {
  color: var(--lp-accent-ink);
  width: 14px;
}
.work-bundle-memory {
  font-size: 11px;
  line-height: 1.5;
  color: var(--lp-accent-ink);
  margin: 13px 0 0;
}
.work-result {
  padding: 20px 0;
}
.work-result-check {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 46px;
  clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
  background: var(--lp-accent);
  color: #28210c;
  font-size: 23px;
}
.work-result p {
  font-size: 13px;
  line-height: 1.6;
  color: var(--lp-ink-muted);
  margin: 0 0 19px;
}
.factory-panel > .lp-text-link {
  font-size: 12px;
  gap: 7px;
}
.factory-memory {
  display: flex;
  align-items: center;
  gap: 19px;
  padding: 16px 24px;
  border-block: 1px solid var(--lp-line);
  font-size: 13px;
  line-height: 1.5;
  background: var(--lp-card);
}
.factory-memory-label {
  display: flex;
  align-items: center;
  gap: 9px;
  white-space: nowrap;
  color: var(--lp-ink);
}
.factory-memory-label > span {
  font-size: 21px;
  color: var(--lp-accent-ink);
}
.factory-memory p {
  margin: 0;
  color: var(--lp-ink-muted);
}
.factory-memory-state {
  margin-left: auto;
  white-space: nowrap;
  color: var(--lp-accent-ink);
  font: 500 13px/1.5 var(--lp-display-font);
}
.factory-stations {
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}
.lp-stage {
  min-width: 0;
  margin: 0;
}
.lp-stage + .lp-stage {
  border-left: 1px solid var(--lp-line);
}
.lp-stage-btn {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
  height: 76px;
  border: 0;
  border-radius: 0;
  padding: 14px 13px;
  background: transparent;
  color: var(--lp-ink-muted);
  text-align: left;
  cursor: pointer;
  font: 500 13px/1.3 var(--lp-display-font);
}
.stage-index {
  font-size: 11px;
  color: var(--lp-ink-faint);
  font-variant-numeric: tabular-nums;
}
.lp-line .lp-stage-btn:hover {
  background: var(--lp-surface-2);
  color: var(--lp-ink);
  box-shadow: inset 0 -2px color-mix(in srgb, var(--lp-accent) 55%, transparent);
}
.lp-line .lp-stage-btn:active,
.lp-line .lp-line-toggle:active {
  transform: none;
}
.lp-stage.is-current .lp-stage-btn {
  background: var(--lp-surface-2);
  color: var(--lp-ink);
  box-shadow: inset 0 -2px var(--lp-accent);
}
.lp-stage.is-done .stage-index {
  color: var(--lp-accent-ink);
}
.lp-line .lp-stage-btn:focus-visible {
  outline-offset: -4px;
}
.lp-line:not([data-line-ready]) .factory-packet,
.lp-line:not([data-line-ready]) .lp-line-bees {
  display: none;
}
/* Explanations have different silhouettes: a loop, a wiki entry, an open agent band. */
.lp-why {
  padding: 86px 0 65px;
}
.lp-benefits-heading {
  max-width: 28ch;
  margin-bottom: 48px;
}
.lp-benefit-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 70px;
}
.lp-benefit {
  min-width: 0;
}
.lp-benefit + .lp-benefit {
  padding-left: 70px;
  border-left: 1px solid var(--lp-line);
}
.lp-benefit h3,
.lp-agents h3 {
  font: 500 28px/1.2 var(--lp-display-font);
  letter-spacing: -0.035em;
  margin: 0 0 14px;
}
.lp-benefit > p:not(.lp-kicker),
.lp-agents p:not(.lp-kicker) {
  font-size: 15px;
  line-height: 1.65;
  color: var(--lp-ink-muted);
  margin: 0 0 22px;
  max-width: 49ch;
}
.lp-benefit > .lp-kicker {
  color: var(--lp-accent-ink);
  margin: 26px 0 9px;
}
.lp-loop-diagram {
  height: 145px;
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  box-sizing: border-box;
}
.lp-loop-diagram span {
  padding: 7px 10px;
  border: 1px solid var(--lp-line-strong);
  background: var(--lp-bg);
  z-index: 1;
  border-radius: 5px;
  font: 12px/1.5 var(--lp-display-font);
}
.lp-loop-diagram .lp-loop-finding {
  border-color: var(--lp-line-gold);
  color: var(--lp-accent-ink);
}
.lp-loop-diagram svg {
  position: absolute;
  left: 0;
  top: 24px;
  width: 100%;
  height: 100px;
  stroke: var(--lp-line-strong);
  stroke-width: 1.3;
}
.lp-memory-example {
  padding: 17px 19px;
  border: 1px solid var(--lp-line-strong);
  border-radius: 6px;
  max-width: 350px;
  box-sizing: border-box;
  min-height: 145px;
  background: var(--lp-card);
}
.lp-memory-example > div {
  display: flex;
  align-items: center;
  gap: 9px;
  font: 12px/1.4 var(--lp-display-font);
}
.lp-file-mark {
  font-size: 20px;
  color: var(--lp-accent-ink);
}
.lp-memory-saved {
  margin-left: auto;
  color: var(--lp-accent-ink);
  font-size: 10px;
}
.lp-memory-example > p {
  font-size: 13px;
  line-height: 1.5;
  margin: 12px 0 8px;
  color: var(--lp-ink);
}
.lp-memory-next {
  font-size: 11px;
  color: var(--lp-ink-faint);
}
.lp-agents {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  align-items: center;
  gap: 40px;
  border-top: 1px solid var(--lp-line);
  padding-top: 42px;
  margin-top: 56px;
}
.lp-agents .lp-kicker {
  margin-bottom: 9px;
}
.lp-agents h3 {
  font-size: 25px;
  margin-bottom: 8px;
}
.lp-agents p:not(.lp-kicker) {
  margin-bottom: 0;
}
.lp-agent-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.lp-agent-card {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 64px;
  padding: 12px 16px;
  box-sizing: border-box;
  border: 1px solid var(--lp-line);
  border-radius: 12px;
  background: var(--lp-card);
}
.lp-agent-mark {
  display: grid;
  place-items: center;
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: var(--lp-ink);
  color: var(--lp-bg);
}
.lp-agent-mark svg {
  display: block;
  width: 20px;
  height: 20px;
  fill: currentColor;
}
.lp-agent-name {
  font: 500 15px/1.3 var(--lp-display-font);
  color: var(--lp-ink);
}
/* Real proof: an editorial lead paired with the two recorded findings. */
.lp-case-section {
  background: var(--lp-card);
}
.lp-case-layout {
  display: grid;
  grid-template-columns: 1fr 1.04fr;
  gap: 26px 80px;
}
.lp-case-intro .lp-h2 {
  max-width: 17ch;
  font-size: clamp(30px, 3vw, 36px);
}
.lp-case-intro > .lp-sub {
  font-size: 15px;
}
.lp-original {
  margin: 25px 0;
  color: var(--lp-ink-muted);
  font-size: 13px;
}
.lp-original summary {
  cursor: pointer;
  color: var(--lp-ink);
  padding-block: 8px;
}
.lp-original blockquote {
  margin: 14px 0 0;
  padding: 0 0 0 16px;
  border-left: 2px solid var(--lp-line-gold);
  font-size: 12px;
  line-height: 1.65;
  white-space: pre-line;
  overflow-wrap: anywhere;
}
.lp-case-result {
  margin: 26px 0 13px;
}
.lp-case-result > a {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  font: 500 16px/1.5 var(--lp-display-font);
  color: var(--lp-ink);
  text-decoration: none;
}
.lp-case-result > a > span:not(.lp-merge-mark) {
  font-size: 11px;
  color: var(--lp-accent-ink);
}
.lp-merge-mark {
  font-size: 24px;
  color: var(--lp-accent-ink);
}
.lp-case-limit {
  font-size: 11px;
  line-height: 1.6;
  color: var(--lp-ink-faint);
  max-width: 46ch;
  margin: 0;
}
.lp-case-evidence {
  border: 1px solid var(--lp-line-strong);
  border-radius: 8px;
  background: var(--lp-surface);
  align-self: start;
  overflow: hidden;
}
.lp-case-evidence > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 22px;
  font: 500 12px/1.5 var(--lp-display-font);
  border-bottom: 1px solid var(--lp-line);
}
.lp-case-evidence > header > span:last-child {
  font-size: 10px;
  color: var(--lp-ink-faint);
}
.lp-finding {
  padding: 23px;
}
.lp-finding + .lp-finding {
  border-top: 1px solid var(--lp-line);
}
.lp-finding-source {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--lp-ink-faint);
  font: 11px/1.5 var(--lp-display-font);
  margin: 0 0 10px;
}
.lp-finding-source span {
  color: var(--lp-accent-ink);
}
.lp-finding h3 {
  font: 500 19px/1.3 var(--lp-display-font);
  letter-spacing: -0.02em;
  margin: 0 0 11px;
}
.lp-finding > p:not(.lp-finding-source) {
  font-size: 13px;
  line-height: 1.6;
  color: var(--lp-ink-muted);
  margin: 0;
}
.lp-finding .lp-fix {
  border-left: 1px solid var(--lp-line-gold);
  padding-left: 11px;
  margin-top: 14px !important;
  font-size: 12px !important;
}
.lp-fix > span {
  color: var(--lp-accent-ink);
}
.lp-case-links {
  display: flex;
  flex-wrap: wrap;
  gap: 15px 25px;
  padding: 17px 23px;
  border-top: 1px solid var(--lp-line);
  font: 500 12px/1.5 var(--lp-display-font);
}
.lp-case-links a {
  color: var(--lp-ink);
  text-decoration: none;
  display: flex;
  gap: 8px;
}
.lp-case-links a:hover {
  text-decoration: underline;
}
.lp-case-links a > span {
  color: var(--lp-accent-ink);
}
.lp-explore {
  grid-column: 1/-1;
  justify-self: start;
  margin-top: 5px;
}
/* Genuine interactive workspace, preserved unchanged. */
.lp-demo {
  border-top: 0;
  padding: 72px 0 84px;
}
.lp-demo-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 30px;
  margin-bottom: 28px;
}
.lp-demo .lp-h2 {
  font-size: clamp(30px, 3vw, 36px);
}
.lp-demo .lp-sub {
  font-size: 14px;
}
.lp-demo-actions {
  flex-shrink: 0;
  margin: 0 0 5px;
}
.lp-demo-frame {
  max-width: 1360px;
  margin-inline: auto;
  width: calc(100% - 64px);
  border: 1px solid var(--lp-line-strong);
  border-radius: 10px;
  overflow: auto;
  max-height: min(720px, 82vh);
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  background: var(--bg, #faf9f5);
  color: var(--ink, #1f1e1d);
}
.demo-landing .lp-demo-frame .topbar {
  position: static;
}
.lp-start {
  padding: 96px 0 104px;
}
.lp-start-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 90px;
  align-items: center;
}
.lp-start .lp-h2 {
  max-width: 17ch;
  font-size: clamp(30px, 3vw, 36px);
}
.lp-start .lp-sub {
  max-width: 43ch;
  font-size: 15px;
}
.lp-start-note {
  font-size: 12px;
  color: var(--lp-ink-faint);
  margin: 17px 0 0;
}
.lp-start-steps {
  list-style: none;
  margin: 0;
  padding: 0;
}
.lp-start-steps > li {
  display: flex;
  align-items: start;
  gap: 24px;
  padding: 25px 0;
  border-bottom: 1px solid var(--lp-line);
}
.lp-start-steps > li:first-child {
  padding-top: 0;
}
.lp-start-steps > li:last-child {
  border: 0;
  padding-bottom: 0;
}
.lp-start-steps > li > span {
  font: 12px/1.5 var(--lp-display-font);
  color: var(--lp-accent-ink);
  padding-top: 4px;
}
.lp-start-steps h3 {
  font: 500 20px/1.3 var(--lp-display-font);
  letter-spacing: -0.02em;
  margin: 0 0 8px;
}
.lp-start-steps p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--lp-ink-muted);
  margin: 0;
}
.lp-start-steps a {
  color: var(--lp-ink);
  text-underline-offset: 3px;
}
.demo-landing .demo-footer {
  border-top: 1px solid var(--lp-line);
  color: var(--lp-ink-faint);
  margin-top: 0;
  padding-block: 26px;
}
.demo-landing .demo-footer a,
.demo-landing .demo-footer button {
  color: var(--lp-ink-muted);
  font-size: 12px;
}
.demo-landing .demo-footer button {
  display: inline;
  border: 0;
  background: none;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.demo-landing .snapshot-note {
  color: var(--lp-ink-faint);
}
.demo-landing #waitlist-dialog {
  background: var(--lp-surface);
  color: var(--lp-ink);
  border-color: var(--lp-line-strong);
  box-shadow: none;
}
.demo-landing #waitlist-dialog::backdrop {
  background: #000000b3;
}
.demo-landing #waitlist-dialog h2 {
  font-family: var(--lp-display-font);
  font-weight: 500;
}
.demo-landing #waitlist-purpose,
.demo-landing #waitlist-status,
.demo-landing #waitlist-dialog .demo-text-button,
.demo-landing .demo-privacy {
  color: var(--lp-ink-muted);
}
.demo-landing #waitlist-email {
  background: var(--lp-bg);
  color: var(--lp-ink);
  border-color: var(--lp-line-strong);
}
.demo-landing #waitlist-dialog .demo-button {
  border-radius: 6px;
  font-family: var(--lp-display-font);
  font-weight: 500;
}
.demo-landing #waitlist-dialog .demo-primary {
  background: var(--lp-accent);
  color: #241c08;
  border-color: transparent;
}
.demo-landing .demo-privacy a {
  color: var(--lp-accent-ink);
}
@media (max-width: 1100px) {
  .lp-wrap {
    padding-inline: 32px;
  }
  .factory-theatre {
    grid-template-columns: minmax(0, 1.3fr) minmax(300px, 1fr);
  }
  .factory-work {
    padding: 25px 23px;
  }
  .lp-stage-btn {
    padding-inline: 9px;
    font-size: 13px;
  }
  .lp-benefit-pair {
    gap: 36px;
  }
  .lp-benefit + .lp-benefit {
    padding-left: 36px;
  }
  .lp-case-layout {
    gap: 26px 45px;
  }
  .lp-agent-grid {
    gap: 10px;
  }
  .lp-start-grid {
    gap: 50px;
  }
  .lp-case-intro .lp-h2 {
    font-size: clamp(30px, 3vw, 36px);
  }
}
@media (max-width: 800px) {
  .lp-hero-stage {
    min-height: 400px;
    padding-block: 34px;
  }
  .lp-lead {
    max-width: 47ch;
  }
  .lp-factory-heading {
    gap: 30px;
  }
  .factory-theatre {
    grid-template-columns: minmax(0, 1fr) minmax(290px, 0.9fr);
  }
  .factory-work {
    padding: 24px 20px;
  }
  .factory-panel h3 {
    font-size: 25px;
  }
  .factory-stations {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .lp-stage-btn {
    height: 65px;
    padding: 11px 13px;
    font-size: 13px;
    gap: 6px;
  }
  .lp-stage:nth-child(n + 6) {
    border-top: 1px solid var(--lp-line);
  }
  .lp-stage:nth-child(6) {
    border-left: 0;
  }
  .factory-memory {
    gap: 10px 16px;
    padding: 13px 20px;
    flex-wrap: wrap;
  }
  .factory-memory p {
    order: 3;
    flex-basis: 100%;
    font-size: 13px;
  }
  .lp-agents {
    grid-template-columns: 1fr;
    gap: 27px;
  }
  .lp-agent-grid {
    max-width: 560px;
  }
  .lp-demo-head {
    align-items: start;
    flex-direction: column;
    gap: 20px;
  }
  .lp-case-layout {
    gap: 26px 28px;
  }
  .lp-case-intro .lp-h2 {
    font-size: clamp(30px, 3vw, 36px);
  }
  .lp-finding {
    padding: 19px;
  }
  .lp-case-evidence > header {
    padding: 15px 19px;
    flex-wrap: wrap;
    gap: 3px;
  }
  .lp-case-links {
    padding: 16px 19px;
    gap: 15px;
  }
  .lp-start .lp-h2 {
    font-size: clamp(30px, 3vw, 36px);
  }
  .lp-start-grid {
    gap: 35px;
  }
  .lp-start-steps > li {
    gap: 17px;
  }
  .lp-start-steps h3 {
    font-size: 18px;
  }
}
@media (max-width: 620px) {
  .lp-wrap {
    padding-inline: 22px;
  }
  .lp-topbar-inner {
    min-height: 62px;
  }
  .lp-hero-stage {
    padding: 43px 0 45px;
    min-height: 0;
  }
  .lp-hero .lp-kicker {
    margin-bottom: 20px;
    font-size: 12px;
  }
  .lp-display {
    font-size: clamp(37px, 10.4vw, 60px);
    letter-spacing: -0.05em;
    line-height: 1.05;
  }
  .lp-lead {
    font-size: 15px;
    line-height: 1.65;
    margin-top: 21px;
  }
  .lp-cta-row {
    gap: 9px;
    margin-top: 25px;
  }
  .lp-cta-row .lp-btn {
    padding: 12px 16px;
    gap: 12px;
    font-size: 13px;
  }
  .lp-hive-mask {
    background: linear-gradient(
      90deg,
      rgba(var(--lp-hero-mask), 0.88),
      rgba(var(--lp-hero-mask), 0.55)
    );
  }
  .lp-section {
    padding-block: 57px;
  }
  .lp-factory {
    padding: 0 0 52px;
  }
  .lp-factory-heading {
    display: block;
    margin-bottom: 22px;
  }
  .lp-factory-heading .lp-h2 {
    font-size: clamp(30px, 3vw, 36px);
    max-width: 22ch;
    margin-bottom: 11px;
  }
  .lp-factory-heading .lp-sub {
    font-size: 13px;
    max-width: 32ch;
  }
  .lp-line {
    border-radius: 8px;
  }
  .factory-toolbar {
    min-height: 52px;
    padding: 0 15px;
    font-size: 12px;
  }
  .lp-line-toggle {
    min-width: 75px;
    font-size: 11px;
    padding: 7px 9px;
    min-height: 36px;
  }
  .factory-theatre {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  .factory-viewport {
    height: 245px;
  }
  .factory-svg {
    min-height: 0;
    height: 100%;
  }
  .factory-caption {
    left: 16px;
    right: 16px;
    bottom: 14px;
    font-size: 14px;
  }
  .factory-work {
    border-left: 0;
    border-top: 1px solid var(--lp-line);
    padding: 22px;
    min-height: 364px;
    box-sizing: border-box;
  }
  .work-stage {
    margin-bottom: 13px;
    font-size: 13px;
  }
  .factory-panel h3 {
    font-size: 26px;
    max-width: none;
  }
  .work-description {
    margin-bottom: 18px;
    font-size: 14px;
    max-width: 38ch;
  }
  .work-request,
  .work-pr {
    padding: 14px;
  }
  .factory-panel h4 {
    font-size: 18px;
  }
  .work-request p {
    font-size: 13px;
    margin-bottom: 13px;
  }
  .work-question {
    font-size: 12px;
  }
  .work-checklist {
    margin-top: 16px;
  }
  .work-plan li {
    font-size: 13px;
    padding: 10px 0;
  }
  .work-wiki {
    padding: 10px 12px;
    margin-top: 13px;
  }
  .work-wiki strong {
    font-size: 12px;
  }
  .work-review {
    padding: 13px;
  }
  .work-review h4 {
    font-size: 18px;
  }
  .work-review > p {
    font-size: 13px;
  }
  .work-review-head {
    font-size: 12px;
  }
  .work-review-fix {
    font-size: 12px;
  }
  .work-review-track {
    margin-top: 13px;
  }
  .work-captures {
    min-height: 165px;
  }
  .work-result {
    padding: 11px 0 17px;
  }
  .work-result h4 {
    margin-block: 12px 8px;
  }
  .factory-memory {
    padding: 13px 16px;
    gap: 4px 12px;
  }
  .factory-memory-label {
    font-size: 13px;
  }
  .factory-memory-state {
    font-size: 13px;
  }
  .factory-memory p {
    font-size: 13px;
    line-height: 1.6;
  }
  .factory-stations {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .lp-stage-btn {
    height: 53px;
    flex-direction: row;
    align-items: center;
    padding: 10px 9px;
    gap: 6px;
    font-size: 13px;
  }
  .stage-index {
    font-size: 11px;
  }
  .lp-stage:nth-child(n + 4) {
    border-top: 1px solid var(--lp-line);
  }
  .lp-stage:nth-child(3n + 1) {
    border-left: 0;
  }
  .lp-stage:nth-child(6) {
    border-left: 1px solid var(--lp-line);
  }
  .lp-benefits-heading {
    font-size: clamp(30px, 3vw, 36px);
    margin-bottom: 29px;
  }
  .lp-benefit-pair {
    grid-template-columns: 1fr;
    gap: 33px;
  }
  .lp-benefit + .lp-benefit {
    padding: 30px 0 0;
    border-left: 0;
    border-top: 1px solid var(--lp-line);
  }
  .lp-loop-diagram {
    max-width: 400px;
    height: 105px;
    padding-inline: 4px;
  }
  .lp-loop-diagram svg {
    top: 4px;
  }
  .lp-loop-diagram span {
    font-size: 11px;
    padding: 6px 8px;
  }
  .lp-benefit > .lp-kicker {
    margin-top: 23px;
  }
  .lp-benefit h3 {
    font-size: 26px;
  }
  .lp-benefit > p:not(.lp-kicker) {
    font-size: 14px;
    max-width: 40ch;
  }
  .lp-memory-example {
    min-height: 138px;
    max-width: 100%;
  }
  .lp-agents {
    margin-top: 35px;
    padding-top: 32px;
    gap: 21px;
  }
  .lp-agents h3 {
    font-size: 24px;
    max-width: 22ch;
  }
  .lp-agents p:not(.lp-kicker) {
    font-size: 14px;
  }
  .lp-agent-card {
    min-height: 56px;
    padding: 10px 14px;
    gap: 10px;
  }
  .lp-agent-mark {
    width: 32px;
    height: 32px;
    border-radius: 7px;
  }
  .lp-agent-mark svg {
    width: 18px;
    height: 18px;
  }
  .lp-agent-name {
    font-size: 14px;
  }
  .lp-case-layout {
    grid-template-columns: 1fr;
    gap: 25px;
  }
  .lp-case-intro .lp-h2 {
    font-size: clamp(30px, 3vw, 36px);
    max-width: 17ch;
  }
  .lp-case-intro > .lp-sub {
    font-size: 14px;
  }
  .lp-original {
    margin: 18px 0;
  }
  .lp-case-result {
    margin: 19px 0 10px;
  }
  .lp-case-limit {
    font-size: 11px;
    max-width: 46ch;
  }
  .lp-case-evidence > header {
    flex-wrap: nowrap;
    padding: 15px 17px;
    font-size: 11px;
  }
  .lp-case-evidence > header > span:last-child {
    font-size: 9px;
  }
  .lp-finding {
    padding: 20px 17px;
  }
  .lp-finding h3 {
    font-size: 19px;
  }
  .lp-case-links {
    padding: 16px 17px;
    gap: 20px;
  }
  .lp-explore {
    margin: 0;
  }
  .lp-demo {
    padding-block: 53px;
  }
  .lp-demo .lp-h2 {
    font-size: clamp(30px, 3vw, 36px);
    max-width: 17ch;
  }
  .lp-demo .lp-sub {
    font-size: 13px;
  }
  .lp-demo-frame {
    width: calc(100% - 28px);
    border-radius: 7px;
  }
  .lp-start-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .lp-start .lp-h2 {
    font-size: clamp(30px, 3vw, 36px);
  }
  .lp-start .lp-sub {
    font-size: 14px;
  }
  .lp-start-steps > li {
    gap: 23px;
    padding-block: 22px;
  }
  .lp-start-steps h3 {
    font-size: 19px;
  }
  .lp-start-steps p {
    font-size: 14px;
  }
  .lp-start-note {
    font-size: 11px;
  }
}
@media (max-width: 350px) {
  .lp-wrap {
    padding-inline: 17px;
  }
  .lp-display {
    font-size: 35px;
  }
  .lp-cta-row .lp-btn {
    font-size: 12px;
    padding: 12px 13px;
  }
  .factory-work {
    padding: 20px 17px;
    min-height: 390px;
  }
  .factory-viewport {
    height: 226px;
  }
  .factory-panel h3 {
    font-size: 24px;
  }
  .lp-stage-btn {
    font-size: 13px;
    padding-inline: 7px;
    gap: 4px;
  }
  .factory-toolbar {
    padding-inline: 12px;
  }
  .factory-memory {
    padding-inline: 13px;
  }
  .factory-caption {
    left: 13px;
    right: 13px;
    font-size: 14px;
  }
  .work-review h4 {
    font-size: 17px;
  }
  .lp-agent-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .lp-case-intro .lp-h2 {
    font-size: clamp(30px, 3vw, 36px);
  }
  .lp-case-evidence > header {
    gap: 8px;
    font-size: 10px;
  }
  .lp-case-evidence > header > span:last-child {
    font-size: 8px;
  }
  .lp-case-links {
    gap: 16px;
    font-size: 11px;
  }
  .lp-start .lp-h2 {
    font-size: clamp(30px, 3vw, 36px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .lp-line *,
  .lp-line *::before,
  .lp-line *::after {
    transition: none !important;
  }
  .demo-landing {
    scroll-behavior: auto;
  }
}

/* Fixed-height work surfaces keep stage changes from shifting the page. */
.factory-caption {
  background: var(--lp-bg);
  padding: 7px 0;
  bottom: 12px;
}
.review-patch {
  font:
    11px/1.65 ui-monospace,
    monospace;
  margin: 8px 0 12px;
  overflow-wrap: anywhere;
}
.review-patch code {
  background: none;
  font: inherit;
  padding: 0;
}
.review-patch del,
.review-patch ins {
  display: block;
  text-decoration: none;
}
.review-patch del {
  color: var(--lp-ink-faint);
}
.review-patch ins,
.code-add {
  color: var(--lp-accent-ink);
}
@media (max-width: 620px) {
  .factory-work {
    min-height: 440px;
  }
  .factory-caption {
    bottom: 8px;
    padding-block: 5px;
  }
}
@media (max-width: 350px) {
  .factory-work {
    min-height: 430px;
  }
}

.factory-memory-link {
  stroke: var(--lp-accent-ink);
  stroke-width: 1;
  stroke-dasharray: 3 5;
}
.factory-memory-courier {
  fill: var(--lp-accent);
  stroke: var(--lp-accent);
  stroke-dasharray: none;
}

@media (max-width: 620px) {
  .factory-memory {
    min-height: 84px;
    box-sizing: border-box;
  }
}
@media (max-width: 350px) {
  .factory-memory {
    min-height: 102px;
  }
}

.lp-hive-canvas { opacity: .45; }
.lp-hive-static { opacity: .2; }
.lp-demo-actions { display: grid; gap: 12px; }
.work-agent {
  font: 500 12px/1.5 var(--lp-display-font);
  color: var(--lp-accent-ink);
  margin: -8px 0 16px;
}
.work-agent > span { display: block; color: var(--lp-ink-muted); font-weight: 400; }
.work-stage > .work-stage-name { color: var(--lp-ink); font-size: inherit; }
.lp-agents .lp-agent-proof { max-width: 48ch; font-size: 13px; margin: 12px 0 0; }
.lp-agent-proof .lp-text-link { font-size: inherit; }
.factory-map {
  position: absolute;
  right: 14px;
  top: 14px;
  width: 150px;
  padding: 8px 10px 5px;
  border: 1px solid var(--lp-line);
  border-radius: 6px;
  background: var(--lp-bg);
  box-sizing: border-box;
  pointer-events: none;
}
.factory-map > span { font: 11px/1.3 var(--lp-display-font); color: var(--lp-ink-muted); }
.factory-map svg { display: block; width: 100%; }
.map-route { stroke: var(--lp-line-strong); stroke-width: 12; }
.map-return { stroke: var(--lp-line-strong); stroke-width: 7; stroke-dasharray: 15 15; }
.lp-line[data-review="fixing"] .map-return { stroke: var(--lp-accent-ink); }
[data-map-station] path { stroke: var(--lp-machine); stroke-width: 6; fill: var(--lp-surface-2); }
[data-map-station] text { fill: var(--lp-ink-muted); font: 500 46px var(--lp-display-font); }
[data-map-station].is-active path { fill: var(--lp-accent); stroke: var(--lp-accent); }
[data-map-station].is-active text { fill: #241c08; }
.factory-still-note, .factory-nojs {
  margin: 0;
  padding: 14px 24px;
  border-top: 1px solid var(--lp-line);
  font-size: 13px;
  line-height: 1.6;
  color: var(--lp-ink-muted);
}
.factory-still-note[hidden], .work-agent[hidden] { display: none; }
@media (max-width: 900px) {
  .factory-theatre { display: flex; flex-direction: column; min-height: 0; }
  .factory-viewport { height: 370px; }
  .factory-svg { min-height: 0; height: 100%; }
  .factory-work { border-left: 0; border-top: 1px solid var(--lp-line); min-height: 450px; box-sizing: border-box; }
  .factory-panel { width: 100%; max-width: 570px; margin-inline: auto; }
  .factory-stations { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lp-stage:nth-child(n+4) { border-top: 1px solid var(--lp-line); }
  .lp-stage:nth-child(3n+1) { border-left: 0; }
  .lp-stage:nth-child(6) { border-left: 1px solid var(--lp-line); }
  .lp-stage-btn { height: 58px; flex-direction: row; align-items: center; gap: 9px; }
}
@media (max-width: 620px) {
  .factory-viewport { height: 330px; }
  .factory-map { width: 130px; top: 10px; right: 12px; padding: 5px 8px; }
  .factory-work { min-height: 480px; }
  .lp-stage-btn { height: 62px; padding: 9px 8px; gap: 5px; }
  .lp-stage-name { overflow-wrap: normal; }
  .stage-index { font-size: 10px; }
  .factory-memory { gap: 7px 10px; min-height: 110px; }
  .factory-memory-label, .factory-memory-state { font-size: 12px; }
  .factory-memory p { font-size: 13px; }
  .factory-still-note, .factory-nojs { padding: 13px 16px; }
}
@media (max-width: 350px) {
  .factory-work { min-height: 500px; }
  .lp-stage-btn { flex-direction: column; align-items: flex-start; gap: 4px; font-size: 12px; }
  .factory-memory-state { white-space: normal; }
}

.lp-line-bees .bee-stripes { stroke: var(--lp-bg); stroke-width: 2; }
.lp-line-bees .bee-head { fill: var(--lp-accent); }