Grid Attack第63关CSS Grid红块适配红框解法求助

游玩Coding Fantasy: Grid Attack第63关时已卡关数小时，尝试了各类CSS Grid写法都未通过，该游戏不提供关卡参考答案也不支持跳关，特此求助正确解法。
本次关卡需求：将红色地块精准放入对应红色边框区域内

关卡现有代码 #

HTML #

<div id="field">
  <div class="greenLand"></div>
  <div class="redLand"></div>
  <div class="greenLand"></div>
  <div class="redLand"></div>
</div>

CSS #

#field {
  display: grid;
  gap: 15px;
  grid-template: 1fr 1fr / 200px 1fr;
}
.redLand {
    
}

关卡参考示意图 #

关卡要求补全.redLand选择器内的CSS样式，满足布局要求。

只需要在.redLand中添加如下样式即可通关：

.redLand {
  grid-column: 2;
}

实现逻辑：当前父容器已经定义了2行2列的网格结构：2个等高行，第一列固定宽200px，第二列自适应剩余宽度。DOM元素顺序为绿块→红块→绿块→红块，给红块设置grid-column: 2指定其始终位于第二列后，Grid自动放置规则会按顺序填充空位：第一个绿块占第一行第一列，第一个红块占第一行第二列；第一行占满后第二个绿块自动流入第二行第一列，第二个红块匹配规则占据第二行第二列，刚好实现左列全绿、右列全红的布局，红色块完全匹配对应红色边框区域。

内容的提问来源于stack exchange，提问作者Wikouthw