/* Shared look of the patient parts. Every part SVG @imports this file, and the app loads it once.
   Colours are CSS variables so one drawing serves every skin tone / hair / clothing colour; the renderer (patient.js) sets them
   on the root group (.pv) from the scenario's patient.appearance and the currently visible signs (cyanosis, pallor ...). */
:root, .pv {
  --skin: #ffffff; --skin-face: var(--skin); --skin-hand: var(--skin); --ear: var(--skin);
  --lips: #d99a9e; --skin-foot: var(--skin); --nose: var(--skin-face);
  --c1: #3b6ea8; --c2: #f2f2f2; --c3: #2b2b33;
}
/* chart figure (traced from the sample outline) */
.chart-sil { stroke: #1d1d22; stroke-width: 4.2; stroke-linejoin: round; }
.chart-ink { fill: #1d1d22; stroke: none; }
.ol { stroke: #3a3f4a; stroke-width: 1.5; stroke-linejoin: round; stroke-linecap: round; }      /* icon outlines (icons are drawn in a 60-unit box and scaled up) */
.ol-thin { stroke: #3a3f4a; stroke-width: 1; stroke-linejoin: round; stroke-linecap: round; }
.ol-lips { stroke: #1d1d22; stroke-width: 2.4; stroke-linejoin: round; }
.det { fill: none; stroke: #3a3f4a; stroke-width: .9; stroke-linecap: round; stroke-linejoin: round; opacity: .6; }
.skin { fill: var(--skin); }
.skin-face { fill: var(--skin-face); }
.skin-hand { fill: var(--skin-hand); }
.skin-foot { fill: var(--skin-foot); }
.skin-open { fill: var(--skin); }
.lips { fill: var(--lips); }
.ear { fill: var(--ear); }
.nose-tip { fill: var(--nose); }
.sh { fill: #1b1020; opacity: .08; stroke: none; }
.hi { fill: none; stroke: #fff; stroke-width: 1.6; stroke-linecap: round; opacity: .55; }
/* devices & wounds */
.blood { fill: #c1121f; } .blood-d { fill: #8f0d17; } .flesh { fill: #e5737a; } .scrape { fill: #e98f86; } .bone { fill: #f4efe4; }
.gauze { fill: #f6f1e4; } .glove { fill: #4dabf7; } .splint { fill: #f59f00; } .binder { fill: #4263eb; } .tape { fill: #ffd43b; }
.collar { fill: #f1f3f5; } .mask { fill: #b2f2bb; fill-opacity: .8; } .bag { fill: #d3f9d8; } .guedel { fill: #ff922b; } .clip { fill: #adb5bd; }
.cuff { fill: #5c7cfa; } .foil { fill: #e9c46a; fill-opacity: .88; } .mattress { fill: #4dabf7; fill-opacity: .55; }
/* front / back view */
.pv:not(.back) .b-only, .pv.back .f-only { display: none; }
/* pulsating arterial bleeding */
.pv .pulse { transform-box: fill-box; transform-origin: 50% 100%; animation: pvpulse 0.8s ease-in-out infinite; }
@keyframes pvpulse { 0%, 100% { transform: scale(1); opacity: 1 } 50% { transform: scale(1.18); opacity: .7 } }
@media (prefers-reduced-motion: reduce) { .pv .pulse { animation: none; } }

.pv-label { font: 700 30px system-ui, sans-serif; letter-spacing: .18em; fill: #8a93a0; }