左カラム
カード A
トップの intro-card 相当の置き場です。
下の
#sg-stair-lab のみ。白い階段形は
.sg-stair-backdrop。本文は
.intro-panel--sg-lab(マスクなし)。viewBox
450×320 基準で R / Y / X を動的生成。768px 以下は角丸に。本番のトップ
イントロに反映するには、プリセットを読み込み・調整のうえ「トップ用 JSON
書き出し」で src/data/intro-stair-preset.json を置き換え、"enabled": true に。
タブごとに X 幅% / Y 高 を個別調整。バックドロップ全体寸 = ベース寸 + 各タブの Y 高合計(左右合計を幅に、上下合計を高さに加算)。
OFF のときは白背景
左の操作で表示中の階段パラメータ(保存済みプリセットを「読込」した状態含む)を
intro-stair-preset.json 形式で保存。リポジトリの
src/data/intro-stair-preset.json に上書きし、enabled: true にしてビルドするとトップに反映。
「AI向けドキュメント書き出し」は、現在の設定JSONと階段マスクのコアスクリプト抜粋を 1つのMarkdownにまとめて保存します(他AIへ共有用)。
上タブ
下タブ
左タブ
右タブ
ラボ専用生成パス。トップ
.intro-panel とは非連動
左カラム
トップの intro-card 相当の置き場です。
右カラム
2 カラムでグリッドの破綻も確認できます。