/* A CSS-built 3D scene: the same medical identity at every specialty. */
.health-visual { position: relative; width: 400px; height: 280px; isolation: isolate; perspective: 850px; pointer-events: none; }
.health-halo { position: absolute; inset: 7% 5%; border-radius: 50%; background: radial-gradient(ellipse, #8ecbff5c 0, #a9ceff1c 48%, transparent 70%); }
.health-orbit { position: absolute; width: 84%; height: 53%; inset-inline-start: 7%; top: 25%; border: 1px solid #8bb7f564; border-radius: 50%; transform: rotate(-24deg); }
.health-orbit--two { width: 64%; height: 65%; inset-inline-start: 18%; top: 16%; transform: rotate(39deg); border-style: dashed; border-color: #9abaf53b; }
.health-platform { position: absolute; bottom: 13%; inset-inline-start: 23%; width: 56%; height: 15%; border-radius: 50%; background: #4c92f92e; filter: blur(12px); transform: rotate(-12deg); }
.health-core { position: absolute; inset-inline-start: 32%; top: 23%; width: 144px; height: 150px; transform-style: preserve-3d; transform: rotate(-12deg) rotateY(-15deg); animation: health-levitate 7s ease-in-out infinite; }
.health-core-back { position: absolute; inset: -12px; border: 1px solid #ffffffa6; background: #ffffff26; border-radius: 40px; transform: translate3d(7px, 5px, -28px) rotate(11deg); box-shadow: 0 18px 26px #1b61b515; backdrop-filter: blur(3px); }
.health-core-face { position: absolute; inset: 0; display: grid; place-items: center; overflow: hidden; border-radius: 35px; border: 1px solid #8bbdff; background: linear-gradient(135deg, #8ccaff 0, #3d8bfa 29%, #2567e3 64%, #164da9 100%); box-shadow: inset 2px 3px 4px #ffffff80, inset -6px -7px 10px #163d9a4d, 8px 12px 0 #1a54b7, 13px 22px 30px #2457a939; }
.health-cross { width: 66px; height: 66px; position: relative; filter: drop-shadow(3px 5px 1px #173c9873); transform: translateZ(18px); }
.health-cross::before, .health-cross::after { content: ''; position: absolute; background: linear-gradient(145deg, #fff 24%, #d4eaff); border-radius: 7px; box-shadow: inset 1px 2px #ffffffcc; }
.health-cross::before { width: 24px; height: 66px; inset-inline-start: 21px; }
.health-cross::after { width: 66px; height: 24px; top: 21px; inset-inline-start: 0; }
.health-core-shine { position: absolute; width: 140%; height: 47%; top: -10%; inset-inline-start: -25%; background: linear-gradient(#ffffff33, #ffffff00); border-radius: 50%; transform: rotate(-26deg); }
.health-float { position: absolute; border: 1px solid #ffffffed; background: #ffffffde; box-shadow: 0 13px 24px #174d9820, inset 0 1px #fff; backdrop-filter: blur(14px); border-radius: 18px; color: #285184; animation: health-drift 7s ease-in-out infinite; }
.health-float { -webkit-backdrop-filter: blur(14px); }.health-core-back { -webkit-backdrop-filter: blur(3px); }
.health-vitals { inset-inline-start: 1%; top: 11%; width: 168px; padding: 12px 13px 9px; transform: rotate(6deg); z-index: 3; }
.health-tile-heading { display: flex; align-items: center; gap: 6px; font-size: 10px; font-weight: 650; }
.health-tile-heading i { margin-inline-start: auto; color: #3e83e8; font-size: 13px; }
.health-tile-dot { width: 5px; height: 5px; background: #449ff7; border-radius: 50%; box-shadow: 0 0 0 3px #d7ebff; }
.health-vitals svg { width: 100%; height: 42px; margin-block: 4px; overflow: visible; }
.health-wave-track { stroke: #cfe3ff; stroke-width: 2.4; }
.health-wave { stroke: #3484f7; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 220; stroke-dashoffset: 220; animation: health-pulse 5s ease-in-out infinite; }
.health-tile-caption { display: block; font-size: 8px; color: #5a769e; }
.health-scan { top: 18%; inset-inline-end: 1%; width: 83px; padding: 7px 5px 8px; background: linear-gradient(150deg, #1f568d, #123562); color: #ddf3ff; transform: rotate(-12deg); animation-delay: -3s; border-color: #89c5ffb0; box-shadow: inset 1px 1px #c5e7ff44, 0 15px 25px #16457d33; }
.health-scan svg { display: block; width: 69px; height: 69px; margin: 0 auto; stroke: #b5e4ff; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.health-scan svg rect { fill: #b7e6ff07; stroke: #a3dcff47; }
.health-scan-corner { stroke: #6cb7ff; }
.health-scan>span:first-of-type { display: block; text-align: center; font-size: 8px; line-height: 1.5; }
.health-scan-line { position: absolute; inset-inline: 15px; height: 1px; top: 35%; background: #90d7ff; box-shadow: 0 0 8px #8fddff; opacity: .7; animation: health-scan 6s ease-in-out infinite; }
.health-rehab { inset-inline-end: 8%; bottom: 7%; padding: 9px 13px; display: flex; align-items: center; gap: 10px; font-size: 10px; transform: rotate(5deg); animation-delay: -4s; }
.health-rehab i { width: 30px; height: 30px; display: grid; place-items: center; font-size: 18px; color: #3473d7; background: #e6f1ff; border-radius: 10px; }
.health-satellite { position: absolute; display: grid; place-items: center; }
.health-satellite--heart { inset-inline-start: 13%; bottom: 12%; width: 38px; height: 38px; border-radius: 13px; background: linear-gradient(135deg, #a7d7ff, #3f8be6); color: #f7fcff; box-shadow: inset 1px 1px #ffffffb3, 3px 5px 0 #3a79cb, 7px 10px 15px #4c82c82b; transform: rotate(-14deg); font-size: 18px; }
.health-satellite--spark { top: 1%; inset-inline-end: 26%; color: #84baff; font-size: 30px; }
.health-speck { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #5ca1f5; box-shadow: 0 3px 5px #548bc855; }
.health-speck--one { bottom: 8%; inset-inline-start: 41%; }.health-speck--two { top: 23%; inset-inline-end: 28%; width: 4px; height: 4px; background: #b9deff; }
.health-visual--compact { width: 260px; height: 220px; }
.health-visual--compact .health-core { width: 110px; height: 115px; inset-inline-start: 30%; top: 25%; }
.health-visual--compact .health-core-face { border-radius: 28px; }.health-visual--compact .health-core-back { border-radius: 32px; }
.health-visual--compact .health-cross { transform: scale(.76); }
.health-visual--compact .health-vitals { width: 123px; padding: 9px; top: 5%; inset-inline-start: -1%; }
.health-visual--compact .health-tile-heading { font-size: 8px; }.health-visual--compact .health-tile-caption { font-size: 6px; }
.health-visual--compact .health-vitals svg { height: 32px; }.health-visual--compact .health-scan { width: 62px; top: 15%; inset-inline-end: -1%; }
.health-visual--compact .health-scan svg { width: 49px; height: 49px; }.health-visual--compact .health-scan>span:first-of-type { font-size: 6px; }
.health-visual--compact .health-rehab { bottom: 5%; inset-inline-end: -2%; font-size: 8px; padding: 6px 9px; gap: 6px; }
.health-visual--compact .health-rehab i { width: 24px; height: 24px; font-size: 15px; }
.health-visual--compact .health-satellite--heart { width: 29px; height: 29px; font-size: 13px; bottom: 10%; inset-inline-start: 9%; border-radius: 10px; }


@keyframes health-levitate { 0%, 100% { transform: translateY(0) rotate(-12deg) rotateY(-15deg); } 50% { transform: translateY(-8px) rotate(-9deg) rotateY(-10deg); } }
@keyframes health-drift { 0%, 100% { translate: 0 0; } 50% { translate: 0 -7px; } }
@keyframes health-pulse { 0% { stroke-dashoffset: 220; } 38%, 75% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -220; } }
@keyframes health-scan { 0%, 100% { top: 25%; opacity: .1; } 50% { top: 64%; opacity: .7; } }


.tn-landing:is(.is-paused, .is-idle) .health-visual *, .tn-landing:is(.is-paused, .is-idle) .health-visual *::before, .tn-landing:is(.is-paused, .is-idle) .health-visual *::after { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) {
  .health-visual *, .health-visual *::before, .health-visual *::after { animation: none!important; transition: none!important; }
  .health-wave { stroke-dashoffset: 0; }.health-scan-line { display: none; }
}