/* CardioIA · login skin v3 (Cortech). Solo presentacion: no toca la logica del formulario. */
:root{--cx-ink:#0f2c3d;--cx-muted:#5f7787;--cx-line:#d6e3ea;--cx-pri:#1690c8;--cx-pri2:#0b5f94;--cx-teal:#19b8c9;--cx-bg:#eef5f8;--login-panel-h:452px}
html,body{height:auto}
body{display:block!important;margin:0!important;padding:0!important;min-height:100vh;min-height:100dvh;background:var(--cx-bg)!important;font-family:'Plus Jakarta Sans','Jost',system-ui,sans-serif!important;color:var(--cx-ink);-webkit-font-smoothing:antialiased}
.cx-shell{min-height:100vh;min-height:100dvh;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr)}
/* Panel de marca */
.cx-brand{position:relative;overflow:hidden;color:#e6f5fa;padding:clamp(40px,6vw,84px) clamp(32px,5.5vw,88px) 140px;display:flex;flex-direction:column;justify-content:center;
  background:radial-gradient(ellipse 70% 55% at 85% 8%,rgba(25,184,201,.22),transparent 60%),radial-gradient(ellipse 55% 45% at 0% 100%,rgba(239,59,74,.10),transparent 60%),linear-gradient(160deg,#03202f 0%,#063a54 52%,#0a5f80 100%)}
.cx-brand::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:32px 32px;-webkit-mask-image:linear-gradient(180deg,#000 10%,transparent 95%);mask-image:linear-gradient(180deg,#000 10%,transparent 95%);pointer-events:none}
.cx-blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.5;pointer-events:none;animation:cx-float 14s ease-in-out infinite alternate}
.cx-b1{width:340px;height:340px;right:-90px;top:-80px;background:#13a7c4}
.cx-b2{width:260px;height:260px;left:-80px;bottom:40px;background:#1d5fae;animation-delay:-6s}
@keyframes cx-float{to{transform:translate(-24px,30px) scale(1.08)}}
.cx-brand-in{position:relative;z-index:1;max-width:520px}
.cx-logo{display:flex;align-items:center;gap:14px;margin-bottom:34px}
.cx-mark{flex:none;width:56px;height:56px;border-radius:16px;display:block;box-shadow:0 12px 28px rgba(0,0,0,.32),0 0 0 1px rgba(255,255,255,.18)}
.cx-mark svg,.cx-auth .panel-icon-gestor svg{display:block;width:100%;height:100%;border-radius:inherit}
.cx-lg-heart{transform-box:fill-box;transform-origin:50% 55%;animation:cx-heart 2.4s ease-in-out infinite}
.cx-m-ghost,.cx-m-run{fill:none;stroke-linecap:round;stroke-linejoin:round}
.cx-m-ghost{stroke:#b7e7ee;stroke-width:2.4}
.cx-m-run{stroke:#12b6c9;stroke-width:2.8;stroke-dasharray:28 72;animation:cx-mrun 1.7s linear infinite}
.cx-m-heart{fill:#ef3b4a;transform-box:fill-box;transform-origin:center;animation:cx-heart 1.7s ease-in-out infinite}
@keyframes cx-mrun{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes cx-heart{0%,58%,100%{transform:scale(1)}66%{transform:scale(1.16)}76%{transform:scale(.97)}86%{transform:scale(1.08)}}
.cx-name{font-size:1.7rem;font-weight:800;letter-spacing:-.02em;color:#fff}
.cx-eyebrow{margin:0 0 12px;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#7fdbe6}
.cx-title{margin:0 0 16px;font-size:clamp(1.9rem,3.1vw,2.75rem);line-height:1.12;font-weight:800;letter-spacing:-.025em;color:#fff;text-wrap:balance}
.cx-lead{margin:0 0 34px;font-size:1.02rem;line-height:1.6;color:#b9d6e2;max-width:460px}
.cx-feats{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.cx-feats li{display:flex;gap:14px;align-items:flex-start}
.cx-feats li>div{min-width:0}
.cx-feats .cx-ic{flex:none;box-sizing:border-box;width:40px;height:40px;padding:0;margin:0;border-radius:12px;display:flex;align-items:center;justify-content:center;line-height:0;background:rgba(255,255,255,.07);border:1px solid rgba(160,225,240,.22)}
.cx-feats .cx-ic svg{display:block;flex:none;width:22px;height:22px;margin:0;fill:none;stroke:#9ae8f1;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.cx-feats b{display:block;font-size:.95rem;line-height:22px;font-weight:700;color:#fff;margin:9px 0 3px}
.cx-feats li>div>span{display:block;font-size:.88rem;line-height:1.5;color:#a9c8d6}
.cx-ecg{position:absolute;left:0;right:0;bottom:36px;width:100%;height:84px;pointer-events:none}
.cx-ecg path{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.cx-ecg-base{stroke:rgba(143,227,238,.16);stroke-width:1.5}
.cx-ecg-run{stroke:#5fe0ee;stroke-width:2.2;stroke-dasharray:170 830;filter:drop-shadow(0 0 6px rgba(95,224,238,.75));animation:cx-sweep 4.2s linear infinite}
@keyframes cx-sweep{from{stroke-dashoffset:1000}to{stroke-dashoffset:0}}
/* Lado del acceso */
.cx-auth{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:56px 24px 22px;background:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(22,144,200,.08),transparent 70%),var(--cx-bg)}
.cx-auth .main{position:relative;z-index:1;width:100%!important;max-width:420px!important;margin:auto 0;background:#fff!important;border-radius:22px!important;box-shadow:0 30px 70px rgba(6,42,62,.16),0 6px 18px rgba(6,42,62,.07),0 0 0 1px rgba(6,42,62,.06)!important;animation:cx-in .6s cubic-bezier(.22,1,.36,1) both}
@keyframes cx-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.cx-auth .signup{background:#fff}
.cx-auth .login{background:#f7f9fc}
.cx-auth .login-panel{padding:30px 32px 10px}
.cx-auth .panel-icon{width:50px;height:50px;border-radius:15px;font-size:1.2rem;margin-bottom:14px}
.cx-auth .panel-icon{width:56px;height:56px;border-radius:16px}
.cx-auth .panel-icon-gestor{background:none;box-shadow:0 10px 24px rgba(22,144,200,.3)}
.cx-auth .panel-icon-ocp{background:linear-gradient(135deg,#7a64b8,#3d3360);box-shadow:0 10px 24px rgba(93,78,140,.32)}
.cx-ocp-svg{width:28px;height:28px;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cx-auth .main.has-login-error .panel-icon,.cx-auth .main.has-ocp-auth .login .panel-icon{width:42px;height:42px;border-radius:13px}
.cx-auth .main.has-login-error .cx-ocp-svg,.cx-auth .main.has-ocp-auth .login .cx-ocp-svg{width:22px;height:22px}
.cx-auth .panel-title{font-size:1.3rem;font-weight:800;letter-spacing:-.015em;color:var(--cx-ink)}
.cx-auth .panel-subtitle{font-size:.88rem;color:var(--cx-muted);margin:6px 0 22px}
.cx-auth .field-group{margin-bottom:14px}
.cx-auth .field-group label{font-size:.72rem;font-weight:700;letter-spacing:.06em;color:#4f6a7a;margin-bottom:7px}
.cx-auth .login-form input[type=text],.cx-auth .login-form input[type=password]{height:48px;border-radius:12px;border:1px solid var(--cx-line);background:#f8fbfc;font-family:inherit;font-size:.95rem;color:var(--cx-ink);padding-left:42px}
.cx-auth .login-form input::placeholder{color:#9aaeb9}
.cx-auth .login-form input:hover{border-color:#bfd2dd}
.cx-auth .login-form input:focus{border-color:var(--cx-pri);background:#fff;box-shadow:0 0 0 4px rgba(22,144,200,.16)}
.cx-auth #formSupervisores .login-form input:focus{border-color:#6b56a8;box-shadow:0 0 0 4px rgba(107,86,168,.16)}
.cx-auth .input-wrap>i{left:15px;color:#8aa2b0;transition:color .2s}
.cx-auth .input-wrap:focus-within>i{color:var(--cx-pri)}
.cx-auth .input-wrap.cx-has-eye input{padding-right:46px}
.cx-eye{all:unset;box-sizing:border-box;position:absolute;right:6px;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:10px;display:grid;place-items:center;cursor:pointer;color:#7d95a3;transition:background .15s,color .15s}
.cx-eye:hover{background:#edf3f6;color:var(--cx-ink)}
.cx-eye:focus-visible{outline:2px solid var(--cx-pri);outline-offset:1px}
.cx-eye svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.cx-eye .cx-off{display:none}.cx-eye[aria-pressed=true] .cx-on{display:none}.cx-eye[aria-pressed=true] .cx-off{display:block}
.cx-auth .btn-ingresar{height:50px;border-radius:13px;margin-top:8px;font-family:inherit;font-weight:700;letter-spacing:.01em;background:linear-gradient(135deg,#1aa3d6,#0b5f94);box-shadow:0 12px 26px rgba(11,95,148,.28)}
.cx-auth .btn-ingresar-ocp{background:linear-gradient(135deg,#6b56a8,#3d3360);box-shadow:0 12px 26px rgba(61,51,96,.28)}
.cx-auth .btn-ingresar:focus-visible,.cx-auth .btn-alt:focus-visible{outline:3px solid rgba(22,144,200,.45);outline-offset:2px}
.cx-auth .btn-alt{border-radius:12px;font-family:inherit;border-color:var(--cx-line)}
.cx-auth .login-alert{border-radius:12px}
.cx-auth .access-switch{background:#f1f6f9;border-top:1px solid #e3ecf1;color:#2f6283;font-weight:700;font-size:.86rem;padding:15px 18px}
.cx-auth .access-switch:hover{background:#e6f0f5}
.cx-auth .access-switch:focus-visible{outline:2px solid var(--cx-pri);outline-offset:-3px}
.cx-auth .login .access-switch{background:#eef0f6;color:#4b4370}
.btn-ingresar.cx-loading{pointer-events:none;filter:saturate(.9) brightness(.97)}
.cx-spin{width:17px;height:17px;border-radius:50%;border:2.4px solid rgba(255,255,255,.4);border-top-color:#fff;animation:cx-rot .7s linear infinite}
@keyframes cx-rot{to{transform:rotate(360deg)}}
.cx-foot{margin-top:26px;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 14px;font-size:.78rem;color:#6d8594;text-align:center}
.cx-foot b{color:#30566c;font-weight:700}
.cx-copy{color:#91a6b2}
/* Fondo animado del lado claro (solo transform/opacity: barato para la CPU) */
.cx-auth{overflow:hidden;--d1:22,160,200;--d2:30,110,190;--d3:25,184,201}
.cx-ocp .cx-auth{--d1:120,96,190;--d2:80,64,150;--d3:150,120,210}
.cx-deco{position:absolute;inset:0;z-index:0;pointer-events:none}
.cx-auth>.main,.cx-auth>.cx-foot{position:relative;z-index:1}
.cx-d{position:absolute;display:block;will-change:transform;animation:cx-drift 26s ease-in-out infinite alternate}
.cx-c{border-radius:50%}
.cx-ring{border:2px solid rgba(var(--d1),.16)}
.cx-fill{background:radial-gradient(circle at 30% 30%,rgba(var(--d3),.16),rgba(var(--d2),.06) 70%)}
.cx-sq{border-radius:28%;border:2px solid rgba(var(--d2),.13)}
.cx-sqf{border-radius:30%;background:linear-gradient(135deg,rgba(var(--d3),.10),rgba(var(--d2),.05))}
.cx-plus{background:linear-gradient(rgba(var(--d1),.20),rgba(var(--d1),.20)) center/100% 30% no-repeat,linear-gradient(rgba(var(--d1),.20),rgba(var(--d1),.20)) center/30% 100% no-repeat;border-radius:4px}
.cx-d1{width:220px;height:220px;top:-60px;right:-50px;animation-duration:30s}
.cx-d2{width:150px;height:150px;bottom:8%;left:-40px;animation-name:cx-drift2;animation-duration:24s}
.cx-d3{width:74px;height:74px;top:16%;left:9%;animation-name:cx-spin;animation-duration:40s}
.cx-d4{width:26px;height:26px;top:28%;right:11%;animation-name:cx-bob;animation-duration:9s}
.cx-d5{width:18px;height:18px;bottom:22%;right:20%;animation-name:cx-bob;animation-duration:11s;animation-delay:-4s}
.cx-d6{width:110px;height:110px;bottom:-30px;right:12%;animation-name:cx-spin;animation-duration:55s;animation-direction:reverse}
.cx-d7{width:46px;height:46px;top:58%;left:14%;animation-name:cx-drift2;animation-duration:18s}
.cx-d8{width:20px;height:20px;top:9%;left:42%;animation-name:cx-bob;animation-duration:13s;animation-delay:-7s}
.cx-dtrace{position:absolute;left:-5%;width:110%;height:70px;top:70%;opacity:.55;animation:cx-glow 7s ease-in-out infinite}
.cx-dtrace path{fill:none;stroke:rgba(var(--d1),.22);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
@keyframes cx-drift{0%{transform:translate(0,0)}100%{transform:translate(-26px,34px)}}
@keyframes cx-drift2{0%{transform:translate(0,0)}100%{transform:translate(30px,-24px)}}
@keyframes cx-spin{0%{transform:translate(0,0) rotate(0)}50%{transform:translate(10px,-14px) rotate(45deg)}100%{transform:translate(0,0) rotate(90deg)}}
@keyframes cx-bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-16px) rotate(90deg)}}
@keyframes cx-glow{0%,100%{opacity:.35}50%{opacity:.75}}
/* v3: figuras viajeras (posicion por JS) */
.cx-deco-js .cx-d{left:0;top:0;bottom:auto;right:auto;animation:none!important;transform-origin:50% 50%;backface-visibility:hidden}
.cx-k-ring{border-radius:50%;border:2px solid rgba(var(--d1),.36)}
.cx-k-fill{border-radius:50%;background:radial-gradient(circle at 32% 30%,rgba(var(--d3),.34),rgba(var(--d2),.12) 68%,transparent 72%)}
.cx-k-sq{border-radius:28%;border:2px solid rgba(var(--d2),.34)}
.cx-k-sqf{border-radius:30%;background:linear-gradient(135deg,rgba(var(--d3),.24),rgba(var(--d2),.10))}
.cx-k-plus{border-radius:4px;background:linear-gradient(rgba(var(--d1),.44),rgba(var(--d1),.44)) center/100% 30% no-repeat,linear-gradient(rgba(var(--d1),.44),rgba(var(--d1),.44)) center/30% 100% no-repeat}
.cx-k-dot{border-radius:50%;background:rgba(var(--d2),.40)}
.cx-far{filter:blur(.5px)}
.cx-near.cx-k-sq{border-width:2px}
@media (max-width:980px){.cx-deco-js .cx-d{display:block}}
/* Tablet / movil */
@media (max-width:980px){
  .cx-shell{grid-template-columns:1fr}
  .cx-brand{padding:34px 26px 92px;justify-content:flex-start}
  .cx-brand-in{max-width:640px}
  .cx-logo{margin-bottom:20px}
  .cx-title{font-size:clamp(1.45rem,5.2vw,2rem)}
  .cx-lead{margin-bottom:22px;font-size:.95rem}
  .cx-feats{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .cx-feats li{flex-direction:column;gap:8px}
  .cx-feats b{margin-top:2px}
  .cx-ecg{bottom:24px;height:56px}
  .cx-auth{justify-content:flex-start;padding:0 16px 22px;margin-top:-52px;background:transparent}
  .cx-deco{top:52px}
  .cx-d1{width:170px;height:170px;top:auto;bottom:34%;right:-70px}
  .cx-d3,.cx-d5,.cx-d8,.cx-dtrace{display:none}
  .cx-d2{bottom:-50px}.cx-d6{bottom:-60px}
}
@media (max-width:640px){
  .cx-brand{padding:22px 20px 84px}
  .cx-logo{gap:11px;margin-bottom:16px;padding-right:96px}
  .cx-mark{width:46px;height:46px;border-radius:13px}
  .cx-name{font-size:1.35rem}
  .cx-eyebrow{font-size:.7rem;margin-bottom:8px}
  .cx-title{font-size:1.38rem;margin-bottom:8px}
  .cx-lead{font-size:.88rem;margin-bottom:0}
  .cx-feats{display:none}
  .cx-auth .login-panel{padding:24px 20px 8px}
  .cx-auth .main{border-radius:18px!important}
  .cx-auth .login-form input[type=text],.cx-auth .login-form input[type=password]{font-size:16px}
}
@media (prefers-reduced-motion:reduce){.cx-d,.cx-dtrace,.cx-lg-heart,.cx-blob,.cx-ecg-run,.cx-m-run,.cx-m-heart,.cx-auth .main,.cx-spin{animation:none!important}.cx-ecg-run{stroke-dasharray:none}}