.hf-reference{display:flex;justify-content:space-between;gap:1rem;align-items:flex-end;margin-bottom:1.5rem;padding:1rem 1.25rem;border-left:4px solid #21c4b6;background:#eaf7f5;color:#123c40}.hf-reference p{margin:0;max-width:70ch}.hf-reference a{color:#075c65;font-weight:800}.hf-device{--hf-navy:#071a26;--hf-screen:#0b2735;--hf-cyan:#26d6c5;--hf-blue:#45a8ff;--hf-yellow:#ffd166;--hf-red:#ff625f;color:#e8f6f5;background:#202a30;border:1px solid #39474e;border-radius:1rem;padding:.75rem;box-shadow:0 1.5rem 3rem rgba(3,20,29,.2)}.hf-bezel{overflow:hidden;border:1px solid #4d5d64;border-radius:.65rem;background:var(--hf-navy)}.hf-device-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1rem;background:#15242c;border-bottom:1px solid #38505a}.hf-device-brand{display:flex;align-items:center;gap:.75rem}.hf-device-brand strong{font-size:1.05rem;letter-spacing:.08em}.hf-device-brand small{display:block;color:#9fb6bd}.hf-mode{padding:.35rem .65rem;border:1px solid #3b7a80;color:#8df5e9;background:#0b333a;border-radius:.25rem;font-size:.75rem;font-weight:800}.hf-clock{font-variant-numeric:tabular-nums;color:#b8cbd0}.hf-alarm{display:flex;align-items:center;gap:.6rem;min-height:2.7rem;padding:.6rem 1rem;border-bottom:1px solid #38505a;background:#14343a;color:#aef6dd;font-weight:750}.hf-alarm::before{content:'●';font-size:.7rem}.hf-alarm.medium{background:#57451d;color:#ffe49b}.hf-alarm.high{background:#6a2528;color:#ffd0cb}.hf-workspace{display:grid;grid-template-columns:15rem minmax(0,1fr) 12rem;min-height:35rem}.hf-controls{padding:1rem;background:#0d222d;border-right:1px solid #34505d}.hf-controls h3,.hf-monitor h3{margin:0 0 .75rem;font-size:.72rem;letter-spacing:.14em;color:#91aab3}.hf-control{display:block;margin-bottom:1rem;padding:.65rem;background:#102e3b;border-left:3px solid var(--hf-cyan)}.hf-control-line{display:flex;justify-content:space-between;gap:.5rem;margin-bottom:.55rem;font-size:.8rem}.hf-control output{color:var(--hf-cyan);font-weight:850;font-variant-numeric:tabular-nums}.hf-control input,.hf-control select{width:100%;accent-color:var(--hf-cyan)}.hf-control select{padding:.45rem;border:1px solid #49626c;background:#09232e;color:#fff}.hf-center{min-width:0;padding:1rem;background:var(--hf-screen)}.hf-scenario-copy{display:flex;justify-content:space-between;gap:1rem;margin-bottom:.8rem}.hf-scenario-copy strong{color:#fff}.hf-scenario-copy small{color:#9bb4bd;max-width:34rem;text-align:right}.hf-chart{position:relative;margin-bottom:.65rem;padding:.55rem .65rem .25rem;background:#071e2a;border:1px solid #244654}.hf-chart-title{display:flex;justify-content:space-between;font-size:.7rem;color:#9bb5bf}.hf-chart-title b{font-size:.8rem;color:#d4e7ea}.hf-chart svg{display:block;width:100%;height:5.75rem;margin-top:.35rem;background-image:linear-gradient(#153845 1px,transparent 1px),linear-gradient(90deg,#153845 1px,transparent 1px);background-size:20% 50%}.hf-chart polyline{fill:none;stroke-width:3;vector-effect:non-scaling-stroke}.hf-chart.flow polyline{stroke:var(--hf-cyan)}.hf-chart.spo2 polyline{stroke:var(--hf-blue)}.hf-chart.rr polyline{stroke:var(--hf-yellow)}.hf-effect-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.75rem}.hf-effect{padding:.65rem;border:1px solid #31515e;background:#0c2b37}.hf-effect span{display:block;color:#98b1ba;font-size:.67rem;text-transform:uppercase}.hf-effect strong{display:block;margin:.25rem 0;color:#fff;font-size:1.05rem}.hf-effect small{display:block;color:#8fa8b0;line-height:1.3}.hf-coverage{height:.3rem;margin-top:.55rem;background:#173f4c}.hf-coverage i{display:block;height:100%;background:var(--hf-cyan);transition:width .25s}.hf-monitor{padding:1rem;background:#0a1f29;border-left:1px solid #34505d}.hf-vital{margin-bottom:.8rem;padding:.75rem;border:1px solid #2c4c58}.hf-vital span{display:block;color:#9db3ba;font-size:.66rem;letter-spacing:.08em}.hf-vital strong{display:block;margin:.2rem 0;color:#fff;font-size:2rem;line-height:1;font-variant-numeric:tabular-nums}.hf-vital small{color:#7f9aa3}.hf-vital.spo2 strong{color:var(--hf-blue)}.hf-vital.rr strong{color:var(--hf-yellow)}.hf-vital.rox strong{color:var(--hf-cyan)}.hf-bottom{display:grid;grid-template-columns:1fr 1fr;gap:1rem;padding:1rem;background:#111e25;border-top:1px solid #38505a}.hf-button-group{display:flex;flex-wrap:wrap;gap:.4rem}.hf-button-group span{width:100%;font-size:.67rem;letter-spacing:.12em;color:#91aab3}.hf-button-group button{padding:.5rem .65rem;border:1px solid #4a6068;border-radius:.25rem;background:#1a2b33;color:#dcebed;cursor:pointer}.hf-button-group button:hover,.hf-button-group button:focus-visible,.hf-button-group button.active{border-color:var(--hf-cyan);background:#16474b;color:#fff}.hf-button-group.faults button.active:not(:first-of-type){border-color:var(--hf-red);background:#63282b}.hf-disclaimer{margin:1rem 0 0;padding:.85rem 1rem;border:1px dashed #b8c7c9;color:#49646a;font-size:.8rem}.night .hf-reference{background:#12363a;color:#dcefee}.night .hf-reference a{color:#7fe7dc}@media(max-width:1050px){.hf-workspace{grid-template-columns:13rem minmax(0,1fr)}.hf-monitor{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;border-left:0;border-top:1px solid #34505d}.hf-monitor h3{grid-column:1/-1}.hf-vital{margin:0}}@media(max-width:720px){.hf-reference,.hf-scenario-copy{align-items:flex-start;flex-direction:column}.hf-scenario-copy small{text-align:left}.hf-workspace{display:block}.hf-controls{border-right:0;border-bottom:1px solid #34505d}.hf-controls{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}.hf-controls h3{grid-column:1/-1}.hf-control{margin:0}.hf-monitor{grid-template-columns:1fr 1fr}.hf-vital.rox{grid-column:1/-1}.hf-effect-grid,.hf-bottom{grid-template-columns:1fr}.hf-device{padding:.35rem}.hf-device-head{align-items:flex-start;flex-wrap:wrap}}@media(max-width:420px){.hf-controls,.hf-monitor{display:block}.hf-control,.hf-vital{margin-bottom:.6rem}.hf-effect-grid{display:block}.hf-effect{margin-bottom:.5rem}}
@media print{.hf-device{box-shadow:none}.hf-button-group{display:none}}

/* Celular: cabecera en columna, sliders altos y graficos mas legibles. */
@media(max-width:560px){.hf-device-head{flex-direction:column;align-items:flex-start;gap:.35rem}.hf-device-brand{flex-direction:column;align-items:flex-start;gap:.1rem}.hf-device-brand strong{font-size:.95rem}.hf-clock{align-self:flex-end;margin-top:-1.4rem}.hf-control{padding:.75rem .7rem}.hf-control-line{font-size:.85rem}.hf-control input[type=range]{height:1.6rem}.hf-control select{padding:.6rem}.hf-chart svg{height:4.6rem}.hf-effect strong{font-size:1.15rem}.hf-vital strong{font-size:1.7rem}.hf-button-group button{flex:1 1 45%;padding:.65rem .5rem;text-align:center}.hf-disclaimer{font-size:.85rem;line-height:1.5}}
