/* ============================================================
   style.css — Botanical Growth（京都府立植物園 夜間事業／グロースモデル説明資料）
   設計方針:
   - 各 .page = A4横(297:210)。container-type:inline-size を持ち、
     内部の文字・余白はすべて cqw(ページ幅の%) で指定。
     → 画面でも印刷(A4横)でもレイアウト比率が完全に一致する。
   - トーンはライトアップ提案 ver04 を継承（紙の白・墨・深緑）。
   - データ／ダッシュボードも青系SaaSにせず、墨＋深緑＋秋の橙で表現する。
   ============================================================ */

:root {
  /* 紙と墨 */
  --paper: #fcfcfa;
  --paper-2: #f4f4f0;
  --paper-3: #eeeeea;
  --ink: #14171a;
  --ink-2: #565e64;
  --ink-3: #949a9e;
  --ink-4: #c4c8c9;
  --line: #e2e3de;
  --line-2: #eceded;

  /* アクセント（深い葉の緑） */
  --green: #1d4d3b;
  --green-2: #2f6b53;
  --green-3: #5c9179;
  --green-pale: #eef3f0;
  --gold: #a4874f;

  /* 季節（秋＝橙／春＝桜） */
  --autumn: #b06a2c;
  --autumn-pale: #f7efe6;
  --spring: #c1798f;
  --spring-pale: #f7eef1;
  --alert: #9d5232;

  /* 書体 */
  --mincho: 'Noto Serif JP', 'Hiragino Mincho ProN', 'Yu Mincho', serif;
  --sans: 'Noto Sans JP', -apple-system, BlinkMacSystemFont,
          'Hiragino Kaku Gothic ProN', 'Yu Gothic', Meiryo, sans-serif;
  --en: 'Inter', 'Helvetica Neue', Arial, sans-serif;

  --page-max: 1160px;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }

body {
  font-family: var(--sans);
  color: var(--ink);
  background: #d7d8d3;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}

/* ============================ ページ枠 ============================ */
.sheet {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 22px;
  padding: 78px 16px 90px;
}

.page {
  position: relative;
  width: 100%;
  max-width: var(--page-max);
  aspect-ratio: 297 / 210;
  background: var(--paper);
  container-type: inline-size;
  overflow: hidden;
  isolation: isolate;
  box-shadow: 0 14px 44px rgba(18, 22, 20, .14);
}

.pad {
  position: absolute;
  inset: 0;
  padding: 4.4cqw 5.6cqw 4.2cqw;
  display: flex;
  flex-direction: column;
}
.pad.wide { padding-left: 4.2cqw; padding-right: 4.2cqw; }
.pad.dash { padding: 3.4cqw 3.6cqw 3.6cqw; }

/* ページ見出し */
.phead {
  display: flex;
  align-items: baseline;
  gap: 1.5cqw;
  padding-bottom: 1.1cqw;
  border-bottom: 1px solid var(--line);
  flex: 0 0 auto;
}
.phead .pnum {
  font-family: var(--en);
  font-weight: 500;
  font-size: 1.45cqw;
  letter-spacing: .1em;
  color: var(--green);
}
.phead .ptitle {
  font-family: var(--mincho);
  font-weight: 500;
  font-size: 1.85cqw;
  letter-spacing: .12em;
}
.phead .peng {
  font-family: var(--en);
  font-weight: 400;
  font-size: .95cqw;
  letter-spacing: .22em;
  color: var(--ink-3);
  text-transform: uppercase;
  margin-left: auto;
}

/* 小見出し／ラベル */
.eyebrow {
  font-family: var(--en);
  font-size: .88cqw;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--ink-3);
}
.label-jp { font-size: 1.05cqw; letter-spacing: .14em; color: var(--green); font-weight: 500; }

.statement {
  font-family: var(--mincho);
  font-weight: 300;
  font-size: 3.5cqw;
  line-height: 1.55;
  letter-spacing: .04em;
}
.statement.md { font-size: 2.6cqw; }
.statement.sm { font-size: 2.1cqw; line-height: 1.6; }
.statement em { font-style: normal; color: var(--green); font-weight: 500; }
.statement .thin { color: var(--ink-3); }

.lead {
  font-size: 1.26cqw;
  line-height: 2.0;
  color: var(--ink-2);
  letter-spacing: .03em;
  font-weight: 300;
}
.lead.sm { font-size: 1.06cqw; line-height: 1.95; }
.lead b { color: var(--ink); font-weight: 500; }
.note { font-size: .92cqw; line-height: 1.85; color: var(--ink-3); letter-spacing: .02em; }
.tiny { font-family: var(--en); font-size: .8cqw; letter-spacing: .16em; color: var(--ink-4); }

.folio {
  position: absolute;
  bottom: 2.05cqw; left: 5.6cqw; right: 5.6cqw;
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--en); font-size: .82cqw; letter-spacing: .18em; color: var(--ink-4);
  z-index: 4;
}
.folio .pgno { color: var(--ink-2); font-weight: 500; }
.page.dark .folio { color: rgba(255,255,255,.5); }
.page.dark .folio .pgno { color: rgba(255,255,255,.8); }

/* ============================ 表紙 ============================ */
.cover { background: #0d1210; }
.cover .cover-img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  filter: saturate(.92) contrast(1.02);
}
.cover .scrim {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(10,14,12,.60) 0%, rgba(10,14,12,.10) 32%, rgba(10,14,12,.16) 50%, rgba(8,12,10,.86) 100%);
}
.cover .cover-body {
  position: absolute; inset: 0; padding: 4.4cqw 5.6cqw;
  display: flex; flex-direction: column; justify-content: space-between; color: #fff;
}
.cover .ctop { display: flex; justify-content: space-between; align-items: flex-start; }
.cover .cmark {
  font-family: var(--en); font-size: .88cqw; letter-spacing: .3em;
  color: rgba(255,255,255,.82); text-transform: uppercase;
}
.cover .cyear { font-family: var(--en); font-size: .88cqw; letter-spacing: .22em; color: rgba(255,255,255,.7); }
.cover .clogo {
  font-family: var(--en); font-weight: 300; font-size: 5.6cqw;
  letter-spacing: .09em; line-height: 1.02; text-transform: uppercase;
}
.cover .clogo b { font-weight: 500; }
.cover h1 {
  margin: 1.6cqw 0 0;
  font-family: var(--mincho); font-weight: 300; font-size: 3.1cqw;
  letter-spacing: .17em; line-height: 1.4;
}
.cover .crule { width: 6cqw; height: 1px; background: rgba(255,255,255,.55); margin: 2.0cqw 0 1.5cqw; }
.cover .csub {
  font-family: var(--mincho); font-weight: 200; font-size: 1.6cqw;
  line-height: 1.7; letter-spacing: .08em; color: rgba(255,255,255,.9);
}
.cover .cmeta {
  display: flex; gap: 3.2cqw; align-items: baseline; margin-top: 2.2cqw;
  font-size: 1.0cqw; letter-spacing: .1em; color: rgba(255,255,255,.72); font-weight: 300;
}

/* ============================ 目次 ============================ */
.toc-grid {
  flex: 1; display: grid; grid-template-columns: 1.12fr 1fr 1fr;
  gap: 0 3.4cqw; padding-top: 2.4cqw;
}
.toc-intro .statement { font-size: 2.45cqw; }
.toc-intro .lead { margin-top: 1.6cqw; font-size: 1.06cqw; line-height: 2.0; }
.toc-col { padding-top: .5cqw; }
.toc-item {
  display: flex; gap: 1.0cqw; align-items: baseline;
  padding: .78cqw 0; border-bottom: 1px solid var(--line-2);
}
.toc-item .tn {
  font-family: var(--en); font-size: .78cqw; color: var(--green);
  width: 6.4cqw; flex: 0 0 auto; letter-spacing: .14em;
}
.toc-item .tt { font-size: 1.02cqw; letter-spacing: .04em; }
.toc-item .tp { margin-left: auto; font-family: var(--en); font-size: .84cqw; color: var(--ink-4); }
.toc-item.lead-item .tt { font-weight: 500; }
.toc-note {
  margin-top: 1.6cqw; padding: .9cqw 1.1cqw; background: var(--paper-2);
  border-left: 2px solid var(--green);
}
.toc-note .tnl { font-size: .86cqw; letter-spacing: .14em; color: var(--green); font-weight: 500; }
.toc-note p { margin: .5cqw 0 0; font-size: .82cqw; line-height: 1.85; color: var(--ink-2); font-weight: 300; }
.toc-note b { font-weight: 500; color: var(--ink); }

/* ============================ 汎用 ============================ */
.body-2col { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 3.4cqw; padding-top: 2.4cqw; }
.body-2col.narrow { gap: 2.6cqw; }
.body-2col.l { grid-template-columns: 1.2fr 1fr; }
.body-2col.r { grid-template-columns: 1fr 1.25fr; }
.body-3col { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.6cqw; padding-top: 2.4cqw; }
.body-4col { flex: 1; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.9cqw; padding-top: 2.2cqw; }
.stack { display: flex; flex-direction: column; }
.mt-a { margin-top: auto; }
.body { flex: 1; display: flex; flex-direction: column; padding-top: 2.2cqw; }

/* 数字ブロック */
.facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.2cqw; }
.fact { border-top: 2px solid var(--ink); padding-top: .9cqw; }
.fact .fv { font-family: var(--en); font-weight: 300; font-size: 3.1cqw; line-height: 1; letter-spacing: -.01em; }
.fact .fv small { font-family: var(--sans); font-size: 1.15cqw; font-weight: 400; letter-spacing: .06em; margin-left: .25cqw; }
.fact .fl { margin-top: .7cqw; font-size: .93cqw; color: var(--ink-2); letter-spacing: .07em; line-height: 1.7; }
.fact.g { border-top-color: var(--green); }
.fact.g .fv { color: var(--green); }
.fact.o { border-top-color: var(--autumn); }
.fact.o .fv { color: var(--autumn); }
.fact.q { border-top-color: var(--ink-4); }
.fact.q .fv { color: var(--ink-3); }

/* 課題 */
.issue { border-left: 2px solid var(--green); padding: .1cqw 0 .1cqw 1.3cqw; }
.issue .in { font-family: var(--en); font-size: .85cqw; color: var(--green); letter-spacing: .18em; }
.issue h4 { margin: .45cqw 0 .5cqw; font-size: 1.32cqw; letter-spacing: .05em; font-weight: 500; }
.issue p { margin: 0; font-size: .95cqw; line-height: 1.9; color: var(--ink-2); font-weight: 300; }

/* 写真 */
.ph { position: relative; overflow: hidden; background: var(--paper-2); }
.ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cap { margin-top: .6cqw; font-size: .78cqw; color: var(--ink-4); letter-spacing: .06em; line-height: 1.7; }
.bleed-right { position: absolute; top: 0; right: 0; bottom: 0; width: 42%; }
.bleed-right img { width: 100%; height: 100%; object-fit: cover; }
.bleed-bottom { position: absolute; left: 0; right: 0; bottom: 0; height: 34%; }
.bleed-bottom img { width: 100%; height: 100%; object-fit: cover; }

/* 表 */
.tbl { width: 100%; border-collapse: collapse; }
.tbl th, .tbl td { text-align: left; padding: .62cqw .7cqw; border-bottom: 1px solid var(--line); vertical-align: top; }
.tbl thead th {
  font-size: .8cqw; letter-spacing: .14em; color: var(--ink-3); font-weight: 400;
  border-bottom: 1px solid var(--ink); text-transform: uppercase;
}
.tbl td { font-size: .92cqw; line-height: 1.7; }
.tbl td.k { font-weight: 500; letter-spacing: .05em; }
.tbl td.num, .tbl th.num { font-family: var(--en); font-size: .96cqw; letter-spacing: .01em; text-align: right; }
.tbl th.num { font-family: var(--sans); }
.tbl td.goal { color: var(--green); font-weight: 500; }
.tbl tbody tr:nth-child(even) { background: rgba(0,0,0,.014); }
.tbl .sub { display: block; font-size: .76cqw; color: var(--ink-3); margin-top: .16cqw; font-weight: 400; }
.tbl tr.tot td { border-bottom: none; border-top: 1px solid var(--ink); font-weight: 500; background: none !important; }

/* 縦・横フロー */
.flow { display: flex; flex-direction: column; gap: 0; }
.flow-node {
  border: 1px solid var(--line); background: #fff; padding: .72cqw 1.1cqw;
  font-size: 1.0cqw; letter-spacing: .06em; text-align: center;
}
.flow-node.on { border-color: var(--green); background: var(--green-pale); color: var(--green); font-weight: 500; }
.flow-node.dead { border-color: var(--ink-4); color: var(--ink-3); border-style: dashed; }
.flow-arrow { height: 1.5cqw; position: relative; }
.flow-arrow::before {
  content: ""; position: absolute; left: 50%; top: 0; bottom: .35cqw;
  width: 1px; background: var(--ink-4); transform: translateX(-.5px);
}
.flow-arrow::after {
  content: ""; position: absolute; left: 50%; bottom: 0;
  width: .42cqw; height: .42cqw; border-right: 1px solid var(--ink-4); border-bottom: 1px solid var(--ink-4);
  transform: translateX(-50%) rotate(45deg);
}
.flow-arrow.g::before { background: var(--green-2); }
.flow-arrow.g::after { border-color: var(--green-2); }

.hflow { display: flex; align-items: stretch; gap: 0; }
.hnode {
  flex: 1; border: 1px solid var(--line); background: #fff; padding: 1.0cqw .8cqw;
  text-align: center; display: flex; flex-direction: column; justify-content: center; gap: .4cqw;
}
.hnode .hn { font-family: var(--en); font-size: .78cqw; letter-spacing: .18em; color: var(--ink-4); }
.hnode .ht { font-size: 1.08cqw; letter-spacing: .07em; font-weight: 500; }
.hnode .hd { font-size: .84cqw; color: var(--ink-2); line-height: 1.7; font-weight: 300; }
.hnode.on { background: var(--green); border-color: var(--green); color: #fff; }
.hnode.on .hn { color: rgba(255,255,255,.6); }
.hnode.on .hd { color: rgba(255,255,255,.82); }
.harrow { flex: 0 0 1.9cqw; position: relative; }
.harrow::before { content: ""; position: absolute; top: 50%; left: .3cqw; right: .5cqw; height: 1px; background: var(--ink-4); }
.harrow::after {
  content: ""; position: absolute; top: 50%; right: .35cqw;
  width: .38cqw; height: .38cqw; border-top: 1px solid var(--ink-4); border-right: 1px solid var(--ink-4);
  transform: translateY(-50%) rotate(45deg);
}

/* 4段階 */
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.6cqw; }
.step { border-top: 1px solid var(--line); padding-top: 1.0cqw; }
.step .sn { font-family: var(--en); font-size: .82cqw; letter-spacing: .2em; color: var(--ink-4); display: block; margin-bottom: .7cqw; }
.step h5 { margin: 0 0 .6cqw; font-family: var(--mincho); font-size: 1.55cqw; letter-spacing: .1em; font-weight: 500; }
.step p { margin: 0; font-size: .88cqw; line-height: 1.85; color: var(--ink-2); font-weight: 300; }
.step.hi { border-top-color: var(--green); border-top-width: 2px; }
.step.hi h5 { color: var(--green); }

/* 暗いページ */
.page.dark { background: #0e1412; color: #fff; }
.page.dark .phead { border-bottom-color: rgba(255,255,255,.2); }
.page.dark .phead .ptitle { color: #fff; }
.page.dark .phead .pnum { color: #8fc0a9; }
.page.dark .phead .peng { color: rgba(255,255,255,.42); }
.page.dark .statement { color: #fff; }
.page.dark .statement em { color: #9ed3b7; }
.page.dark .lead { color: rgba(255,255,255,.74); }
.page.dark .lead b { color: #fff; }
.page.dark .note { color: rgba(255,255,255,.48); }
.page.dark .eyebrow { color: rgba(255,255,255,.45); }
.page.dark .cap { color: rgba(255,255,255,.4); }

/* 全面ビジュアル（1メッセージ） */
.page.hero { background: #0b0f0d; }
.page.hero .cimg { position: absolute; inset: 0; }
.page.hero .cimg img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.9); opacity: .92; }
.page.hero::after {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: radial-gradient(120% 100% at 50% 50%, rgba(6,10,8,.34) 0%, rgba(6,10,8,.72) 70%, rgba(6,10,8,.86) 100%);
}
.page.hero .hbody {
  position: absolute; inset: 0; z-index: 2; padding: 5.6cqw 7.0cqw;
  display: flex; flex-direction: column; justify-content: center; color: #fff;
}
.page.hero .hcopy {
  font-family: var(--mincho); font-weight: 200; font-size: 3.4cqw;
  line-height: 1.62; letter-spacing: .1em;
}
.page.hero .hcopy em { font-style: normal; font-weight: 400; color: #b9dcc9; }

/* 最終ページ */
.closing { position: relative; background: #0d1210; }
.closing .cimg { position: absolute; inset: 0; }
.closing .cimg img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.5) saturate(.72); }
.closing .cbody {
  position: absolute; inset: 0; padding: 5.6cqw 7.5cqw;
  display: flex; flex-direction: column; justify-content: center; color: #fff;
}
.closing .clogo {
  font-family: var(--en); font-weight: 300; font-size: 4.6cqw;
  letter-spacing: .1em; line-height: 1.05; text-transform: uppercase;
}
.closing .clogo b { font-weight: 500; }
.closing .ccopy {
  margin-top: 2.4cqw; padding-top: 1.8cqw; border-top: 1px solid rgba(255,255,255,.28);
  font-family: var(--mincho); font-weight: 200; font-size: 2.9cqw; letter-spacing: .14em;
}
.closing .cnote { margin-top: 2.6cqw; font-size: .95cqw; line-height: 2.0; color: rgba(255,255,255,.6); font-weight: 300; letter-spacing: .06em; }

/* ============================================================
   ここから Botanical Growth 固有パーツ
   ============================================================ */

/* --- 単発 vs 循環（P03） --- */
.vs { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 3.2cqw; padding-top: 2.2cqw; }
.vscol { display: flex; flex-direction: column; }
.vshead { display: flex; align-items: baseline; gap: .9cqw; padding-bottom: .9cqw; border-bottom: 1px solid var(--line); }
.vshead .vsl { font-family: var(--en); font-size: .8cqw; letter-spacing: .2em; color: var(--ink-4); }
.vshead .vst { font-family: var(--mincho); font-size: 1.6cqw; letter-spacing: .1em; font-weight: 500; }
.vscol.good .vshead .vst { color: var(--green); }
.vscol.good .vshead { border-bottom-color: var(--green); }
.vsbody { padding-top: 1.3cqw; flex: 1; display: flex; flex-direction: column; }
.vsend {
  margin-top: auto; padding: .85cqw 1.0cqw; font-size: .95cqw; line-height: 1.8; letter-spacing: .05em;
}
.vsend.bad { background: var(--paper-2); color: var(--ink-2); }
.vsend.ok { background: var(--green); color: #fff; }

/* --- 不明点リスト（P05） --- */
.qlist { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2.6cqw; }
.qitem {
  display: flex; gap: .9cqw; align-items: baseline;
  padding: .62cqw 0; border-bottom: 1px solid var(--line-2);
}
.qitem .qm { font-family: var(--en); font-size: 1.05cqw; color: var(--ink-4); flex: 0 0 1.3cqw; }
.qitem .qt { font-size: .96cqw; letter-spacing: .04em; color: var(--ink); }
.qitem .qa { margin-left: auto; font-family: var(--en); font-size: .82cqw; letter-spacing: .1em; color: var(--ink-4); }

/* --- 循環（GROWTH CYCLE P07） --- */
.cyc { flex: 1; display: flex; flex-direction: column; padding-top: 2.0cqw; }
.cycrow { display: flex; align-items: stretch; gap: 0; }
.cycev {
  flex: 1; border: 1px solid var(--line); background: #fff; padding: 1.1cqw .9cqw;
  display: flex; flex-direction: column; gap: .35cqw; text-align: center;
}
.cycev .ce { font-family: var(--en); font-size: .8cqw; letter-spacing: .2em; color: var(--ink-4); }
.cycev .ct { font-family: var(--mincho); font-size: 1.5cqw; letter-spacing: .1em; font-weight: 500; }
.cycev .cv { font-family: var(--en); font-size: 1.25cqw; color: var(--ink); letter-spacing: .02em; }
.cycev .cd { font-size: .8cqw; line-height: 1.65; color: var(--ink-2); font-weight: 300; }
.cycev.now { border-color: var(--autumn); background: var(--autumn-pale); }
.cycev.now .ct, .cycev.now .cv { color: var(--autumn); }
.cycev.nx { border-color: var(--spring); background: var(--spring-pale); }
.cycev.nx .ct, .cycev.nx .cv { color: var(--spring); }
.cycev.fut { border-style: dashed; border-color: var(--ink-4); }
.cycev.fut .ct, .cycev.fut .cv { color: var(--ink-3); }
.cycln { flex: 0 0 6.0cqw; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .3cqw; padding: 0 .4cqw; }
.cycln .cll { font-family: var(--en); font-size: .74cqw; letter-spacing: .16em; color: var(--green); text-align: center; line-height: 1.5; }
.cycln .clar { width: 100%; height: 1px; background: var(--green-2); position: relative; }
.cycln .clar::after {
  content: ""; position: absolute; right: 0; top: 50%;
  width: .38cqw; height: .38cqw; border-top: 1px solid var(--green-2); border-right: 1px solid var(--green-2);
  transform: translateY(-50%) rotate(45deg);
}
.cycln .clj { font-size: .74cqw; letter-spacing: .04em; color: var(--ink-3); text-align: center; line-height: 1.5; }
.cycback {
  margin-top: 1.5cqw; border: 1px dashed var(--green-2); border-top: none;
  height: 2.6cqw; position: relative;
}
.cycback span {
  position: absolute; left: 50%; top: -.7cqw; transform: translateX(-50%);
  background: var(--paper); padding: 0 1.0cqw;
  font-family: var(--en); font-size: .8cqw; letter-spacing: .18em; color: var(--green-2);
}

/* --- 7ステップの環（P08） --- */
.ring { flex: 1; display: grid; grid-template-columns: 1.05fr 1fr; gap: 3.0cqw; padding-top: 1.8cqw; align-items: center; }
.ring svg { width: 100%; height: auto; display: block; }
.ringtxt { display: flex; flex-direction: column; }
.rstep {
  display: flex; gap: 1.0cqw; align-items: flex-start;
  padding: .58cqw 0; border-top: 1px solid var(--line-2);
}
.rstep:first-child { border-top: none; }
.rstep .rn { font-family: var(--en); font-size: .82cqw; letter-spacing: .16em; color: var(--green); flex: 0 0 5.6cqw; padding-top: .18cqw; }
.rstep .rt { font-size: .92cqw; line-height: 1.7; color: var(--ink-2); font-weight: 300; }
.rstep .rt b { color: var(--ink); font-weight: 500; }

/* --- ステップ詳細表（P09） --- */
.who { display: flex; flex-wrap: wrap; gap: .3cqw; }
.who span {
  font-size: .74cqw; letter-spacing: .06em; padding: .12cqw .42cqw;
  border: 1px solid var(--line); color: var(--ink-2); background: #fff; white-space: nowrap;
}
.who span.us { border-color: var(--green); color: var(--green); background: var(--green-pale); }

/* ============================================================
   ダッシュボードUIモック（アプリとして成立させる）
   ============================================================ */
.app {
  flex: 1; display: grid; grid-template-columns: 12.2cqw 1fr;
  border: 1px solid var(--ink-4); background: #fff; overflow: hidden;
  box-shadow: 0 .3cqw 1.4cqw rgba(20,23,26,.07);
}
/* サイドバー */
.aside {
  background: #121815; color: #fff; padding: 1.05cqw .85cqw; display: flex; flex-direction: column;
}
.aside .alogo { font-family: var(--en); font-size: .92cqw; letter-spacing: .16em; line-height: 1.35; font-weight: 500; }
.aside .alogo span { display: block; font-size: .62cqw; letter-spacing: .22em; color: rgba(255,255,255,.42); font-weight: 400; margin-top: .18cqw; }
.aside .asel {
  margin-top: .95cqw; border: 1px solid rgba(255,255,255,.22); border-radius: .16cqw;
  padding: .38cqw .5cqw; display: flex; align-items: center; justify-content: space-between;
}
.aside .asel b { font-family: var(--en); font-size: .74cqw; letter-spacing: .1em; font-weight: 500; }
.aside .asel i { font-style: normal; font-size: .6cqw; color: rgba(255,255,255,.5); }
.anav { margin-top: 1.0cqw; display: flex; flex-direction: column; gap: .06cqw; }
.anav .agr {
  font-family: var(--en); font-size: .58cqw; letter-spacing: .2em; color: rgba(255,255,255,.32);
  margin: .7cqw 0 .3cqw .3cqw;
}
.anav a {
  display: flex; align-items: center; gap: .45cqw; text-decoration: none;
  padding: .34cqw .45cqw; border-radius: .16cqw;
  font-size: .74cqw; letter-spacing: .05em; color: rgba(255,255,255,.66);
}
.anav a i { font-style: normal; width: .6cqw; height: .6cqw; flex: 0 0 auto; opacity: .55; }
.anav a i svg { width: 100%; height: 100%; display: block; }
.anav a.on { background: rgba(255,255,255,.1); color: #fff; box-shadow: inset .12cqw 0 0 var(--green-3); }
.anav a.on i { opacity: 1; }
.aside .afoot {
  margin-top: auto; padding-top: .8cqw; border-top: 1px solid rgba(255,255,255,.14);
  font-size: .62cqw; line-height: 1.6; color: rgba(255,255,255,.4);
}
.aside .afoot b { color: rgba(255,255,255,.7); font-weight: 500; display: block; font-size: .68cqw; }

/* メイン */
.amain { display: flex; flex-direction: column; min-width: 0; background: var(--paper); }
.atop {
  display: flex; align-items: center; gap: .9cqw;
  padding: .78cqw 1.1cqw; border-bottom: 1px solid var(--line); background: #fff;
}
.atop h3 { margin: 0; font-size: 1.02cqw; letter-spacing: .08em; font-weight: 500; }
.atop .abc { font-family: var(--en); font-size: .66cqw; letter-spacing: .16em; color: var(--ink-4); }
.atop .aright { margin-left: auto; display: flex; align-items: center; gap: .5cqw; }
.chip {
  font-family: var(--en); font-size: .66cqw; letter-spacing: .1em;
  padding: .24cqw .55cqw; border: 1px solid var(--line); color: var(--ink-2); background: #fff; border-radius: .16cqw;
}
.chip.on { border-color: var(--ink); color: var(--ink); font-weight: 500; }
.chip.g { border-color: var(--green); color: var(--green); background: var(--green-pale); }
.chip.live { border-color: var(--autumn); color: var(--autumn); background: var(--autumn-pale); display: flex; align-items: center; gap: .3cqw; }
.chip.live::before { content: ""; width: .3cqw; height: .3cqw; border-radius: 50%; background: var(--autumn); }
.abody { flex: 1; padding: 1.0cqw 1.1cqw; display: flex; flex-direction: column; gap: .85cqw; min-height: 0; }

/* KPIタイル */
.tiles { display: grid; grid-template-columns: repeat(6, 1fr); gap: .7cqw; }
.tile { background: #fff; border: 1px solid var(--line); padding: .68cqw .72cqw; display: flex; flex-direction: column; gap: .3cqw; }
.tile .tl { font-family: var(--en); font-size: .6cqw; letter-spacing: .16em; color: var(--ink-3); text-transform: uppercase; }
.tile .tv { font-family: var(--en); font-weight: 300; font-size: 1.72cqw; line-height: 1.05; letter-spacing: -.01em; }
.tile .tv small { font-family: var(--sans); font-size: .7cqw; font-weight: 400; letter-spacing: .04em; color: var(--ink-2); margin-left: .16cqw; }
.tile .td { font-size: .62cqw; color: var(--ink-3); letter-spacing: .03em; line-height: 1.5; }
.tile.big { grid-column: span 2; }
.tile.up .tv { color: var(--green); }
.tile.warn { border-color: var(--autumn); background: var(--autumn-pale); }
.tile.warn .tv { color: var(--autumn); }
.tile.warn .tl { color: var(--autumn); }
/* メーター */
.meter { height: .34cqw; background: var(--paper-3); position: relative; margin-top: .12cqw; }
.meter i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--green); display: block; }
.meter i.o { background: var(--autumn); }
.meter .mk { position: absolute; top: -.14cqw; bottom: -.14cqw; width: 1px; background: var(--ink); }
.tile .tpc { display: flex; justify-content: space-between; font-family: var(--en); font-size: .58cqw; color: var(--ink-3); letter-spacing: .06em; }

/* パネル */
.panels { flex: 1; display: grid; gap: .8cqw; min-height: 0; }
.panels.c2 { grid-template-columns: 1.45fr 1fr; }
.panels.c3 { grid-template-columns: repeat(3, 1fr); }
.panels.c22 { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; }
.panel { background: #fff; border: 1px solid var(--line); display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.panel > header {
  display: flex; align-items: baseline; gap: .55cqw;
  padding: .5cqw .7cqw; border-bottom: 1px solid var(--line-2);
}
.panel > header h4 { margin: 0; font-size: .78cqw; letter-spacing: .08em; font-weight: 500; }
.panel > header .ph2 { font-family: var(--en); font-size: .6cqw; letter-spacing: .14em; color: var(--ink-4); }
.panel > header .pr { margin-left: auto; display: flex; gap: .35cqw; align-items: center; }
.pbody { flex: 1; padding: .62cqw .7cqw; min-height: 0; display: flex; flex-direction: column; }
.pbody.p0 { padding: 0; }

/* アプリ内テーブル */
.atbl { width: 100%; border-collapse: collapse; }
.atbl th, .atbl td { padding: .3cqw .5cqw; text-align: left; white-space: nowrap; }
.atbl thead th {
  font-size: .58cqw; letter-spacing: .12em; color: var(--ink-3); font-weight: 400; text-transform: uppercase;
  border-bottom: 1px solid var(--line); background: var(--paper-2);
}
.atbl tbody td { font-size: .68cqw; border-bottom: 1px solid var(--line-2); color: var(--ink); }
.atbl td.n, .atbl th.n { font-family: var(--en); text-align: right; letter-spacing: 0; }
.atbl td.ch { display: flex; align-items: center; gap: .35cqw; }
.atbl td.ch em { font-style: normal; width: .42cqw; height: .42cqw; display: inline-block; flex: 0 0 auto; }
.atbl tbody tr.hi { background: var(--green-pale); }
.atbl tbody tr.hi td { color: var(--green); font-weight: 500; }
.atbl tbody tr.lo td { color: var(--ink-3); }
.atbl tfoot td { font-size: .68cqw; font-family: var(--en); border-top: 1px solid var(--ink); padding: .34cqw .5cqw; font-weight: 500; }
.atbl tfoot td.jp { font-family: var(--sans); }
.atbl .bar { height: .3cqw; background: var(--green-3); display: block; }
.atbl .bar.o { background: var(--autumn); }
.atbl .bar.q { background: var(--ink-4); }
.badge {
  font-family: var(--en); font-size: .56cqw; letter-spacing: .08em; padding: .06cqw .3cqw;
  border: 1px solid currentColor; color: var(--green);
}
.badge.o { color: var(--autumn); }
.badge.q { color: var(--ink-3); }

/* チャート */
.chart { flex: 1; min-height: 0; display: flex; }
.chart svg { width: 100%; height: 100%; display: block; }
.legend { display: flex; gap: .7cqw; flex-wrap: wrap; padding-top: .35cqw; }
.legend span { display: flex; align-items: center; gap: .25cqw; font-size: .6cqw; color: var(--ink-3); letter-spacing: .04em; }
.legend i { width: .55cqw; height: .18cqw; display: inline-block; }

/* アプリ内リスト（施策ログ / LEARNINGS） */
.alog { display: flex; flex-direction: column; }
.alog li { list-style: none; }
.alogrow {
  display: flex; gap: .5cqw; align-items: flex-start;
  padding: .4cqw 0; border-bottom: 1px solid var(--line-2);
}
.alogrow .ad { font-family: var(--en); font-size: .6cqw; color: var(--ink-4); flex: 0 0 3.0cqw; padding-top: .1cqw; letter-spacing: .04em; }
.alogrow .at { font-size: .68cqw; line-height: 1.55; color: var(--ink); }
.alogrow .at span { display: block; font-size: .6cqw; color: var(--ink-3); margin-top: .1cqw; }
.alogrow .ar { margin-left: auto; }

/* 注記（アプリ図の外） */
.appnote {
  margin-top: .9cqw; display: flex; gap: 1.6cqw; align-items: baseline;
  font-size: .8cqw; line-height: 1.75; color: var(--ink-3); letter-spacing: .02em;
}
.appnote .anl { font-family: var(--en); font-size: .74cqw; letter-spacing: .18em; color: var(--green); flex: 0 0 auto; }
.appnote b { color: var(--ink-2); font-weight: 500; }

/* --- DATA → DECISION → ACTION（P14） --- */
.dda { flex: 1; display: flex; flex-direction: column; gap: .85cqw; padding-top: 2.0cqw; }
.ddahead { display: grid; grid-template-columns: 1.05fr 1fr 1fr .78fr; gap: 1.2cqw; }
.ddahead div { font-family: var(--en); font-size: .76cqw; letter-spacing: .2em; color: var(--ink-4); padding-bottom: .35cqw; border-bottom: 1px solid var(--ink); }
.ddarow {
  display: grid; grid-template-columns: 1.05fr 1fr 1fr .78fr; gap: 1.2cqw;
  padding: .82cqw 0; border-bottom: 1px solid var(--line-2); align-items: start;
}
.ddarow .dcell { font-size: .9cqw; line-height: 1.7; color: var(--ink-2); font-weight: 300; }
.ddarow .dcell b { color: var(--ink); font-weight: 500; }
.ddarow .dcell.act { color: var(--green); }
.ddarow .dcell.act b { color: var(--green); }
.ddarow .dcell .dnum { font-family: var(--en); }
.ddarow .dcell.when { font-size: .82cqw; color: var(--ink-3); }
.ddafoot {
  margin-top: auto; padding: .9cqw 1.1cqw; background: var(--green-pale);
  display: flex; gap: 1.4cqw; align-items: baseline;
}
.ddafoot .dfl { font-family: var(--en); font-size: .78cqw; letter-spacing: .18em; color: var(--green); flex: 0 0 auto; }
.ddafoot p { margin: 0; font-size: .9cqw; line-height: 1.8; color: var(--ink-2); font-weight: 300; }
.ddafoot p b { color: var(--green); font-weight: 500; }

/* --- LEARNINGS（P15） --- */
.lrn { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.4cqw; padding-top: 2.2cqw; }
.lcol { display: flex; flex-direction: column; }
.lcol > .lh { display: flex; align-items: baseline; gap: .8cqw; padding-bottom: .8cqw; border-bottom: 2px solid var(--ink); }
.lcol > .lh .le { font-family: var(--en); font-size: 1.15cqw; letter-spacing: .16em; font-weight: 500; }
.lcol > .lh .lj { font-size: .84cqw; color: var(--ink-3); letter-spacing: .06em; }
.lcol.w > .lh { border-bottom-color: var(--green); }
.lcol.w > .lh .le { color: var(--green); }
.lcol.d > .lh { border-bottom-color: var(--alert); }
.lcol.d > .lh .le { color: var(--alert); }
.lcol.n > .lh { border-bottom-color: var(--spring); }
.lcol.n > .lh .le { color: var(--spring); }
.litem { padding: .72cqw 0; border-bottom: 1px solid var(--line-2); }
.litem h6 { margin: 0 0 .28cqw; font-size: .96cqw; letter-spacing: .04em; font-weight: 500; }
.litem p { margin: 0; font-size: .82cqw; line-height: 1.75; color: var(--ink-2); font-weight: 300; }
.litem .lnum { font-family: var(--en); color: var(--ink); }

/* --- NEXT PLAN（P16） --- */
.calc { display: flex; flex-direction: column; }
.calcrow {
  display: flex; align-items: baseline; gap: .9cqw;
  padding: .62cqw 0; border-bottom: 1px solid var(--line-2);
}
.calcrow .cl { font-size: .92cqw; letter-spacing: .04em; color: var(--ink-2); }
.calcrow .cv { margin-left: auto; font-family: var(--en); font-size: 1.15cqw; letter-spacing: .01em; }
.calcrow .cs { font-size: .76cqw; color: var(--ink-3); flex: 0 0 auto; }
.calcrow.sum { border-bottom: none; border-top: 1px solid var(--ink); margin-top: .3cqw; padding-top: .72cqw; }
.calcrow.sum .cl { font-weight: 500; color: var(--ink); }
.calcrow.sum .cv { font-size: 1.5cqw; color: var(--spring); font-weight: 500; }
.calcrow.gap .cl { color: var(--green); font-weight: 500; }
.calcrow.gap .cv { color: var(--green); font-weight: 500; }

.recs { display: flex; flex-direction: column; }
.rec { display: flex; gap: 1.0cqw; padding: .58cqw 0; border-top: 1px solid var(--line-2); }
.rec:first-child { border-top: none; }
.rec .rk { flex: 0 0 7.2cqw; font-size: .82cqw; letter-spacing: .08em; color: var(--ink-3); padding-top: .12cqw; }
.rec .rv { font-size: .92cqw; line-height: 1.7; color: var(--ink); font-weight: 400; }
.rec .rv span { display: block; font-size: .78cqw; color: var(--ink-3); font-weight: 300; margin-top: .1cqw; }
.rec .rv em { font-style: normal; font-family: var(--en); color: var(--green); }

/* --- EVENT COMPARISON（P17） --- */
.cmp .tbl td.now { background: var(--autumn-pale); }
.cmp .tbl td.nx { background: var(--spring-pale); }
.cmp .tbl thead th.now { color: var(--autumn); border-bottom-color: var(--autumn); }
.cmp .tbl thead th.nx { color: var(--spring); border-bottom-color: var(--spring); }
.cmp .tbl thead th.fut { color: var(--ink-4); }

/* --- 顧客育成（P18） --- */
.grow3 { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; padding-top: 2.4cqw; align-items: stretch; }
.gcol { padding: 0 1.8cqw; border-left: 1px solid var(--line); display: flex; flex-direction: column; }
.gcol:first-child { border-left: none; padding-left: 0; }
.gcol:last-child { padding-right: 0; }
.gcol .gk { font-family: var(--en); font-size: .84cqw; letter-spacing: .22em; color: var(--ink-4); }
.gcol h4 { margin: .5cqw 0 .2cqw; font-family: var(--mincho); font-size: 2.0cqw; letter-spacing: .1em; font-weight: 500; }
.gcol .gs { font-size: .86cqw; color: var(--green); letter-spacing: .08em; }
.gcol p { margin: 1.1cqw 0 0; font-size: .9cqw; line-height: 1.9; color: var(--ink-2); font-weight: 300; }
.gcol .gwhen {
  margin-top: auto; padding-top: .8cqw; border-top: 1px solid var(--line);
  font-size: .8cqw; color: var(--ink-3); letter-spacing: .05em; line-height: 1.7;
}
.future-note {
  margin-top: 1.6cqw; padding: .85cqw 1.1cqw; border: 1px dashed var(--ink-4);
  font-size: .84cqw; line-height: 1.8; color: var(--ink-3); letter-spacing: .02em;
}
.future-note b { color: var(--ink-2); font-weight: 500; }

/* --- YEAR 1 スコープ（P19） --- */
.scope { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 3.0cqw; padding-top: 2.2cqw; }
.scopelist { display: flex; flex-direction: column; }
.scopelist .sl {
  display: flex; gap: .8cqw; align-items: baseline;
  padding: .52cqw 0; border-bottom: 1px solid var(--line-2);
}
.scopelist .sl .sc { font-family: var(--en); font-size: .74cqw; color: var(--green); flex: 0 0 1.4cqw; }
.scopelist .sl .st { font-size: .92cqw; letter-spacing: .04em; }
.scopelist .sl .sm { margin-left: auto; font-size: .76cqw; color: var(--ink-3); letter-spacing: .06em; }
.scopelist .sl.later .sc { color: var(--ink-4); }
.scopelist .sl.later .st { color: var(--ink-3); }
.mvpsteps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2cqw; margin-top: auto; padding-top: 1.6cqw; }
.mvpstep { border-top: 1px solid var(--line); padding-top: .7cqw; }
.mvpstep .ms { font-family: var(--en); font-size: .72cqw; letter-spacing: .16em; color: var(--ink-4); }
.mvpstep h6 { margin: .3cqw 0 .28cqw; font-size: .95cqw; letter-spacing: .05em; font-weight: 500; }
.mvpstep p { margin: 0; font-size: .78cqw; line-height: 1.65; color: var(--ink-2); font-weight: 300; }
.mvpstep.hi { border-top-color: var(--green); border-top-width: 2px; }
.mvpstep.hi h6 { color: var(--green); }

/* --- PARTNERSHIP（P20） --- */
.roles { flex: 1; display: flex; flex-direction: column; gap: 1.0cqw; padding-top: 2.0cqw; }
.rolerow { display: grid; gap: 1.2cqw; }
.rolerow.c4 { grid-template-columns: repeat(4, 1fr); }
.rolerow.c1 { grid-template-columns: 1fr; }
.rolebox { border: 1px solid var(--line); background: #fff; padding: .8cqw .9cqw; }
.rolebox .rl { font-family: var(--en); font-size: .68cqw; letter-spacing: .18em; color: var(--ink-4); }
.rolebox h5 { margin: .3cqw 0 .3cqw; font-size: 1.0cqw; letter-spacing: .05em; font-weight: 500; }
.rolebox p { margin: 0; font-size: .8cqw; line-height: 1.7; color: var(--ink-2); font-weight: 300; }
.rolebox.core { background: var(--green); border-color: var(--green); color: #fff; }
.rolebox.core .rl { color: rgba(255,255,255,.55); }
.rolebox.core h5 { font-size: 1.1cqw; }
.rolebox.core p { color: rgba(255,255,255,.82); }
.roleconn { height: 1.5cqw; position: relative; }
.roleconn::before { content: ""; position: absolute; left: 12.5%; right: 12.5%; top: 50%; height: 1px; background: var(--ink-4); }
.roleconn::after { content: ""; position: absolute; left: 50%; top: 50%; bottom: 0; width: 1px; background: var(--ink-4); }
.rolenote {
  margin-top: .4cqw; display: flex; gap: 1.4cqw; align-items: baseline;
}
.rolenote .rnl { font-family: var(--en); font-size: .76cqw; letter-spacing: .18em; color: var(--ink-4); flex: 0 0 auto; }
.rolenote p { margin: 0; font-size: .86cqw; line-height: 1.8; color: var(--ink-2); font-weight: 300; }
.rolenote p b { color: var(--ink); font-weight: 500; }

/* 確認事項タグ */
.chk {
  display: inline-block; font-size: .72cqw; letter-spacing: .06em;
  color: var(--alert); border: 1px solid var(--alert); padding: 0 .3cqw; margin: 0 .2cqw;
  transform: translateY(-.08cqw);
}

/* ============================ 画面UI（印刷では非表示） ============================ */
.topbar {
  position: fixed; top: 0; left: 0; right: 0; height: 52px; z-index: 50;
  background: rgba(252,252,250,.92); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
  display: flex; align-items: center; gap: 18px; padding: 0 20px;
}
.topbar .tb-title { font-size: 12px; letter-spacing: .14em; color: var(--ink-2); }
.topbar .tb-title b { font-weight: 500; color: var(--ink); }
.topbar .tb-right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.topbar .tb-pos { font-family: var(--en); font-size: 11px; letter-spacing: .1em; color: var(--ink-3); }
.btn {
  font-family: var(--sans); font-size: 11px; letter-spacing: .1em;
  padding: 7px 14px; border: 1px solid var(--ink); background: transparent; color: var(--ink);
  cursor: pointer; border-radius: 2px;
}
.btn:hover { background: var(--ink); color: #fff; }
.btn.primary { background: var(--green); border-color: var(--green); color: #fff; }
.btn.primary:hover { background: var(--green-2); }

.progress { position: fixed; top: 52px; left: 0; height: 2px; background: var(--green); z-index: 51; width: 0; }

.print-hint {
  max-width: var(--page-max); margin: 0 auto; padding: 0 16px 40px;
  font-size: 12px; line-height: 1.9; color: var(--ink-2); letter-spacing: .03em;
}
.print-hint b { color: var(--ink); }

@media (max-width: 900px) {
  .sheet { padding: 68px 8px 60px; gap: 12px; }
  .topbar { gap: 10px; padding: 0 12px; }
  .topbar .tb-title { font-size: 10px; }
}

/* ============================================================
   後追いレイヤー（HTML実装後の調整）
   ============================================================ */
.pstack { display: flex; flex-direction: column; gap: .8cqw; min-height: 0; flex: 1; }
.pstack > .panel { flex: 1; min-height: 0; }
.anav a i { width: .74cqw; height: .74cqw; }
.tile .td b { font-weight: 500; }
.appnote .anl { padding-top: .1cqw; }

/* アプリ内テーブルは行数が多いので詰める */
#p11 .atbl tbody td, #p12 .atbl tbody td { padding: .26cqw .45cqw; font-size: .66cqw; }
#p11 .atbl thead th, #p12 .atbl thead th { padding: .26cqw .45cqw; }
#p11 .atbl tfoot td, #p12 .atbl tfoot td { padding: .3cqw .45cqw; }

/* ダッシュボードページの下段注記の位置 */
.pad.dash { justify-content: flex-start; }
.pad.dash > .app { min-height: 0; }

/* P13 CONDITION：2×2パネル内の表は列が多いので詰める */
#p13 .atbl th, #p13 .atbl td { padding: .24cqw .38cqw; }
#p13 .atbl tbody td { font-size: .64cqw; }
#p13 .atbl thead th { font-size: .54cqw; letter-spacing: .08em; }
#p13 .atbl { table-layout: auto; }
#p13 .panel:last-child .atbl td:nth-child(2), #p13 .panel:last-child .atbl th:nth-child(2) { font-size: .58cqw; }
#p13 .atbl tfoot td { white-space: normal; line-height: 1.6; }

/* P11 CHANNEL：行を少しゆったりさせてパネルを埋める */
#p11 .pstack > .panel:first-child .atbl tbody td { padding: .40cqw .45cqw; }
#p11 .panel:last-child .atbl tbody td { padding: .44cqw .45cqw; }

/* P13：上段グラフを大きく、下段の表は行をゆったりさせて空きを詰める */
#p13 .panels.c22 { grid-template-rows: 1.38fr .62fr; }
#p13 .panels.c22 > .panel:nth-child(3) .atbl tbody td { padding: .46cqw .38cqw; }
#p13 .panels.c22 > .panel:nth-child(4) .atbl tbody td { padding: .7cqw .38cqw; }

/* P07：循環の3枚を縦に伸ばして、ページ中央の空きをなくす */
#p07 .cycrow { flex: 1; }
#p07 .cycev { justify-content: flex-start; }
#p07 .cycev .cyl {
  margin-top: auto; padding-top: .7cqw; border-top: 1px solid var(--line);
  font-size: .76cqw; line-height: 1.8; color: var(--ink-2); text-align: left; font-weight: 300;
}
#p07 .cycev .cyl b { display: block; font-size: .72cqw; letter-spacing: .14em; color: var(--green); font-weight: 500; margin-bottom: .2cqw; }
#p07 .cycev.fut .cyl b { color: var(--ink-3); }
#p07 .cycback { margin-top: 1.2cqw; }
#p07 .cycrow { flex: 0 0 45%; }
#p07 .steps { padding-top: 2.0cqw; gap: 2.0cqw; }
#p07 .step h5 { font-size: 1.7cqw; }
#p07 .step p { font-size: .92cqw; line-height: 1.9; }

/* 目次：セクション名を折り返さない */
.toc-item .tn { width: 7.4cqw; white-space: nowrap; }

/* P03：縦フローを縦方向に伸ばして余白を均す */
#p03 .flow-node { padding: 1.15cqw 1.1cqw; font-size: 1.06cqw; }
#p03 .flow-arrow { height: 2.2cqw; }

/* P04：12の問いを縦に伸ばす */
#p04 .qitem { padding: 1.42cqw 0; }
#p04 .qitem .qt { font-size: 1.0cqw; }

/* P14：DATA→DECISION→ACTION の4行を縦に伸ばす */
#p14 .ddarow { padding: 2.15cqw 0; }
#p14 .ddarow .dcell { font-size: .95cqw; }

/* P15：LEARNINGS の各項目を縦に伸ばす */
#p15 .litem { padding: 1.42cqw 0; }

/* .mt-a が後発の margin-top 指定に負けていたのを戻す（P16 の注記／P20 の Note） */
.future-note.mt-a, .rolenote.mt-a { margin-top: auto; }

/* P16：左右の行間を広げて余白を均す */
#p16 .calcrow { padding: 1.1cqw 0; }
#p16 .rec { padding: 1.55cqw 0; }

/* P18：3段の中身を厚くして余白を均す */
.gcol .gstat {
  margin-top: 1.3cqw; padding: .85cqw 1.0cqw; background: var(--paper-2);
  font-size: .9cqw; line-height: 1.8; color: var(--ink-2); font-weight: 300;
}
.gcol .gstat span {
  display: block; font-family: var(--en); font-size: .72cqw; letter-spacing: .16em;
  color: var(--ink-3); margin-bottom: .2cqw;
}
.gcol .gstat b { color: var(--green); font-weight: 500; }
#p18 .gcol p { font-size: .96cqw; line-height: 2.1; }

/* P19：スコープ一覧の行間を広げる */
#p19 .scopelist .sl { padding: 1.06cqw 0; }

/* P20：体制図を縦に伸ばして余白を均す */
#p20 .rolebox { padding: 1.5cqw 1.15cqw; }
#p20 .rolebox p { font-size: .86cqw; line-height: 1.9; }
#p20 .rolebox.core { padding: 2.1cqw 1.6cqw; }
#p20 .roleconn { height: 3.2cqw; }
#p20 .roles { gap: 1.2cqw; }

/* P19：4ステップはページ下端に全幅で置く */
#p19 .scope { flex: 0 1 auto; }
#p19 .mvpsteps { margin-top: auto; padding-top: 2.0cqw; gap: 2.0cqw; }
#p19 .mvpstep h6 { font-size: 1.08cqw; }
#p19 .mvpstep p { font-size: .86cqw; line-height: 1.85; }
#p19 .scopelist .sl { padding: 1.24cqw 0; }
#p15 .litem { padding: 1.62cqw 0; }
#p15 .litem h6 { font-size: 1.06cqw; }
#p15 .litem p { font-size: .92cqw; line-height: 1.95; }

/* P05：3つの課題を縦に伸ばす */
#p05 .issue h4 { font-size: 1.42cqw; }
#p05 .issue p { font-size: 1.0cqw; line-height: 2.05; }
#p05 .lead.sm { font-size: 1.1cqw; line-height: 2.1; }
#p19 .scopelist .sl { padding: 1.08cqw 0; }
#p19 .mvpsteps { padding-top: 1.6cqw; }
