/* G2 패스 세이브 (!) 말풍선(TICKET-332, PRD-018/AC-11) —
   doc/design/board/screens/G2r-참고-출발시간도움말.html의 말풍선 인라인 스타일을 값 그대로
   클래스로 옮기고 색만 토큰 변수로 치환했다. 200px 폭 화면에서 잘리지 않도록 max-width만 더했다. */
.g2-tipwrap { display: flex; align-items: center; gap: 2px; position: relative; }
.g2-help[aria-expanded="true"] { color: var(--board-accent); }
.g2-tip {
  position: absolute; left: -5px; top: 40px; width: 200px; max-width: calc(100vw - 64px);
  box-sizing: border-box; padding: 10px 12px; background: var(--board-surface-border);
  border-radius: 10px; font-size: 13px; line-height: 1.5; color: var(--board-text);
  box-shadow: 0 10px 24px var(--board-shadow); z-index: 6;
}
.g2-tip[hidden] { display: none; }
.g2-tip__arrow {
  position: absolute; left: 92px; top: -5px; width: 10px; height: 10px;
  background: var(--board-surface-border); transform: rotate(45deg);
}