[{"data":1,"prerenderedAt":18},["ShallowReactive",2],{"tag-articles-デモページ":3},[4],{"title":5,"description":6,"path":7,"tags":8,"publishedAt":16,"updatedAt":17},"社内 AI デモページ3本に Müller-Brockmann グリッドを当てる — 写真の高さがガタついたのは subgrid と box-sizing と translateY のせい","社内 AI ワークショップで作った3つのデモページ（お菓子店・美容室・飲食店）を、Müller-Brockmann グリッドシステムのスキルで12列モジュラーグリッドに乗せ替えた。最初は subgrid 継承ミスでカードが縦に並び、写真の高さも揃わず画面がガタついた。検証ハーネスを最初から回さず目視で済ませたのが直接の敗因。verify を走らせて 0px 一致まで詰めたあと、ナビ追加・サイドバー削除まで一気通貫で整えた記録。","/tsukumi-demo-grid-layout",[9,10,11,12,13,14,15],"Müller-Brockmann","グリッドデザイン","Nuxt","CSS Subgrid","box-sizing","デモページ","デザインシステム","2026-06-14T00:00:00.000Z",null,1781483286580]