@media (max-width: 700px) {
  :root { --mobile-gutter: 12px; }

  .global-header { inset-inline: var(--mobile-gutter); }
  .global-header .brand { justify-content: space-between; gap: 12px; }
  .hero-details, .lab-caption, .field-notes__copy, .field-notes__footer,
  .colony, .silk-recovery, .press-observations, .contact-index {
    padding-inline: var(--mobile-gutter);
  }
  #robot-story .copy-stage :is(h1, h2, p) { left: var(--mobile-gutter); }
  #robot-story .copy-stage p { right: var(--mobile-gutter); }

  .intro-sequence { height: calc(100dvh + 600svh); }
  .prologue { height: calc(100dvh + var(--finale-run)); }
  .intro-sequence__stage { height: 100dvh; }
  .intro-sequence__poster, .prologue__loop-frame { object-fit: cover; }
  :is(.intro-sequence, .prologue) .archive-meta {
    inset-inline: var(--mobile-gutter);
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    font-size: clamp(8px, 2.3vw, 11px);
    white-space: nowrap;
    letter-spacing: 0;
  }
  :is(.intro-sequence, .prologue) .archive-meta span:nth-child(2) { display: none; }

  .laboratory { padding-top: 64px; }
  .lab-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.32fr) minmax(0, .72fr);
    gap: 4px;
    padding-inline: var(--mobile-gutter);
  }
  .laboratory, .lab-grid, .lab-grid .vessel { border: 0; box-shadow: none; }
  .lab-grid .vessel-view { height: clamp(190px, 58vw, 340px); }

  /* Let the cocoon travel over the center of the full-width register. */
  .colony--motion .colony__register {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    align-items: start;
  }
  .colony--motion .colony__intro { grid-column: 1 / -1; }
  .colony--motion .colony__table-scroll { grid-column: 1; grid-row: 2; min-width: 0; }
  .colony--motion .colony__motion-track {
    grid-column: 1; grid-row: 2; align-self: stretch; justify-self: center;
    position: relative; top: auto; left: auto; bottom: auto;
    width: clamp(128px, 44vw, 220px); height: auto; max-width: 100%;
    background: none; overflow: visible; transform: none;
  }
  .colony--motion .colony__motion-stage {
    position: sticky; top: max(96px, 30svh);
    width: 100%; height: auto; aspect-ratio: 640 / 880;
    margin: 0;
  }
  .colony__table-scroll,
  .colony--runner-ready .colony__table-scroll { overflow: visible; padding-bottom: 8px; }
  .colony__table { min-width: 0; }
  .colony__table col:first-child { width: 57%; }
  .colony__table col:nth-child(2) { width: 43%; }
  .colony__table :is(col, th, td):nth-child(n + 3),
  .colony__record-detail { display: none; }
  .colony__table thead th { white-space: normal; }
  .colony__table :is(th, td):nth-child(2) { text-align: right; padding-right: 8px; }
  .colony__table :is(thead, tbody) th:first-child { padding-left: 28px; }
  .colony__table tbody th { letter-spacing: .02em; font-size: 10px; }
  .colony__table tbody td { font-size: 10px; }
  .colony__table .colony__row--away td:nth-child(2) { padding-left: 0; }
  .colony__runner { width: 22px; height: 22px; }
  .colony__wanderer { display: none; }

  .swarm {
    height: 100svh;
    min-height: 0;
    max-height: none;
    display: block;
    padding: 0;
  }
  .swarm__viewport { position: absolute; inset: 0; }
  .swarm__fallback { top: 50%; width: min(calc(100% - 32px), max(80px, calc(100svh - 400px)), 380px); max-height: 100%; }
  .swarm__caption { position: absolute; top:auto; bottom:108px; width:calc(50% - 20px); transform: none; }
  .swarm__caption--current { left:var(--mobile-gutter); }
  .swarm__caption--next { right:var(--mobile-gutter); }
  .swarm__description { margin-top: 8px !important; padding-top: 6px; min-height: 0; }
  .swarm__choices { position: absolute; left:var(--mobile-gutter); right:var(--mobile-gutter); bottom:16px; height:44px; width:auto; padding:0; }
  .swarm__choice { height: 44px; }
  .swarm__choice img { width: 38px; height: 38px; }

  .material-archive__stage {
    height: 100svh;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 32px;
    padding: 62px var(--mobile-gutter) 16px;
  }
  .material-archive__strip { position: static; padding: 0; }
  .material-archive__feature {
    position: static;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: 88px minmax(0, 1fr) auto;
    gap: 16px;
  }
  .material-archive__story { display: contents; }
  .material-archive__copy { grid-row: 1; min-width:0; }
  .material-archive__media-slot {
    grid-row: 2; min-height:0; min-width:0;
    display:flex; align-items:center; justify-content:flex-end;
    container-type:size;
  }
  .material-archive__media {
    width: min(82cqw, calc(100cqh * .8035714286));
    height: auto;
    min-height: 0;
    aspect-ratio: 1440 / 1792;
    margin: 0;
  }
  .material-timeline { grid-row: 3; height: auto; }
  .recovery-notes { row-gap:48px; }
  .global-advance[data-mobile-controls="true"] { visibility: hidden; }

  /* Leave space inside the frame for a complete cutout and its vertical drift. */
  .nature__media--contain .nature__layer { inset: 9% 0; }
  .nature__media--contain .nature__layer :is(img, video) { object-fit: contain; }
  .nature__spread .nature__membrane { aspect-ratio: 2.5; }
  .thermal[data-enhanced="true"] .thermal__meta { inset-inline: var(--mobile-gutter); }
}

@media (max-width: 700px) and (max-height: 620px) {
  .material-archive__stage { padding-top: 52px; gap: 24px; }
  .material-archive__feature { gap: 12px; }
  .material-archive__category { margin-top: 4px !important; }
}

@media (max-width: 700px) and (prefers-reduced-motion: reduce) {
  .intro-sequence { height: calc(100dvh + 100svh); }
}
