/* ================================================================
   오늘의 회항 (features/divert-today) — 지도 오른쪽 위 런처 + 작은 목록. **관리자 전용**. (2026-10-13)
   ⛔ 새 생김새·새 회피 규약을 만들지 않는다 — 런처는 뉴스(.avn-btn)·레이어(.mlp-btn)와 같은 알약이고,
     세로 자리는 JS가 #avnBtn 바로 아래(12px)로 맞춘다. 뉴스가 없으면 아래 기본값(둘째 슬롯).
   ⛔ 빨강(--status-danger)을 쓰지 않는다 — 실시간 안전경보 전용. 회항 배지는 주황(--status-warn).
   ⚠ 전역 button{width:100%}가 있다 — 이 모듈의 버튼은 전부 width:auto를 명시한다.
   ================================================================ */
.dvt-btn {
  position: fixed; z-index: 1200;
  top: calc(var(--hdr-total, 68px) + var(--gap, 14px) + var(--bgsw-h, 32px) + 12px);
  right: calc(var(--gap, 14px) + var(--sa-r, 0px));
  width: auto; height: 32px; margin: 0; padding: 0 12px 0 10px;
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--bg-surface-float, #fff); color: var(--text-primary, #0f172a);
  border: 1px solid var(--status-warn, #d97706); border-radius: var(--radius-md, 10px);
  box-shadow: var(--shadow-md, 0 4px 16px -2px rgba(15,23,42,.08));
  font-family: inherit; font-size: var(--fs-md, 12px); font-weight: 700; cursor: pointer;
  transition: right var(--transition-smooth, .25s);
}
.dvt-btn[hidden] { display: none !important; }
.dvt-btn svg { width: 16px; height: 16px; flex: none; color: var(--status-warn, #d97706); }
.dvt-btn.on { background: var(--status-warn, #d97706); color: var(--text-inverse, #fff); }
.dvt-btn.on svg { color: currentColor; }
.dvt-btn:focus-visible { outline: 2px solid var(--status-warn, #d97706); outline-offset: 2px; }
.dvt-btn .dvt-n {
  position: absolute; top: -6px; right: -6px; min-width: 16px; height: 16px; padding: 0 4px;
  border-radius: 999px; background: var(--status-warn, #d97706); color: var(--text-inverse, #fff);
  font-size: var(--fs-xs, 10px); line-height: 16px; text-align: center; font-variant-numeric: tabular-nums;
  box-shadow: 0 0 0 2px var(--bg-surface-float, #fff);
}
body.inspector-open .dvt-btn,
body.inspector-open .dvt-pop { right: calc(var(--insp-w, 430px) + var(--gap, 14px) * 2 + var(--sa-r, 0px)); }

.dvt-pop {
  position: fixed; z-index: 1255;
  top: calc(var(--hdr-total, 68px) + var(--gap, 14px) + 96px);
  right: calc(var(--gap, 14px) + var(--sa-r, 0px));
  width: 320px; max-width: calc(100vw - 32px); max-height: 60vh;
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--bg-surface-elevated, #fff); color: var(--text-primary, #0f172a);
  border: 1px solid var(--border-medium, #cbd5e1); border-radius: var(--radius-lg, 14px);
  box-shadow: var(--shadow-lg, 0 12px 32px -4px rgba(15,23,42,.14));
  font-family: inherit; font-size: var(--fs-md, 12px);
}
.dvt-pop[hidden] { display: none !important; }
.dvt-pop button { width: auto; margin: 0; box-shadow: none; font-family: inherit; }
.dvt-hd { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--border-light, #e2e8f0); }
.dvt-hd b { font-size: var(--fs-lg, 13px); }
.dvt-adm { font-size: var(--fs-xs, 10px); color: var(--text-tertiary, #64748b); border: 1px solid var(--border-medium, #cbd5e1); border-radius: 999px; padding: 0 6px; }
.dvt-x { margin-left: auto !important; background: none; border: 0; color: var(--text-secondary, #475569); cursor: pointer; font-size: 14px; padding: 2px 4px; }
.dvt-help { padding: 8px 12px; font-size: var(--fs-sm, 11px); line-height: 1.5; color: var(--text-secondary, #475569); background: var(--bg-surface-sunken, rgba(148,163,184,.08)); border-bottom: 1px solid var(--border-light, #e2e8f0); }
.dvt-list { overflow-y: auto; }
.dvt-row {
  display: flex !important; flex-direction: column; align-items: stretch; gap: 3px; width: 100% !important;
  padding: 8px 12px; background: none; border: 0; border-bottom: 1px solid var(--border-light, #e2e8f0);
  color: inherit; text-align: left; cursor: pointer;
}
.dvt-row:hover, .dvt-row.on { background: var(--bg-hover, rgba(217,119,6,.08)); }
.dvt-l1 { display: flex; align-items: center; gap: 6px; }
.dvt-tag { font-size: var(--fs-xs, 10px); font-weight: 700; color: var(--status-warn, #d97706); border: 1px solid currentColor; border-radius: 4px; padding: 0 4px; }
.dvt-est { font-size: var(--fs-xs, 10px); color: var(--text-tertiary, #64748b); border: 1px dashed currentColor; border-radius: 4px; padding: 0 4px; }
.dvt-apt { font-size: var(--fs-xs, 10px); color: var(--text-secondary, #475569); border: 1px solid var(--border-medium, #cbd5e1); border-radius: 4px; padding: 0 4px; }
.dvt-typ { color: var(--text-tertiary, #64748b); font-size: var(--fs-sm, 11px); }
.dvt-at { margin-left: auto; font-variant-numeric: tabular-nums; color: var(--text-secondary, #475569); }
.dvt-l2 { color: var(--text-secondary, #475569); font-size: var(--fs-sm, 11px); }
.dvt-ft { padding: 6px 12px; font-size: var(--fs-xs, 10px); color: var(--text-tertiary, #64748b); }
@media (max-width: 760px) {
  .dvt-btn { padding: 0; width: 40px; height: 40px; justify-content: center; }
  .dvt-btn .dvt-t { display: none; }
}