/* ============================================================
   handoff.css — スマホの「PC で開く」欄（トップ・エディタ共通）と、トップの主・副ボタン
   欄の中身は generate-site-parts.js が site-parts.js（handoff）から焼き込む。コピー・メールの動作は mobile-copy.js。
   置き場所ごとの余白・背景は各 CSS 側（トップ＝lp.css、エディタ＝style.css）。このファイルはそれらより先に読む。
   ============================================================ */

/* ── ボタン（トップ全体でも使う） ── */
.lp-btn, .lp-btn-sub {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 48px; padding: 12px 24px; border-radius: var(--radius);
  font-family: inherit; font-size: var(--fs-base); font-weight: 700; line-height: 24px;   /* 行 24 ＋上下 12 ＝高さ 48（押しやすい大きさ） */
  text-decoration: none; cursor: pointer;
}
.lp-btn { background: var(--accent-dark); color: var(--on-accent); border: 1px solid var(--accent-dark); }
.lp-btn:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: var(--on-accent); }
.lp-btn-sub { background: var(--bg); color: var(--accent-dark); border: 1px solid var(--accent-dark); }
.lp-btn-sub:hover { background: var(--accent-soft); color: var(--accent-dark); }

/* ── 「PC で開く」欄 ── */
.lp-handoff { margin-top: 32px; padding: 24px; border-radius: var(--radius); background: var(--surface); text-align: left; }
.lp-handoff-title { margin: 0; font-weight: 700; }
.lp-handoff-text { margin: 8px 0 16px; font-size: var(--fs-note); color: var(--text-muted); }
.lp-handoff-actions { display: flex; flex-direction: column; gap: 12px; }
.lp-handoff-url { margin: 12px 0 0; font-size: var(--fs-note); color: var(--text-muted); }