/* 確認窓と知らせの帯（全画面で共通）。決まりは docs/UI_RULES.md。
   画面ごとの CSS に負けないよう、クラス名は app-notice- / app-toast- で始めて、ここだけで完結させる。 */
.app-notice-back{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(40,30,20,.45)}
.app-notice-box{width:min(400px,100%);padding:22px 22px 18px;border-radius:14px;background:#fff;box-shadow:0 16px 48px rgba(0,0,0,.28);color:#3A2E22;font-family:inherit;text-align:left}
.app-notice-title{margin:0 0 8px;font-size:16px;font-weight:700;line-height:1.5}
.app-notice-body{margin:0 0 18px;color:#6c665e;font-size:13px;line-height:1.7;word-break:break-word}
.app-notice-input{display:block;width:100%;box-sizing:border-box;margin:0 0 18px;padding:9px 10px;border:1px solid #E4D6C3;border-radius:8px;font:inherit;font-size:13px;color:#3A2E22}
textarea.app-notice-input{min-height:84px;resize:vertical}
.app-notice-input.is-error{border-color:#D9483B;box-shadow:0 0 0 2px rgba(217,72,59,.15)}
.app-notice-actions{display:flex;justify-content:flex-end;gap:10px}
.app-notice-btn{min-width:96px;padding:9px 18px;border:0;border-radius:8px;font:inherit;font-size:13px;font-weight:700;line-height:1.4;cursor:pointer}
.app-notice-cancel{background:#F2EEE8;color:#5B4E40}
.app-notice-cancel:hover{background:#E9E2D8}
.app-notice-ok{background:#F48024;color:#fff}
.app-notice-ok:hover{background:#E06F15}
.app-notice-danger{background:#D9483B;color:#fff}
.app-notice-danger:hover{background:#C23A2E}
.app-notice-btn:focus-visible{outline:2px solid #3A2E22;outline-offset:2px}

.app-toast-box{position:fixed;left:50%;bottom:28px;z-index:10001;display:flex;flex-direction:column;align-items:center;gap:8px;transform:translateX(-50%);pointer-events:none;width:max-content;max-width:calc(100vw - 32px)}
.app-toast{display:flex;align-items:center;gap:10px;padding:11px 18px;border-radius:10px;background:#3A2E22;color:#fff;font-size:13px;font-weight:700;line-height:1.5;box-shadow:0 6px 20px rgba(0,0,0,.25);opacity:0;transform:translateY(6px);transition:opacity .18s,transform .18s;pointer-events:auto}
.app-toast.is-shown{opacity:1;transform:none}
.app-toast-success::before{content:"✓";font-weight:700}
.app-toast-error{background:#D9483B}
.app-toast-close{padding:0 2px;border:0;background:none;color:#fff;font-size:13px;opacity:.85;cursor:pointer}
.app-toast-close:hover{opacity:1}
@media print{.app-notice-back,.app-toast-box{display:none!important}}

/* 選択肢（appChoose）。囲みの行を縦に並べる（2026-10-22） */
.app-notice-choices{display:flex;flex-direction:column;gap:8px;margin:0 0 16px}
.app-notice-choice{display:flex;flex-direction:column;gap:2px;width:100%;padding:10px 14px;border:1.5px solid #E4D6C3;border-radius:10px;background:#fff;color:#3A2E22;font:inherit;text-align:left;cursor:pointer}
.app-notice-choice:hover{border-color:#F48024;background:#FFF7EF}
.app-notice-choice.is-primary{border-color:#F48024}
.app-notice-choice:focus-visible{outline:2px solid #3A2E22;outline-offset:2px}
.app-notice-choice-label{font-size:13.5px;font-weight:700;line-height:1.5}
.app-notice-choice-note{font-size:11.5px;color:#7a7268;line-height:1.5}
/* 入力欄の下の案内と、まちがいの赤い文字（appPrompt の hint・validate。2026-10-22） */
.app-notice-input + .app-notice-hint,.app-notice-input + .app-notice-error{margin-top:-12px}
.app-notice-hint{margin:0 0 14px;color:#7a7268;font-size:11.5px;line-height:1.6}
.app-notice-error{margin:0 0 14px;color:#D9483B;font-size:12px;font-weight:700;line-height:1.6}
.app-notice-hint + .app-notice-error{margin-top:-8px}