/* ============================================================
   Dialog — 確認・破壊的操作
   取り消せない操作の最終確認のみ。日常の保存には使わない
   （保存は即時＋取り消し）。破壊的確認は息継ぎ線も確定ボタンも Ember。
   ============================================================ */

.dialog {
  width: 300px;
  border: 1px solid var(--line); border-radius: var(--radius-surface);
  background: var(--surface); padding: 22px; color: var(--ink);
}
.dialog h4 { font-family: var(--font-serif); font-size: 16px; font-weight: 500; text-align: center; }
.dialog .breath { width: 28px; height: 1.5px; background: var(--brand); margin: 10px auto 14px; }
.dialog p { font-size: 13px; color: var(--ash); text-align: center; margin-bottom: 20px; }

.dialog .acts { display: flex; gap: 10px; }
.dialog .acts button { flex: 1; border-radius: var(--radius-control); padding: 12px; font-size: 14px; font-weight: 700; letter-spacing: .08em; min-height: 46px; }
.dialog .cancel { border: 1px solid var(--line); color: var(--ash); }
.dialog .confirm { background: var(--cta); color: var(--on-cta); }
.dialog .confirm.danger { background: var(--surface); color: var(--err); border: 1px solid color-mix(in srgb, var(--err) 40%, var(--line)); }