.page { padding: 24px; gap: 20px; }
.proposal-editor { display: flex; flex-wrap: wrap; gap: 14px; background: white; border: 1px solid var(--line); padding: 18px; border-radius: 8px; }
.proposal-editor label { display: grid; gap: 6px; font-size: 13px; flex: 1; min-width: 160px; }
.proposal-editor input { font: inherit; padding: 10px; border: 1px solid var(--line); border-radius: 5px; min-width: 0; width: 100%; box-sizing: border-box; }
.proposal-editor p { font-size: 12px; color: var(--muted); line-height: 1.6; flex-basis: 100%; margin: 0; }
.proposal-paper { width: 100%; max-width: 980px; margin: 0 auto; background: white; padding: 28px; box-sizing: border-box; color: var(--ink); }
.paper-landscape .proposal-paper { max-width: 1400px; }
.proposal-cover { margin-bottom: 30px; }
.proposal-cover h1 { font-size: 30px; line-height: 1.45; margin: 22px 0 14px; }
.proposal-cover p { font-size: 13px; line-height: 1.7; }
.proposal-eyebrow { font-weight: 700; letter-spacing: .06em; }
.proposal-summary { padding: 18px 0; border-block: 1px solid var(--line); }
.proposal-summary h2 { font-size: 17px; margin: 0 0 10px; }
.proposal-summary ul { padding-left: 20px; font-size: 13px; line-height: 1.9; margin: 0; }
.proposal-map { max-width: 680px; margin: 22px auto 0; }
.proposal-cards { display: grid; grid-template-columns: 1fr; gap: 24px; align-items: start; }
.paper-landscape .proposal-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.proposal-notes { margin-top: 30px; border-top: 1px solid var(--line); padding-top: 15px; }
.proposal-notes h2 { font-size: 16px; }
.proposal-notes p, .proposal-footer { font-size: 11px; line-height: 1.8; overflow-wrap: anywhere; }
.proposal-footer { border-top: 1px solid var(--line); margin-top: 24px; padding-top: 12px; }
#proposal-recipient { font-size: 22px; font-weight: 700; }
[data-orientation][aria-pressed="true"] { background: var(--accent-ink); color: white; }
.topbar-actions [role="group"] { display: flex; gap: 4px; }
@media screen and (max-width: 1199px) { .paper-landscape .proposal-cards { grid-template-columns: 1fr; } }
@media screen and (max-width: 767px) {
  .page { padding: 14px; }
  .proposal-paper { padding: 16px; }
  .paper-landscape .proposal-cards { grid-template-columns: 1fr; }
  .topbar { position: static; }
  .topbar-actions { flex-wrap: wrap; }
  .proposal-cover h1 { font-size: 24px; }
}
@media print {
  html, body { background: white !important; margin: 0; padding: 0; }
  .shell, .shell-main, .page { display: block !important; width: auto !important; margin: 0 !important; padding: 0 !important; }
  .nav, .topbar, .proposal-editor { display: none !important; }
  .proposal-paper { max-width: none !important; width: auto !important; padding: 0; margin: 0; }
  .proposal-cover { break-inside: avoid; break-after: page; margin: 0; }
  .proposal-cover h1 { font-size: 24pt; }
  .proposal-cover p { font-size: 10pt; }
  .proposal-summary li { font-size: 10pt; line-height: 1.7; }
  .proposal-map { max-width: 155mm; }
  .proposal-cards { display: block; columns: 1; }
  .paper-landscape .proposal-cards { columns: 2; column-gap: 10mm; column-fill: auto; }
  .proposal-cards > .customer-card { break-before: auto; break-inside: auto; margin: 0 0 8mm; padding: 0; border: 0; border-radius: 0; }
  .customer-answer { font-size: 20pt; }
  .customer-detail { font-size: 10pt; }
  .card-figures { display: block; }
  .card-figure { margin: 16px 0; }
  .card-figure .ch-svg { max-height: 58mm; }
  .figure-conclusion { font-size: 11pt; }
  .card-figure figcaption { font-size: 8pt; }
  .card-figure .rb { font-size: 9pt; }
  .paper-landscape .card-figures { display: block; }
  .paper-landscape .card-figure { margin: 12px 0; }
  .paper-landscape .proposal-cover { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12mm; }
  .paper-landscape .proposal-cover > h1, .paper-landscape .proposal-cover > p { grid-column: 1 / -1; margin: 4px 0; }
  .paper-landscape .proposal-summary { margin-top: 8mm; padding: 4mm 0; }
  .paper-landscape .proposal-map { margin: 8mm 0 0; }
  .proposal-notes { break-inside: avoid; }
  a { color: inherit; text-decoration: none; }
}
.proposal-notes ul { padding-left: 20px; font-size: 11px; line-height: 1.8; }
.proposal-notes > h3 { font-size: 15px; }
.proposal-notes .appendix-figures { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#proposal-print:disabled { opacity: .55; cursor: wait; }
@media screen and (max-width: 767px) { .proposal-notes .appendix-figures { grid-template-columns: 1fr; } }
@media print {
  .proposal-cards > .customer-card { break-inside: avoid; page-break-inside: avoid; }
  .proposal-notes { break-before: page; break-inside: auto; }
  .proposal-notes .appendix-figures { display: block; columns: 2; column-gap: 10mm; }
  .proposal-notes .card-figure { break-inside: avoid; margin: 0 0 6mm; }
  .proposal-map { max-width: 140mm; }
  .card-map .map-over { max-height: none; }
  .customer-card h2 { font-size: 13pt; }
  .card-topic { font-size: 8pt; }
  .customer-detail { font-size: 9pt; }
  .figure-conclusion { font-size: 10pt; margin-bottom: 5px; }
  .card-figure figcaption { font-size: 7pt; line-height: 1.4; margin-top: 5px; }
  .card-figure .ch-note { font-size: 8pt; }
}
@media print {
  .paper-landscape .card-map { max-width: 92mm; margin-inline: auto; }
  .paper-landscape .card-figure .ch-svg { max-height: 42mm; }
  .paper-landscape .card-map .map-over { max-height: none; }
  .paper-landscape .card-map .ch-legend { font-size: 7pt; }
  .paper-landscape .card-figures { margin-top: 10px; }
}

/* 線分図（ものさし・ゲージ・経路）は伸ばしすぎない（2026-10-06 オーナー指摘） */
.ch-svg.ch-compact { display: block; width: 100%; max-width: 440px; height: auto; }
@media print { .card-figure .ch-svg.ch-compact { max-width: 105mm; max-height: 22mm; } }

/* 補足：本編と付録のあいだに置く「数字の詳しい内容」（2026-10-06） */
.proposal-supplement { margin-top: 30px; border-top: 2px solid var(--accent, #2F6B5A); padding-top: 15px; }
.proposal-supplement > h2 { font-size: 18px; }
.supplement-lead { font-size: 12px; line-height: 1.8; color: var(--muted, #5E5B55); }
.proposal-supplement .card-appendix { margin-top: 18px; }
.proposal-supplement .card-appendix h3 { font-size: 14px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; }
.proposal-supplement .card-appendix h3 small { font-size: 11px; font-weight: 400; color: var(--muted, #5E5B55); }
.supplement-no { color: var(--accent, #2F6B5A); font-weight: 700; }
.proposal-supplement .card-appendix p { font-size: 11px; line-height: 1.8; }
.proposal-supplement .appendix-figures { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media screen and (max-width: 767px) { .proposal-supplement .appendix-figures { grid-template-columns: 1fr; } }
@media print {
  .proposal-supplement { break-before: page; }
  .proposal-supplement .card-appendix { break-inside: avoid; }
  .proposal-supplement .appendix-figures { display: block; columns: 2; column-gap: 10mm; }
  .proposal-supplement .card-figure { break-inside: avoid; margin: 0 0 6mm; }
  .paper-landscape .proposal-supplement .card-appendix { break-inside: auto; }
}

.proposal-paper, .proposal-cover, .proposal-summary, .proposal-supplement, .proposal-notes { min-width: 0; overflow-wrap: anywhere; }
.proposal-summary ul { list-style: none; padding: 0; }
.proposal-summary li { display: flex; align-items: baseline; gap: 8px; margin: 5px 0; }
.proposal-summary li > span { min-width: 0; }
.proposal-summary .topic-icon { margin: 0; align-self: flex-start; }
@media print {
  /* 付録は独立したブロック。直前の補足の改ページ抑制を解除し、縦横とも新しいページへ。 */
  .proposal-paper > .proposal-supplement { break-after: auto !important; page-break-after: auto !important; }
  .proposal-paper > .proposal-notes { display: block; clear: both; break-before: page !important; page-break-before: always !important; break-inside: auto; }
  .proposal-supplement .card-appendix { break-inside: auto; }
  .proposal-paper .ch-pyramid .ch-svg { max-height: none; }
}

/* 紙でも暮らしのブロックを同じ書体・配色で読む。 */
.proposal-paper { font-family: var(--sans); }
.proposal-cover h1 { font-family: var(--serif); }
.proposal-cards > .customer-block { padding: 18px; border: 1px solid var(--line); border-radius: 8px; }
.proposal-cards > .customer-block:has(.customer-card) { padding: 0; border: 0; }
.proposal-cards .customer-block > h2 { font-size: 18px; line-height: 1.6; }
.proposal-cards .customer-block > p, .proposal-cards .customer-block > ul { font-size: 13px; line-height: 1.8; }
.reading-diagram { margin: 16px 0; max-width: 640px; }
.reading-diagram svg { display: block; width: 100%; height: auto; font-family: var(--sans); }
.reading-diagram figcaption { font-size: 11px; color: var(--muted); }
.proposal-cards .customer-block .hscroll { max-width: 100%; }
@media print {
  .proposal-cards > .customer-block { margin-bottom: 8mm; padding: 0; border: 0; break-inside: auto; }
  .proposal-cards > .customer-block > .customer-card { padding: 0; border: 0; break-inside: avoid; }
  .proposal-cards .customer-block > h2 { break-after: avoid; font-size: 13pt; }
  .proposal-cards .customer-block > p, .proposal-cards .customer-block > ul { font-size: 9pt; }
  .customer-block .scene { max-height: 55mm; }
  .reading-diagram { break-inside: avoid; max-width: 155mm; }
  .proposal-reading { break-inside: avoid; }
}

/* ── 紙のプレビュー（2026-10-07 オーナー指摘「A4横にしてもレイアウトが変わらない」）
   画面でも縦＝210mm・1段、横＝297mm・2段で組み、画面幅に合わせて縮小表示する（縮小は proposal.js の fitPaper）。
   印刷と同じ段組みを画面でも使うので、「PDFで保存」も選んだ向きのレイアウトのまま出る。 */
.proposal-cards { display: block; columns: 1; }
.paper-landscape .proposal-cards { display: block; columns: 2; column-gap: 10mm; grid-template-columns: none; }
.proposal-cards > .customer-block, .proposal-cards > .customer-card { break-inside: auto; margin: 0 0 8mm; }
.proposal-cards .card-figure, .proposal-cards .card-map, .proposal-cards h2 { break-inside: avoid; }
.paper-landscape .proposal-cover { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12mm; align-items: start; }
.paper-landscape .proposal-cover > h1, .paper-landscape .proposal-cover > p { grid-column: 1 / -1; }
.paper-landscape .proposal-supplement .appendix-figures { display: block; columns: 2; column-gap: 10mm; }
@media screen and (min-width: 768px) {
  .proposal-paper { width: 210mm; max-width: none; padding: 12mm; margin: 0 auto; box-shadow: 0 1px 8px rgba(30, 30, 28, .12); }
  .paper-landscape .proposal-paper { width: 297mm; max-width: none; }
}
@media screen and (max-width: 767px) {
  .paper-landscape .proposal-cards, .paper-landscape .proposal-supplement .appendix-figures { columns: 1; }
  .paper-landscape .proposal-cover { display: block; }
}
@media print {
  .proposal-paper { zoom: 1 !important; box-shadow: none !important; }
  .paper-landscape .proposal-cards { columns: 2; column-gap: 10mm; }
}
/* 横向きの表紙は高さが短いので、サマリーを詰めて1ページに収める */
.paper-landscape .proposal-summary li { line-height: 1.5; }
@media print {
  .paper-landscape .proposal-summary li { font-size: 9pt; line-height: 1.45; }
  .paper-landscape .proposal-cover h1 { font-size: 20pt; margin: 2mm 0; }
}

/* ── 印刷レイアウトの見直し（2026-10-07 オーナー指摘6点）。画面には影響させない（すべて print のみ） ──
   1 表紙：サマリーを2列にして、地図まで表紙1枚に収める
   2 空きの多いページを減らす：1項目の図（最大2つ）を横に並べ、項目の高さを抑える。図の途中では割らず、図と図の間では割れる
   3 図の大きさをそろえる：地図・円グラフ・線分図・棒グラフに種類ごとの上限
   4 横向き：2段の中で図は1つずつ縦に。大きさの上限で段の高さの差を小さく
   5 補足：文字の大きさと余白を本編に近づける
   6 付録：出典を2列にして付録のページに収める */
@media print {
  /* 1 表紙 */
  .proposal-cover { break-after: page; }
  .proposal-summary ul { columns: 2; column-gap: 8mm; padding-left: 0; list-style: none; }
  .proposal-summary li { break-inside: avoid; font-size: 9.5pt; line-height: 1.55; }
  .proposal-map { max-width: 150mm; margin: 6mm auto 0; }
  .proposal-map .card-map { max-width: 150mm; }
  .paper-landscape .proposal-summary ul { columns: 1; }
  .paper-landscape .proposal-map, .paper-landscape .proposal-map .card-map { max-width: 125mm; }

  /* 2 本編：図を横に並べる（縦向き）。見出しは最初の図と離さない */
  .proposal-cards .card-figures { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 7mm; align-items: start; margin-top: 3mm; }
  .proposal-cards .card-figures > .card-figure:only-child { grid-column: 1 / -1; max-width: 120mm; }
  .proposal-cards .card-figure { margin: 0 0 4mm; break-inside: avoid; }
  .proposal-cards .customer-card h2, .proposal-cards .customer-block > h2, .proposal-cards .card-topic, .proposal-cards .customer-detail { break-after: avoid; }
  .proposal-cards > .customer-block, .proposal-cards > .customer-card { margin: 0 0 6mm; padding-bottom: 4mm; border-bottom: 0.4pt solid #E6E2DB; }
  .paper-landscape .proposal-cards .card-figures { grid-template-columns: 1fr; }
  .paper-landscape .proposal-cards .card-figures > .card-figure:only-child { max-width: none; }

  /* 3 図の大きさ（種類ごとの上限） */
  .proposal-paper .card-map { max-width: 100%; }
  .proposal-paper .card-figure .ch-svg { max-height: 52mm; width: 100%; }
  .proposal-paper .card-figure .ch-svg.ch-compact { max-height: 20mm; max-width: 95mm; }
  .proposal-paper .customer-block svg.ch-svg { max-height: 52mm; }
  .proposal-paper .customer-block > .scene, .proposal-paper .customer-block .scene { max-width: 90mm; }
  .paper-landscape .proposal-paper .card-figure .ch-svg { max-height: 44mm; }
  .paper-landscape .proposal-paper .card-map { max-width: 100mm; margin-inline: auto; }

  /* 5 補足：本編に近い文字の大きさと余白。図は2列で大きさをそろえる */
  .proposal-supplement .card-appendix { margin-top: 6mm; padding-top: 3mm; border-top: 0.4pt solid #E6E2DB; }
  .proposal-supplement .card-appendix p { font-size: 9.5pt; line-height: 1.7; margin: 1.5mm 0; }
  .proposal-supplement .card-appendix h3 { font-size: 12pt; break-after: avoid; }
  .proposal-supplement .appendix-figures { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 7mm; columns: auto; }
  .proposal-supplement .appendix-figures .card-figure { margin: 0 0 4mm; break-inside: avoid; }
  .paper-landscape .proposal-supplement .appendix-figures { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  /* 6 付録：出典を2列に */
  .proposal-sources ul { columns: 2; column-gap: 8mm; font-size: 8pt; line-height: 1.5; }
  .paper-landscape .proposal-sources ul { columns: 3; }
  .proposal-sources li { break-inside: avoid; }
  .proposal-sources > p { font-size: 8pt; line-height: 1.5; }
}
@media print {
  /* 棒グラフ（.ch）も途中で割らない（1行だけページ末に残る不具合の修正） */
  .proposal-paper .ch { break-inside: avoid; }
}
@media print {
  /* 暮らし版・旧接客用ビュー由来の項目（歩ける範囲・安心の材料など）の地図も、本編の地図と同じ大きさに */
  .proposal-paper .customer-block > .card-map { max-width: 110mm; }
  .paper-landscape .proposal-paper .customer-block > .card-map { max-width: 100mm; }
  .proposal-paper .customer-block > ul { columns: 2; column-gap: 8mm; font-size: 9pt; }
  .paper-landscape .proposal-paper .customer-block > ul { columns: 1; }
}


/* スマホ・タブレット（iPhone・iPad の Chrome / Safari）でも印刷は A4 の幅で組む。
   これらは印刷時も「画面の幅」でレイアウトするため、紙の印字幅（左右12mmの余白を除く）に固定する */
@media print {
  .proposal-paper { width: 186mm !important; max-width: none !important; padding: 0 !important; margin: 0 !important; }
  .paper-landscape .proposal-paper { width: 273mm !important; }
}

/* 1ページに収まる長さの項目（印刷の直前に proposal.js が data-keep を付ける）は途中で切らず、見出しごと次のページへ */
@media print { .proposal-paper [data-keep] { break-inside: avoid; page-break-inside: avoid; } }