.top-btn{
  position: fixed;
  right: 18px;
  bottom: max(18px, env(safe-area-inset-bottom) + 12px); /* 모바일 하단 안전영역 대응 */
  width: 48px; height: 48px;
  border: 0; border-radius: 999px;
  background: #1F6FD0; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 10px 24px rgba(31,111,208,.30);
  cursor: pointer; z-index: 9999;

  /* 처음엔 숨김 */
  opacity: 0; transform: translateY(12px); pointer-events: none;
  transition: opacity .25s ease, transform .25s ease, background .15s ease;
}
.top-btn:hover{ background:#195eb3; }
.top-btn.is-visible{ opacity:1; transform: translateY(0); pointer-events:auto; }

/* 다크모드 대응(원하면) */
@media (prefers-color-scheme: dark){
  .top-btn{ box-shadow: 0 10px 24px rgba(0,0,0,.45); }
}