/* 이상 징후 탐지 인포그래픽 — infographic.js가 그리는 <svg class="ti"> 전용 스타일 */
.ti .t-head { font: 700 15px 'Noto Sans KR', sans-serif; fill: var(--fg); letter-spacing: -.02em; }
.ti .t-step { font: 600 13px 'Outfit', sans-serif; }
.ti .t-sub { font: 500 10.5px 'Noto Sans KR', sans-serif; fill: var(--muted); }
.ti .t-rule { font: 600 13.5px 'Noto Sans KR', sans-serif; fill: var(--fg-2); letter-spacing: -.03em; }
.ti .row { fill: var(--surface-solid); stroke: var(--line); }
.ti .link { fill: none; stroke: rgb(var(--danger)); stroke-width: 2; stroke-dasharray: 6 6; animation: flow .9s linear infinite; }
.ti .link-head { fill: none; stroke: rgb(var(--danger)); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ti .t-num { font: 700 11px 'JetBrains Mono', monospace; fill: #fff; }

.ti .col-bg { fill: rgba(var(--a2), .045); stroke: rgba(var(--a2), .14); }
.ti .ring { fill: none; stroke: rgba(var(--a2), .28); }
.ti .ring.dash { stroke-dasharray: 2 6; }
.ti .cross { stroke: rgba(var(--a2), .12); }
.ti .sweep { fill: url(#tiSweep); transform-box: view-box; animation: spin 5s linear infinite; }
.ti .core { fill: url(#tiCore); }
.ti .core-ring { fill: none; stroke: rgba(var(--a2), .6); stroke-width: 1.5; }
.ti .blip { fill: rgb(var(--danger)); }
.ti .blip-halo { fill: rgba(var(--danger), .25); transform-box: fill-box; transform-origin: center; animation: pulse 2.4s ease-out infinite; }

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes flow { to { stroke-dashoffset: -22; } }
@keyframes pulse { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(2.2); opacity: 0; } }
html.static .ti *, html.is-print .ti * { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .ti * { animation: none !important; } }
/* 카카오톡 알림톡 화면 (기기 색은 테마와 무관하게 실제 앱 색상 유지) */
.ti .ph-btn { fill: #2c2e34; }
.ti .k-status { font: 700 10px 'Outfit', sans-serif; fill: #111; }
.ti .k-title { font: 700 11px 'Noto Sans KR', sans-serif; fill: #111; letter-spacing: -.02em; }
.ti .k-date { font: 500 7.4px 'Noto Sans KR', sans-serif; fill: #fff; }
.ti .k-name { font: 500 8px 'Noto Sans KR', sans-serif; fill: #3c4a57; }
.ti .k-band { font: 700 8.6px 'Noto Sans KR', sans-serif; fill: #191919; letter-spacing: -.02em; }
.ti .k-cap { font: 400 6.8px 'Noto Sans KR', sans-serif; fill: #8a8a8a; }
.ti .k-h { font: 700 9.4px 'Noto Sans KR', sans-serif; fill: #191919; letter-spacing: -.02em; }
.ti .k-t { font: 400 7.4px 'Noto Sans KR', sans-serif; fill: #191919; letter-spacing: -.02em; }
.ti .k-f { font: 400 6.8px 'Noto Sans KR', sans-serif; fill: #8a8a8a; letter-spacing: -.01em; }
.ti .k-link { fill: #2b6fd6; text-decoration: underline; }
.ti .k-time { font: 400 6.4px 'Noto Sans KR', sans-serif; fill: #556677; }
.ti .k-input { font: 400 8px 'Noto Sans KR', sans-serif; fill: #9aa0a6; }