/* ITDA v30.78 · live attention center */
.attention-bell{
  position:relative;
  width:38px;
  height:38px;
  flex:0 0 38px;
  border:1px solid var(--border);
  border-radius:11px;
  background:#fff;
  color:#334155;
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:.18s ease;
}
.attention-bell:hover{background:#f8fafc;border-color:#cbd5e1;transform:translateY(-1px)}
.attention-bell-icon{width:21px;height:21px;display:inline-flex;align-items:center;justify-content:center;color:#64748b;line-height:1;transition:.18s ease}
.attention-bell.has-attention{border-color:#fecaca;background:#fff7f7}
.attention-bell.has-attention .attention-bell-icon{color:#dc2626}
.attention-badge{
  position:absolute;
  top:-6px;
  right:-7px;
  min-width:20px;
  height:20px;
  padding:0 5px;
  border:2px solid #fff;
  border-radius:999px;
  background:#ef4444;
  color:#fff;
  font-size:10px;
  font-weight:900;
  line-height:16px;
  text-align:center;
  box-sizing:border-box;
}
.attention-bell.has-attention:after{
  content:"";
  position:absolute;
  inset:-4px;
  border:2px solid rgba(239,68,68,.18);
  border-radius:14px;
  animation:attentionPulse 1.8s ease-out infinite;
  pointer-events:none;
}
@keyframes attentionPulse{0%{opacity:1;transform:scale(.92)}70%,100%{opacity:0;transform:scale(1.12)}}
.attention-loading,.attention-empty{
  min-height:220px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  color:var(--muted);
  text-align:center;
  padding:26px;
}
.attention-loading span{
  width:26px;height:26px;border:3px solid #dbeafe;border-top-color:var(--primary);border-radius:50%;
  animation:attentionSpin .7s linear infinite;
}
@keyframes attentionSpin{to{transform:rotate(360deg)}}
.attention-empty>span{
  width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  background:#ecfdf5;color:#059669;font-size:23px;font-weight:900;
}
.attention-empty b{font-size:16px;color:var(--text)}
.attention-empty small{font-size:13px;line-height:1.55}

@media(max-width:1050px){
  .header-member-actions{display:flex!important;align-items:center;gap:7px}
  .attention-bell{width:42px;height:42px;flex-basis:42px;border-radius:12px}
  .attention-bell-icon{width:22px;height:22px}
}
@media(max-width:760px){
  .attention-bell{width:42px;height:42px;flex-basis:42px}
  .attention-badge{top:-4px;right:-5px;min-width:21px;height:21px;font-size:10px;line-height:17px}
  #postLoginModal .modal-body{font-size:15px}
  .attention-empty{min-height:190px;padding:22px 16px}
}
@media (prefers-reduced-motion:reduce){.attention-bell.has-attention:after{animation:none}.attention-loading span{animation-duration:1.4s}}

/* v30.80: 이모지 종 대신 상단 UI와 맞는 라인형 알림 벨 */
.attention-bell-icon svg{width:100%;height:100%;display:block;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.attention-bell:hover .attention-bell-icon{color:#2563eb}
.attention-bell.has-attention:hover .attention-bell-icon{color:#dc2626}
