/* 연결 pill — 2026-09-16 「다시 연결」부터 **누르는 것**이다(app.js wireConnTap). 옛 규칙
   `.conn{cursor:default}`(표시 전용)은 지웠다 — theme.css 의 cursor:pointer 가 그대로 산다. */
/* 미확인 알림 패널
   ★★ `top` 은 **앱바 밑변에 매달려 있다**(B0 · 2026-09-09). 유도를 남긴다 —
     · 앱바는 `theme.css` 의 `.appbar{height:48px; zoom:var(--zinv,1)}` 이고 `--zinv` = 1/배율(z)다.
       그래서 앱바가 **문서 좌표계(CSS px)** 에서 차지하는 높이는 48 * (1/z) 이고,
       웹뷰가 그것을 z 배로 그리므로 화면에서는 48px 로 고정된다.
     · 이 패널은 `app.js` 의 `toggleNotifPanel` 이 **`document.body` 끝에** 붙인다 — 곧 앱바의
       `zoom` 이 **안 걸린** 좌표계에 산다. 그래서 앱바 밑변이 CSS px 로 얼마인지를 다시 계산해
       따라가야 한다(옛 값 `top:52px` 은 z=1 에서만 맞았고, z=2 에서는 앱바가 24px 로 내려앉아
       패널이 28px 짜리 허공 위에 떴다).
     · 틈은 **화면에서** 4px 로 보여야 하므로 문서 좌표계로는 4 * (1/z) 다.
     · 합치면 top = (48 + 4) * (1/z) = `calc(52px * var(--zinv,1))`.
   ★ `--zinv` 가 1 이면(모바일 웹 `/m` · 배율 100% · 구버전) 값은 **정확히 52px** 로, 지금과
     한 픽셀도 다르지 않다. 그것이 이 식의 보존 계약이다.
   ★ 앱바 높이를 바꾸면 여기 52 도 함께 바꿔라. 저장소에서 앱바 높이에 매달린 자리는 여기
     하나뿐이고(전수 확인), `tests/zoom.test.mjs` 의 「B0 축7」이 두 값을 **함께 계산해**
     화면에서의 틈이 갈리면 빨개진다. */
.notif-panel{ position:fixed; top:calc(52px * var(--zinv,1)); right:10px; width:300px; max-height:60vh; overflow-y:auto;
  background:var(--surface); border:1px solid var(--hair); border-radius:8px;
  box-shadow:0 12px 32px rgba(16,18,20,.18); z-index:60; padding:8px; }
.notif-panel .np-line{ font-size:13px; padding:7px 8px; border-bottom:1px solid var(--hair); }
.notif-panel .np-line:last-child{ border-bottom:0; }
.notif-panel .np-empty{ color:var(--ink-3); font-size:13px; padding:12px; text-align:center; }
/* 업데이트 배너 */
.update-banner{ background:var(--t-swap); color:var(--c-swap); padding:10px 14px; font-size:13px;
  display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid var(--hair); }
.update-banner .btn{ font-family:inherit; font-size:13px; font-weight:600; padding:6px 12px;
  border:0; border-radius:6px; background:var(--a-swap); color:#fff; cursor:pointer; }
/* 오프라인 신선도 배너 */
.offline-banner{ background:var(--t-rep); color:var(--c-rep); border:1px solid rgba(157,93,0,.2);
  border-radius:8px; padding:11px 14px; font-size:13px; margin:12px; }
