/* components.css - toast message and the guest-mode modal */

/* ── TOAST ── */
#toastBox{position:fixed;bottom:34px;left:50%;transform:translateX(-50%);background:#1E1E1E;color:#FFF;font-size:12px;padding:8px 18px;border-radius:18px;box-shadow:0 4px 20px rgba(0,0,0,.3);z-index:999999;opacity:0;transition:opacity .25s;pointer-events:none;max-width:min(560px,90vw);text-align:center;line-height:1.45}
#toastBox.show{opacity:1}
#toastBox.err{background:var(--red)}
#toastBox.ok{background:var(--brand-dk)}
#toastBox.big{font-size:16px;font-weight:600;padding:16px 32px;border-radius:26px;max-width:min(720px,92vw);box-shadow:0 8px 32px rgba(0,0,0,.35)}

/* ── SETTINGS MODAL ── */
.set-sec{padding:8px 0 12px;border-bottom:1px solid var(--border)}
.set-title{font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.set-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px}
.set-body{padding:6px 16px}