/* ── お知らせの小窓（「保存が完了しました」・削除の確認など。編成・保存編成で共通） ──
   画面の中央に出し、後ろは暗くする。js/common.js の showDialog() で出す */
.dlg-bg{
  position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:24px;
  background:rgba(0,0,0,.6);opacity:0;pointer-events:none;transition:opacity .15s;
}
.dlg-bg.open{opacity:1;pointer-events:auto}
.dlg{
  width:min(320px,100%);text-align:center;padding:18px 16px 14px;
  background:linear-gradient(180deg,#1a2234,#0c111d);
  border:1.5px solid #93794a;
  box-shadow:0 0 0 4px rgba(10,14,24,.9), 0 0 0 5px rgba(232,199,106,.35), 0 12px 30px rgba(0,0,0,.8);
  transform:scale(.94);transition:transform .15s;
}
.dlg-bg.open .dlg{transform:none}
.dlg h3{display:inline-block;font-size:20px;font-weight:bold;letter-spacing:.12em;line-height:1.3}
.dlg p{font-size:12.5px;color:#e8e2d2;margin:10px 0 14px;line-height:1.7;white-space:pre-line}   /* 文の中の改行はそのまま改行する */
.dlg p[hidden]{display:none}
/* 更新の記録（日付ごとに、変わった点を箇条書き）。長いときは枠の中だけ動かして読む */
.dlg .notes{text-align:left;margin:12px 0 14px;max-height:min(52dvh,380px);overflow-y:auto;overscroll-behavior:contain;
  padding:2px 10px 4px;background:rgba(5,8,15,.55);border:1px solid rgba(232,199,106,.25)}
.dlg .notes[hidden]{display:none}
.dlg:has(.notes:not([hidden])) h3{font-size:17px;letter-spacing:.06em}   /* 「新しい情報に更新されました」が1行に収まるように */
.dlg .notes section + section{border-top:1px dashed rgba(232,199,106,.25)}
.dlg .notes h4{font-size:12px;color:#d8c68c;letter-spacing:.08em;margin:9px 0 4px}
.dlg .notes ul{list-style:none;margin:0 0 9px;padding:0}
.dlg .notes li{position:relative;font-size:12.5px;color:#e8e2d2;line-height:1.65;padding-left:1.1em;margin:3px 0}
.dlg .notes li::before{content:'・';position:absolute;left:0}
/* 日付の見出しなしの箇条書き（操作のしかた）: 上にも少し余白をとり、小窓を少し広げて1項目が1行に収まるようにする */
.dlg .notes > ul:first-child{margin-top:8px}
.dlg:has(.notes > ul:first-child){width:min(340px,100%)}
.dlg .notes > ul:first-child li{font-size:12px}
.dlg .btns{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 10px}
.dlg button{font-family:inherit;font-size:13px;font-weight:bold;letter-spacing:.1em;padding:5px 22px;cursor:pointer}
/* ボタンが3つのとき（上書き保存・新規保存・やめる）は少し詰める */
.dlg .btns:has(.alt:not([hidden])) button{padding:5px 12px;letter-spacing:.05em}
.dlg .alt{color:#2a1d08;background:linear-gradient(180deg,#d9cfae,#9c8a5c);border:1px solid #6e5f3a}
.dlg .alt[hidden]{display:none}
.dlg button:active{transform:translateY(1px)}
.dlg .ok{color:#2a1d08;background:linear-gradient(180deg,#f0d488,#b98b35);border:1px solid #8a6a2a}
.dlg .ng{color:#d8c68c;background:linear-gradient(180deg,#2a3350,#181f33);border:1px solid rgba(232,199,106,.45)}
.dlg .ng[hidden]{display:none}
/* 削除など取り消せない操作の確認は、決定ボタンを赤くする */
.dlg.danger .ok{color:#fff;background:linear-gradient(180deg,#d8604f,#8e2418);border-color:#5e140c}