/* 실시간 접수 현황 카드 — 공용 스타일(홈 히어로 · /internet 히어로). 동작은 /sjlive.js(window.SJLive) */
.sjlv{--lvh:44px;background:var(--bg-2);border-radius:var(--r-card-l);padding:18px 18px 14px;color:var(--text)}
.sjlv-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.sjlv-k{display:flex;align-items:center;gap:8px;margin:0;font-size:15px;font-weight:800;letter-spacing:-.02em}
.sjlv-dot{position:relative;flex:0 0 auto;width:8px;height:8px;border-radius:50%;background:var(--red)}
.sjlv-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;background:var(--red);opacity:.35;animation:sjlvPulse 1.6s ease-out infinite}
@keyframes sjlvPulse{0%{transform:scale(.5);opacity:.45}100%{transform:scale(1.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.sjlv-dot::after{animation:none;opacity:0}}
.sjlv-n{font-size:13px;font-weight:600;color:var(--text-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.sjlv-n b{color:var(--text);font-weight:800}
.sjlv-vp{position:relative;height:calc(var(--lvh) * 5);margin-top:8px;overflow:hidden;contain:layout paint}   /* 5줄 고정 — 롤링·건수 변화로 카드 높이가 바뀌지 않게 */
.sjlv-list{list-style:none;margin:0;padding:0;will-change:transform}
.sjlv-list.is-roll{transition:transform .6s cubic-bezier(.4,0,.2,1)}
.sjlv-list li{box-sizing:border-box;display:grid;grid-template-columns:62px minmax(0,1fr) auto;align-items:center;gap:10px;height:var(--lvh);padding:0;border-bottom:1px solid var(--line-2);font-size:14px}
.sjlv-list li.is-in{animation:sjlvIn .5s ease-out}
@keyframes sjlvIn{from{opacity:0;transform:translateY(-6px)}}
@media (prefers-reduced-motion:reduce){.sjlv-list.is-roll{transition:none}.sjlv-list li.is-in{animation:none}}
.sjlv-t{font-size:12.5px;font-weight:500;color:var(--text-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.sjlv-m{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--text-2);font-weight:500}
.sjlv-m b{color:var(--text);font-weight:700}
.sjlv-b{display:inline-block;padding:3px 8px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}
.sjlv-b.new{background:#FDECEA;color:var(--red)}
.sjlv-b.ing{background:#FFF1E2;color:#C2570C}
.sjlv-b.done{background:#E6F4EC;color:#18794E}
.sjlv-sk{display:block;height:12px;border-radius:6px;background:linear-gradient(90deg,#ECE8E2 0%,#F4F1EC 50%,#ECE8E2 100%);background-size:200% 100%;animation:sjlvSk 1.3s linear infinite}
@keyframes sjlvSk{from{background-position:200% 0}to{background-position:0 0}}
@media (prefers-reduced-motion:reduce){.sjlv-sk{animation:none}}
.sjlv-sk.m{width:78%}.sjlv-sk.b{width:44px;height:20px;border-radius:999px}
.sjlv-list li.sjlv-empty{display:flex;align-items:center;justify-content:center;height:calc(var(--lvh) * 5);border-bottom:0;text-align:center;font-size:14px;font-weight:500;color:var(--text-2)}
.sjlv-foot{margin:8px 0 0;font-size:12px;font-weight:500;color:var(--text-3)}
@media(min-width:768px){
  .sjlv{--lvh:48px;padding:22px 24px 16px}
  .sjlv-list li{grid-template-columns:70px minmax(0,1fr) auto;font-size:14.5px}
}