/* features/web-push — 브라우저 푸시 켜기·끄기 (2026-09-20 신설)
   ⚠ 변수는 alert-notify.css와 **같은 것**을 쓴다(폴백 값까지 같게) — 같은 자리에 나란히 놓이는
     단추라 한쪽만 다른 토큰을 쓰면 테마를 바꿀 때 어긋난다. */
.wp-root{display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:2px 0 8px}
.wp-btn{height:24px; width:auto; flex:none; white-space:nowrap; padding:0 10px; cursor:pointer; font-family:inherit;
  font-size:var(--fs-xs,10px); font-weight:700; color:inherit;
  background:var(--bg-surface-elevated,#fff); border:1px solid var(--border-subtle,#e2e8f0);
  border-radius:var(--radius-md,10px)}
.wp-btn:hover{border-color:var(--accent-cyan,#0284c7)}
.wp-btn:disabled{opacity:.55; cursor:not-allowed}
.wp-st{font-size:var(--fs-xs,10px); color:var(--text-tertiary,#64748b)}
.wp-root button{width:auto}
/* iOS 설치 안내 — 단추가 없을 때만 보인다(web-push.js의 label().mode==='guide') */
.wp-guide{flex-basis:100%; font-size:var(--fs-xs,10px); line-height:1.6;
  color:var(--text-secondary,#475569); background:var(--bg-surface,#f8fafc);
  border:1px solid var(--border-subtle,#e2e8f0); border-radius:var(--radius-md,10px);
  padding:8px 10px; margin-top:2px}
.wp-guide b{color:var(--text-primary,#0f172a)}
.wp-steps{margin:6px 0 4px; padding-left:18px}
.wp-steps li{margin:2px 0}
.wp-note{display:block; margin-top:4px; color:var(--text-tertiary,#64748b)}