/* products-v5-studio — spec-v2 §4（担当 B：VAPOR STUDIO の帯の位置・間隔・列）。products-v5-base.css の後、products-v5-hub.css の前に読む。2026-09-29 */

/* 帯の中の控えめな文字：white/42 は 15px で読みにくい（ホームの parts-v3 と同じく white/55 にそろえる） */
body.pp-v5.eh-study.s55 #studio { --pv-ink-3: rgba(255, 255, 255, 0.55); }

/* ---- 章 TIMESTAMP（≥1024：左 1/3 ＝ 文、右 2/3 ＝ 図） ---- */
body.pp-v5.eh-study.s55 #studio .pp-chapter-text { grid-column: 1; margin-top: 89px; }   /* 索引の最後のインク → ラベルのインク 96（出発の値 88 で実測 95 → 89。実測 96） */
body.pp-v5.eh-study.s55 #studio .pp-ts { grid-column: 2 / 4; margin-top: 92px; align-self: stretch; }   /* 図の上端 ＝ ラベルのインクの上端（±1）。文の列を 1 下げたので 91 → 92（実測 −0.5） */
body.pp-v5.eh-study.s55 #studio .pp-points { display: grid; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }   /* 出発の値：説明 → 手順 24 */
body.pp-v5.eh-study.s55 #studio .pp-points li {
  display: flex; align-items: baseline; gap: 16px;
  font: 500 var(--v5-fs-note) / var(--v5-lh-note) "Zen Kaku Gothic New", sans-serif; color: var(--pv-ink-2);
}
body.pp-v5.eh-study.s55 #studio .pp-points li span { flex: none; font: 600 13px/24px "Barlow Condensed", sans-serif; letter-spacing: 0.04em; color: var(--pv-ink-3); }   /* 手順の番号は章のラベル（金系）と競らせない */
body.pp-v5.eh-study.s55 #studio .pp-fnote { margin: 13px 0 0; }   /* 審査の直し（主指揮 2026-09-29）：手順 → 注記 24（手順どうしの 19 より広くし、4 つ目の手順に見えないように） */
@media (max-width: 767px) { body.pp-v5.eh-study.s55 #studio .pp-fnote { margin-top: 14px; } }
body.pp-v5.eh-study.s55 #studio .pp-ts > .pv-note {
  margin: 2.5px 0 0;                /* 図の下端 → 注記のインク 8（出発の値 5 で実測 11.5 → 2.5。実測 7.5） */
  /* 追加 2（担当 B の監督の判断）：注記の字を S4（15/24、スマホ 14/20）にする。A の base の .pv-band .pv-note は詳細度 (0,5,1) で、
     後から読まれる type-floor-v1.css の :is(#products, .pv-band) .pv-note（(1,3,1)、16px/1.7、600 以下は 15px）に負けるため。値は A の変数だけを使う */
  font-size: var(--v5-fs-note); line-height: var(--v5-lh-note);
}

/* ---- 章 THUMBNAIL・POST（全幅。組の上に見出しの塊、見本の上端をそろえる） ---- */
body.pp-v5.eh-study.s55 #studio .pp-tpl { grid-column: 1 / -1; margin-top: 88px; }   /* TIMESTAMP の最後のインク（注記）→ ラベル 96（注記 15/24 で実測 96。88 のまま） */
body.pp-v5.eh-study.s55 #studio .pv-tpl { grid-template-rows: auto auto; row-gap: 0; }
body.pp-v5.eh-study.s55 #studio .pv-tpl-group { display: grid; grid-row: 1 / span 2; grid-template-rows: subgrid; }
body.pp-v5.eh-study.s55 #studio .pv-tpl-group > .pp-cap { grid-row: 1; align-self: start; margin: 0 0 18.5px; }   /* 説明のインク → 見本の上端 24（POST 側で測る。THUMBNAIL 側は説明が 1 行短いぶん広い）。出発の値 17 で実測 22.5 → 18.5（実測 24） */
body.pp-v5.eh-study.s55 #studio .pv-tpl-group > .pv-tpl-row { grid-row: 2; align-self: start; }
/* 列の幅の式（サムネ 69%・ポスト 31%、隙間 16／32）と見本の名前（products-parts-v1.css の行 16 ＋ type-floor-v1.css:333 の 14px ＝ 14/16）はそのまま。
   見本の名前を 15 にすると 1024 で「カラーブロック おは／V」と語の途中で折れるため、仕様書 1 章の「そのまま」を採る（監督の実測、2026-09-29） */

/* ---- 帯の最後のインク（見本の名前）→ 帯の端 96 ---- */
body.pp-v5.eh-study.s55 #studio.pv-band { padding-bottom: 95px; }   /* 見本の名前 14/16 のインク → 帯の端 96（A の題 → 説明の直しでテンプレートの見出しが 1.5 高くなり、94.5 のままだと 1440 で 94.6 → 95。仮当てで 1440・1024・768 が 95.1・95.9・96.7） */

/* ---- 768〜1023：章 TIMESTAMP を縦に積む（文 → 図） ---- */
@media (max-width: 1023px) {
  body.pp-v5.eh-study.s55 #studio .pp-chapter-text { grid-column: 1 / -1; }
  body.pp-v5.eh-study.s55 #studio .pp-ts { grid-column: 1 / -1; margin-top: 19px; }   /* 注記のインク → 図の上端 24（768 で実測 23.5。19 のまま） */
}

/* ---- スマホ ---- */
@media (max-width: 767px) {
  body.pp-v5.eh-study.s55 #studio .pp-chapter-text { margin-top: 56px; }   /* 索引 → ラベル 64（実測 64） */
  body.pp-v5.eh-study.s55 #studio .pp-points { margin-top: 6px; }          /* 説明 → 手順 16 */
  body.pp-v5.eh-study.s55 #studio .pp-ts { margin-top: 13.5px; }           /* 注記 → 図 16（出発の値 11 で実測 14 → 13。A の直しの後に実測 15 → 13.5。仮当てで 15.5） */
  body.pp-v5.eh-study.s55 #studio .pp-ts > .pv-note { margin-top: 4px; }   /* 図の下端 → 注記のインク 8（注記 14/20。実測 8） */
  body.pp-v5.eh-study.s55 #studio .pp-tpl { margin-top: 58px; }            /* 注記 → ラベル 64（注記 14/20 で 56 のとき実測 62.5 → 57.5。A の直しの後に実測 63 → 58。仮当てで 64） */
  body.pp-v5.eh-study.s55 #studio .pv-tpl { grid-template-rows: none; row-gap: 32px; }
  body.pp-v5.eh-study.s55 #studio .pv-tpl-group { grid-row: auto; grid-template-rows: auto auto; }
  body.pp-v5.eh-study.s55 #studio .pv-tpl-group > .pp-cap { margin-bottom: 10.5px; }   /* 説明 → 見本 16（出発の値 9 で実測 14.5 → 10.5。実測 16） */
  body.pp-v5.eh-study.s55 #studio.pv-band { padding-bottom: 62.5px; }     /* 最後のインク（見本の名前 14/16）→ 帯の端 64（実測 64） */
}