/* Cinematic SVG states: each pose is authored, not a rigid rotation of the patient. */
body{overflow:visible}
.collapse-status{display:flex;align-items:center;gap:12px;padding:20px 0;border-top:1px solid var(--line);font:500 12px/1.6 var(--mono);color:var(--mut)}
.collapse-status-dot{width:7px;height:7px;border-radius:50%;background:var(--red);flex:none}
.intro-street .scene-caption{background:#0d1216d9;border:1px solid #2a364177;border-radius:6px;padding:10px 12px;left:18px;right:18px;bottom:18px}
.face.face-detail{width:min(78vw,420px);height:auto;max-height:90%;filter:drop-shadow(0 15px 20px #0007)}
.face-art-ready .face-fallback{visibility:hidden}
.nose-focus{display:none}
#stage[data-action=nose] .nose-focus{display:block}
.nose-guide-caption{display:none;position:absolute;left:18px;right:18px;bottom:18px;text-align:center;font:500 11px/1.5 var(--mono);color:var(--tq);pointer-events:none}
#stage[data-action=nose] .nose-guide-caption,.grow[data-nose-status=done] .nose-guide-caption{display:block}
.nose-caption-done{display:none}.grow[data-nose-status=done] .nose-caption-ready{display:none}.grow[data-nose-status=done] .nose-caption-done{display:inline-block;border:1px solid #2bd4c055;background:#142624ed;border-radius:6px;padding:8px 16px}
.nose-caption-ready{display:inline-block;padding:8px 12px;border:1px solid #ff4d3d88;background:#0d1216ed;border-radius:6px;color:var(--red)}
.grow[data-nose-holding=true] .nose-focus ellipse{stroke-width:2.4;fill-opacity:.22}
.aed-cables{pointer-events:none!important}
/* Keep the photographic neck continuous. Head is a semantic marker, never a detached image slice. */
.patient #head,.patient.tilt #head{transform:none!important;translate:none!important;animation:none!important}
.patient.tilt .airway-target circle{fill:#2bd4c00d;stroke-opacity:.85;stroke-width:1.2}
@media(max-width:639px){.face.face-detail{width:min(78vw,290px)}.collapse-status{font-size:10px;padding:14px 0}.nose-guide-caption{font-size:9px;bottom:12px}.intro-street .scene-caption{font-size:8px;left:12px;right:12px;bottom:12px}}
.grow.collapse-scene{padding:0;min-height:420px;isolation:isolate;background:#111c24}
.grow.collapse-scene,.grow.intro-street{touch-action:pan-y}
.kpr-street{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:hidden;pointer-events:none}
.street-man .buckling-pose,.street-man .fallen-pose,.street-man .fallen-shadow{opacity:0}
.street-man .standing-pose,.street-man .standing-shadow{opacity:1}
.street-man .standing-pose{transform-origin:520px 530px}
.street-man .standing-upper{transform-origin:520px 380px}
.street-man .buckling-pose{transform-origin:520px 530px}
.street-man.fallen .standing-pose{animation:kpr-street-standing-out 550ms cubic-bezier(.35,0,.65,1) both}
.street-man.fallen .standing-upper{animation:kpr-street-upper-yield 550ms cubic-bezier(.35,0,.65,1) both}
.street-man.fallen .buckling-pose{animation:kpr-street-buckle 550ms cubic-bezier(.35,0,.65,1) both}
.street-man.fallen .fallen-pose{animation:kpr-street-land 550ms cubic-bezier(.16,1,.3,1) both}
.street-man.fallen .fallen-shadow{animation:kpr-street-shadow 550ms ease-out both}
.street-man.fallen .standing-shadow{opacity:0;transition:opacity 240ms ease-out}
@keyframes kpr-street-standing-out{0%,12%{opacity:1;transform:translateY(0)}48%,100%{opacity:0;transform:translateY(12px)}}
@keyframes kpr-street-upper-yield{0%{transform:rotate(0)}50%,100%{transform:rotate(9deg)}}
@keyframes kpr-street-buckle{0%,18%{opacity:0;transform:translateY(-12px)}39%,53%{opacity:1;transform:translateY(0)}79%,100%{opacity:0;transform:translateY(16px)}}
@keyframes kpr-street-land{0%,56%{opacity:0;transform:translateY(-12px)}80%{opacity:1;transform:translateY(2px)}100%{opacity:1;transform:translateY(0)}}
@keyframes kpr-street-shadow{0%,50%{opacity:0}100%{opacity:.65}}
@media(max-width:639px){.grow.collapse-scene{min-height:360px;height:360px}.street-backdrop{opacity:.85}.street-distant-people{display:none}}
@media(min-width:640px) and (max-width:1024px){.grow.collapse-scene{min-height:480px;max-height:650px}}
@media(min-width:1800px){.grow.collapse-scene{min-height:560px}}
@media(prefers-reduced-motion:reduce){.street-man.fallen .standing-pose,.street-man.fallen .standing-upper,.street-man.fallen .buckling-pose,.street-man.fallen .fallen-pose,.street-man.fallen .fallen-shadow,.street-man.fallen .standing-shadow{animation:none!important;transition:none!important;transform:none!important}.street-man.fallen .standing-pose,.street-man.fallen .buckling-pose,.street-man.fallen .standing-shadow{opacity:0}.street-man.fallen .fallen-pose{opacity:1}.street-man.fallen .fallen-shadow{opacity:.65}}

/* Side-profile airway demonstration: only the head artwork rotates, never the gesture surface.
   Pivot (184,222) remains inside both the skull base and the broad neck underlay. */
.airway-demo{overflow:visible;filter:drop-shadow(0 12px 14px #0004)}
.airway-demo .airway-head-art{transform-box:view-box;transform-origin:184px 222px;transform:rotate(0deg);transition:transform calc(var(--normal,240ms) * 2) var(--enter,cubic-bezier(.16,1,.3,1))}
.airway-demo.tilt .airway-head-art{transform:rotate(-22deg)}
.airway-demo .airway-motion-guide{opacity:.75;transition:opacity var(--fast,160ms)}
.airway-demo.tilt .airway-motion-guide{opacity:.18}
.airway-demo .airway-pose-confirm{opacity:0;transition:opacity var(--normal,240ms)}
.airway-demo.tilt .airway-pose-confirm{opacity:1}
@media(prefers-reduced-motion:reduce){.airway-demo .airway-head-art,.airway-demo .airway-motion-guide,.airway-demo .airway-pose-confirm{transition:none!important;animation:none!important}}

/* Light flows through dashed technical contours; presentation only, no JS ticker. */
.street-technical .street-bus-stop,.street-technical .street-light{stroke-dasharray:9 6;stroke-width:1.7;stroke-opacity:.8;filter:drop-shadow(0 0 3px #80dcd02b);animation:street-line-flow 6s linear infinite}
.street-technical .street-light{animation-duration:8s;animation-direction:reverse}
.street-technical .street-bus-stop path,.street-technical .street-bus-stop rect{stroke-opacity:.85}
.street-technical .street-bus-stop path[stroke-opacity=".12"]{stroke-opacity:.3}
.street-technical .street-construction{stroke-opacity:.38;stroke-width:1;animation:street-guide-flow 12s linear infinite}
.street-technical .street-ground-guide{stroke-opacity:.28;animation:street-guide-flow 16s linear infinite}.street-technical .street-ground-guide path{stroke-dasharray:4 7}
.street-technical .street-backdrop{stroke-opacity:.24;stroke-dasharray:10 8}
.street-flow-stop{animation:street-light-wave 7s ease-in-out infinite}.street-flow-stop:nth-child(2){animation-delay:-1.75s}.street-flow-stop:nth-child(3){animation-delay:-3.5s}.street-flow-stop:nth-child(4){animation-delay:-5.25s}
@keyframes street-line-flow{to{stroke-dashoffset:-90}}
@keyframes street-guide-flow{to{stroke-dashoffset:-110}}
@keyframes street-light-wave{0%,100%{stop-color:var(--mut);stop-opacity:.32}35%{stop-color:var(--tq);stop-opacity:.72}60%{stop-color:var(--fg);stop-opacity:1}80%{stop-color:var(--tq);stop-opacity:.55}}
@media(prefers-reduced-motion:reduce){.street-technical .street-bus-stop,.street-technical .street-light,.street-technical .street-construction,.street-technical .street-ground-guide,.street-flow-stop{animation:none!important;stroke-dashoffset:0}}

/* Existing KPR palette: cool shelter, warm lamp, quiet construction context. */
.street-technical .street-light{stroke-opacity:.9;filter:drop-shadow(0 0 4px #ffb02024)}
.street-technical .street-bench{stroke-width:1.8}.street-technical .street-fine-detail{stroke-width:1;stroke-dasharray:4 5;stroke-opacity:.5}
.street-technical .street-lamp-rays{stroke-opacity:.18}.street-technical .street-lamp-emitter{stroke-dasharray:2 3;stroke:var(--or);filter:drop-shadow(0 0 5px #ffb02066)}
.street-roof-light{stroke-dasharray:12 6;animation:street-roof-flow 9s linear infinite}
.street-warm-stop{animation:street-warm-wave 9s ease-in-out infinite}.street-warm-stop:nth-child(2){animation-delay:-3s}.street-warm-stop:nth-child(3){animation-delay:-6s}
.street-lamp-glow{animation:street-halo-breathe 8s ease-in-out infinite}
@keyframes street-warm-wave{0%,100%{stop-color:var(--mut);stop-opacity:.35}35%{stop-color:var(--or);stop-opacity:.7}60%{stop-color:var(--fg);stop-opacity:1}80%{stop-color:var(--or);stop-opacity:.55}}
@keyframes street-roof-flow{to{stroke-dashoffset:-108}}
@keyframes street-halo-breathe{0%,100%{opacity:.35}50%{opacity:.85}}
@media(prefers-reduced-motion:reduce){.street-warm-stop,.street-roof-light,.street-lamp-glow{animation:none!important;stroke-dashoffset:0}}

/* Airway mannequin shares the luminous technical contour language. */
.airway-demo .airway-body-art>path,.airway-demo .airway-head-art>path,.airway-demo .airway-head-art>ellipse{stroke:url(#airway-wire);stroke-width:1.4;stroke-opacity:.8;stroke-dasharray:7 4;stroke-linecap:round;stroke-linejoin:round;animation:airway-contour-flow 8s linear infinite}
.airway-demo .airway-body-art>path[fill^="url"],.airway-demo .airway-head-art>path[fill^="url"],.airway-demo .airway-head-art>ellipse{fill:var(--s1)}
.airway-demo .airway-body-art>.airway-neck-art{fill:var(--s1);stroke-opacity:.45}
.airway-demo .airway-head-art>path:first-child{stroke-width:1.8;stroke-opacity:1}
.airway-demo .airway-head-art>path:not(:first-child){stroke-dasharray:3 3;stroke-width:1;stroke-opacity:.55}
.airway-demo .airway-arm-contour{fill:var(--s1);stroke-opacity:.55}
.airway-flow-stop{animation:airway-light-wave 7s ease-in-out infinite}.airway-flow-stop:nth-child(2){animation-delay:-2.33s}.airway-flow-stop:nth-child(3){animation-delay:-4.66s}
.airway-demo .airway-motion-guide{stroke:var(--or);filter:drop-shadow(0 0 4px #ffb02033)}
.airway-demo .airway-pose-confirm{stroke:var(--tq)}
@keyframes airway-contour-flow{to{stroke-dashoffset:-132}}
@keyframes airway-light-wave{0%,100%{stop-color:var(--mut);stop-opacity:.5}35%{stop-color:var(--tq);stop-opacity:.8}60%{stop-color:var(--fg);stop-opacity:1}80%{stop-color:var(--tq);stop-opacity:.65}}
@media(prefers-reduced-motion:reduce){.airway-demo .airway-body-art>path,.airway-demo .airway-head-art>path,.airway-demo .airway-head-art>ellipse,.airway-flow-stop{animation:none!important;stroke-dashoffset:0}}

/* Listening/looking posture illustration: no state, gesture or breathing simulation. */
.breathing-demo{display:block;position:relative;flex:none;width:100%;height:auto;max-height:320px;pointer-events:none}
.breathing-demo .breathing-contours{stroke-dasharray:7 4;animation:airway-contour-flow 8s linear infinite}
.breathing-demo .breathing-rescuer{stroke-opacity:.8}.breathing-demo .breathing-patient{stroke-opacity:1}
.breathing-flow-stop{animation:airway-light-wave 7s ease-in-out infinite}.breathing-flow-stop:nth-child(2){animation-delay:-2.33s}.breathing-flow-stop:nth-child(3){animation-delay:-4.66s}
.breathing-demo .breathing-gaze{animation:breathing-gaze-flow 6s linear infinite}
@keyframes breathing-gaze-flow{to{stroke-dashoffset:-60}}
@media(prefers-reduced-motion:reduce){.breathing-demo .breathing-contours,.breathing-flow-stop,.breathing-demo .breathing-gaze{animation:none!important;stroke-dashoffset:0}}

/* Complete registered photographic poses: the neck is never cut into a moving layer. */
.airway-realistic .airway-photo-pose{transition:opacity calc(var(--normal,240ms) * 2) var(--enter,cubic-bezier(.16,1,.3,1))}
.airway-realistic .airway-neutral-art{opacity:1}.airway-realistic .airway-tilted-art{opacity:0}
.airway-realistic.tilt .airway-neutral-art{opacity:0}.airway-realistic.tilt .airway-tilted-art{opacity:1}
.airway-realistic .airway-photo-guides{animation:airway-contour-flow 8s linear infinite}
@media(prefers-reduced-motion:reduce){.airway-realistic .airway-photo-pose{transition:none!important}.airway-realistic .airway-photo-guides{animation:none!important}}