:root{
  font-family:Inter,'Segoe UI',Arial,sans-serif;
  color:#1b3269;
  --ink:#1b3269; --muted:#657ba5; --blue:#3875fa; --mint:#19c7b0; --violet:#9176ea;
  --glass-border:rgba(255,255,255,.92);
  --glass:linear-gradient(146deg,rgba(255,255,255,.65),rgba(235,243,255,.4) 58%,rgba(233,234,255,.49));
}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0}
body{
  position:relative;min-width:320px;overflow-x:hidden;
  background:radial-gradient(ellipse at 7% 11%,rgba(125,185,255,.36),transparent 35%),
    radial-gradient(ellipse at 94% 7%,rgba(182,145,255,.34),transparent 37%),
    radial-gradient(ellipse at 42% 88%,rgba(61,206,242,.24),transparent 45%),
    linear-gradient(128deg,#dbe8ff 2%,#edf1ff 45%,#e7e0ff 100%);
  background-attachment:fixed;
}
body:after{
  content:'';position:fixed;z-index:0;inset:auto -10% -110px -10%;height:235px;
  background:linear-gradient(145deg,transparent 5%,rgba(92,184,254,.15) 24%,rgba(255,255,255,.36) 35%,rgba(157,125,243,.15) 68%,transparent 90%);
  border-radius:48% 49% 0 0/78% 65% 0 0;transform:rotate(-5deg);pointer-events:none;
}
.ambient{position:fixed;z-index:0;pointer-events:none;border-radius:50%;filter:blur(35px)}
.ambient-a{width:360px;height:360px;left:-150px;bottom:-140px;background:rgba(31,186,235,.18)}
.ambient-b{width:440px;height:380px;right:-170px;top:-110px;background:rgba(147,99,238,.18)}
.ambient-c{width:300px;height:300px;left:46%;top:28%;background:rgba(98,163,255,.08)}
button,input{font:inherit}button{cursor:pointer}
button:focus-visible,input:focus-visible{outline:3px solid #7db7ff;outline-offset:3px}
.glass-edge{
  border:1.5px solid var(--glass-border);background:var(--glass);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.98),inset 0 -2px 0 rgba(164,184,240,.18),
    0 6px 0 rgba(161,186,246,.38),0 20px 42px rgba(55,88,164,.15);
  backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);
}
.login-layout{
  position:relative;z-index:1;max-width:1760px;min-height:100dvh;
  margin:0 auto;padding:31px clamp(24px,3.2vw,58px) 24px;
  display:grid;grid-template-columns:minmax(0,1.12fr) minmax(430px,.88fr);align-items:center;gap:clamp(38px,4.4vw,76px);
}
.story-column{min-width:0;align-self:stretch;display:flex;flex-direction:column;justify-content:space-between;position:relative;isolation:isolate}
.masthead{align-self:flex-start;display:flex;align-items:center;gap:13px;min-width:525px;max-width:660px;padding:8px 13px;border-radius:32px;position:relative}
.masthead:after,.signin-card:before,.health-dashboard:before{content:'';position:absolute;pointer-events:none;left:16px;right:16px;top:8px;height:37%;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.68),transparent)}
.logo{width:52px;height:52px;padding:6px;border-radius:15px;background:#fff;display:grid;place-items:center;box-shadow:0 6px 18px rgba(70,98,166,.16)}
.logo img{width:100%;height:100%;object-fit:contain}
.brand{display:flex;flex-direction:column}
.brand strong{font-size:26px;font-weight:900;letter-spacing:-1px;line-height:1.05}
.brand small{font-size:11px;font-weight:700;color:#657fa4;margin-top:5px}
.brand-divider{width:1px;height:30px;margin:0 7px 0 9px;background:linear-gradient(180deg,transparent,#83a0d0,transparent)}
.brand-description{font-size:15px;color:#31558a;white-space:nowrap}
.intro{position:relative;z-index:2;max-width:790px;padding-left:12px;margin:22px 0 5px}
.eyebrow{display:inline-flex;gap:12px;align-items:center;letter-spacing:2.1px;color:#355986;font-size:11px;font-weight:900}
.glass-small{border:1px solid #fff;border-radius:999px;background:linear-gradient(160deg,rgba(255,255,255,.77),rgba(235,245,255,.61));box-shadow:inset 0 1px white,0 4px 0 rgba(172,203,242,.48),0 10px 20px rgba(66,101,165,.12);padding:9px 15px}
.live-dot,.secure-dot{display:inline-block;width:9px;height:9px;flex:none;border-radius:50%;background:#16c8ac;box-shadow:0 0 0 5px rgba(22,200,172,.13),0 0 12px rgba(22,200,172,.4)}
.intro h1{font-weight:900;font-size:clamp(39px,3.9vw,65px);line-height:1.04;letter-spacing:-2.6px;color:#1e376d;margin:22px 0 15px}
.intro h1 em{font-style:normal;background:linear-gradient(95deg,#2777f1,#1eabd0 44%,#14ba9e 75%,#8d68e9);-webkit-background-clip:text;background-clip:text;color:transparent}
.intro p{color:#455e86;max-width:520px;font-size:14px;line-height:1.72;margin:0}
.orbit-scene{position:absolute;pointer-events:none;width:min(39vw,440px);height:360px;right:-3%;top:15%;z-index:1;perspective:600px}
.orbit{position:absolute;width:75%;height:39%;left:12%;top:41%;border:2px solid rgba(117,218,255,.73);border-radius:50%;transform:rotate(-25deg);box-shadow:0 0 12px rgba(73,222,255,.28),inset 0 0 9px rgba(255,255,255,.28);animation:orbit-breathe 6s ease-in-out infinite alternate}
.orbit-two{width:91%;height:34%;left:6%;top:44%;border-color:rgba(255,255,255,.7);transform:rotate(18deg);animation-duration:8s}
.orbit-shield{position:absolute;top:35%;left:31%;width:42%;filter:drop-shadow(0 16px 20px rgba(34,85,184,.26));animation:shield-float 6s ease-in-out infinite;transform-origin:center}
.orbit-shield svg{width:100%;height:auto;display:block}
.health-chip{position:absolute;display:grid;place-items:center;color:#e8fcff;border:1.8px solid rgba(255,255,255,.85);border-radius:17px;background:linear-gradient(135deg,rgba(117,184,255,.55),rgba(163,143,248,.25));box-shadow:inset 0 2px 0 rgba(255,255,255,.54),0 12px 24px rgba(72,113,182,.17);backdrop-filter:blur(8px);animation:chip-float 8s ease-in-out infinite alternate}
.health-chip svg{width:48%;height:48%;filter:drop-shadow(0 3px 4px rgba(60,99,171,.25))}
.health-cross{left:30%;top:0%;height:74px;width:70px;transform:rotate(12deg)}
.health-heart{left:58%;top:14%;height:75px;width:75px;animation-delay:-3s;transform:rotate(-11deg)}
.health-people{left:3%;top:26%;height:66px;width:66px;animation-delay:-1s;transform:rotate(10deg)}
.health-hospital{right:3%;top:28%;height:68px;width:67px;animation-delay:-5s;transform:rotate(13deg)}
.spark{position:absolute;width:7px;height:7px;border-radius:50%;background:white;box-shadow:0 0 16px 5px rgba(70,200,255,.45);animation:spark-pulse 3.8s ease-in-out infinite alternate}
.spark-1{left:7%;top:11%}.spark-2{right:3%;top:10%;animation-delay:-2s}.spark-3{left:18%;bottom:16%;animation-delay:-1s}
.health-dashboard{position:relative;max-width:835px;min-height:205px;border-radius:34px;margin:26px 0 0;padding:28px 30px;display:flex;align-items:center;overflow:visible;background:linear-gradient(132deg,rgba(75,153,238,.32),rgba(60,164,239,.21) 55%,rgba(234,245,255,.63));box-shadow:inset 0 2px rgba(255,255,255,.98),inset 0 -2px rgba(125,172,237,.16),0 6px 0 rgba(144,180,236,.40),0 24px 45px rgba(54,102,172,.18)}
.monitor-head{display:flex;gap:12px;align-items:center;align-self:flex-start;z-index:2;position:relative;min-width:150px;padding-top:8px}
.monitor-head-icon{font-size:42px;line-height:1;color:white;text-shadow:0 2px 10px rgba(32,108,212,.35)}
.monitor-head strong{color:#fff;font-size:15px;line-height:1.18;text-shadow:0 2px 7px rgba(31,97,196,.23)}
.monitor-head small{display:flex;align-items:center;gap:8px;color:#eefbff;font-size:10px;font-weight:800;margin-top:12px;white-space:nowrap}
.monitor-head small .live-dot{width:6px;height:6px;box-shadow:0 0 10px 2px #3bfae4}
.monitor-trace{position:absolute;inset:18px 25px 10px 155px;border-radius:22px;overflow:hidden;background:repeating-linear-gradient(0deg,transparent 0 29px,rgba(214,244,255,.17) 29px 30px),repeating-linear-gradient(90deg,transparent 0 50px,rgba(214,244,255,.15) 50px 51px)}
.monitor-trace svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 0 7px rgba(54,255,243,.50))}
.ecg-grid{stroke:rgba(219,250,255,.16);stroke-width:1;stroke-dasharray:5 7}
.ecg-path{stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1160;stroke-dashoffset:1160;animation:ecg-write 7.5s ease-in-out infinite}
.ecg-glow{opacity:.5;filter:blur(2.6px)}
.mini-bi{position:absolute;z-index:3;right:-10px;top:-30px;width:240px;height:176px;border-radius:26px;padding:16px 18px;background:linear-gradient(130deg,rgba(173,218,255,.85),rgba(153,176,255,.72),rgba(230,230,255,.65));box-shadow:inset 0 2px white,0 5px 0 rgba(165,193,244,.56),0 22px 40px rgba(47,93,169,.22);animation:chip-float 7s ease-in-out infinite alternate}
.mini-bi-heading{display:flex;align-items:center;gap:9px;font-size:14px;color:#173a7a;position:relative;z-index:2}
.mini-icon{font-size:24px;color:#237cda}
.mini-chart{position:absolute;inset:52px 14px 14px;display:flex;gap:12px;align-items:flex-end;justify-content:center}
.bi-bar{width:25px;height:var(--height);border-radius:8px 8px 4px 4px;background:linear-gradient(90deg,var(--dark),var(--bright) 45%,var(--dark));box-shadow:inset 0 2px 0 #fff9,inset 0 -5px 11px #1a3c8425,5px 7px 10px #2c60ab28;animation:bar-grow 1.25s cubic-bezier(.23,.8,.25,1) backwards;transform-origin:bottom}
.bi-bar:before{content:'';display:block;height:9px;margin-top:-5px;border-radius:50%;background:linear-gradient(#fff,var(--bright));box-shadow:0 1px 3px #174cac33}
.bar-one{--height:32%;--bright:#90d9ff;--dark:#2d9bdf;animation-delay:.15s}.bar-two{--height:52%;--bright:#71e8ff;--dark:#29a8d2;animation-delay:.25s}.bar-three{--height:64%;--bright:#55e6b3;--dark:#15a89a;animation-delay:.35s}.bar-four{--height:81%;--bright:#ffcc6d;--dark:#ec8b37;animation-delay:.45s}.bar-five{--height:94%;--bright:#cb97ff;--dark:#8258d4;animation-delay:.55s}
.mini-trend{position:absolute;inset:-12px 3px 26px;pointer-events:none;filter:drop-shadow(0 1px 4px #5283e3c0)}.mini-trend svg{width:100%;height:100%}
.benefits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:15px 0 8px;max-width:830px}
.benefit{padding:11px 10px;min-width:0;display:flex;align-items:center;gap:11px;border-radius:19px;background:linear-gradient(150deg,rgba(255,255,255,.80),rgba(223,237,255,.58));box-shadow:inset 0 1px white,0 4px 0 rgba(154,190,245,.35),0 8px 16px rgba(64,93,167,.09)}
.benefit span{font-size:22px;color:#2585de;font-weight:800;line-height:1}.benefit small{font-size:10px;font-weight:750;color:#28508a;line-height:1.22}
.form-column{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;min-width:0;isolation:isolate;padding:20px 0 0}
.signin-layer{position:absolute;z-index:-1;border-radius:46px;border:1.5px solid rgba(255,255,255,.58);background:linear-gradient(120deg,rgba(179,185,252,.30),rgba(139,186,255,.16));box-shadow:0 12px 34px rgba(96,91,201,.08);pointer-events:none}
.layer-back{width:100%;max-width:610px;height:83%;right:-3%;top:1%;transform:rotate(6deg)}.layer-mid{width:100%;max-width:610px;height:85%;right:-1%;top:1%;transform:rotate(-3deg)}
.signin-card{position:relative;z-index:1;width:100%;max-width:565px;min-height:650px;border-radius:43px;padding:39px clamp(28px,3.1vw,48px) 35px;background:radial-gradient(circle at 50% 1%,rgba(226,245,255,.83),transparent 38%),linear-gradient(149deg,rgba(255,255,255,.83),rgba(241,246,255,.68) 61%,rgba(225,228,255,.71));box-shadow:inset 0 2px rgba(255,255,255,.98),inset 0 -5px rgba(155,169,241,.10),0 7px 0 rgba(167,186,249,.43),0 33px 58px rgba(58,83,168,.17)}
.signin-heading{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative}
.signin-lock-row{height:112px;width:100%;display:flex;align-items:center;justify-content:center;gap:9px;color:#94dfff;margin-bottom:6px}
.heartbeat-decoration{display:block;width:82px;opacity:.7;filter:drop-shadow(0 0 4px rgba(116,227,255,.7));animation:spark-pulse 4.4s ease-in-out infinite alternate}.heartbeat-decoration svg{width:100%}.heartbeat-decoration.flipped{transform:scaleX(-1);animation-delay:-2s}
.signin-icon{display:grid;place-items:center;position:relative;flex:none;width:78px;height:78px;border-radius:25px;background:linear-gradient(144deg,#56baff,#307bf2 53%,#6548e5);border:2px solid rgba(255,255,255,.78);color:#fff;box-shadow:inset 0 2px rgba(255,255,255,.65),inset 0 -3px rgba(40,44,183,.26),0 7px 0 rgba(159,188,249,.57),0 15px 24px rgba(57,99,221,.25)}
.signin-icon:before,.signin-icon:after{content:'';position:absolute;inset:-12px;border:2px solid rgba(131,200,255,.34);border-radius:50%;pointer-events:none;animation:shield-ring 4.5s ease-out infinite}
.signin-icon:after{inset:-25px;animation-delay:1.6s;opacity:.5}
.signin-subtitle{font-size:11px;font-weight:900;letter-spacing:2.1px;color:#4a70a9;margin-top:5px}
.signin-heading h2{font-weight:900;font-size:clamp(27px,2.45vw,34px);letter-spacing:-1px;line-height:1.2;margin:17px 0 9px;white-space:nowrap}
.signin-heading h2 em{font-style:normal;color:#3473f5}
.signin-heading p{max-width:390px;margin:0 0 28px;line-height:1.7;font-size:13px;color:#62779e}
#login-form{position:relative}
#login-form label{display:block;font-weight:850;font-size:12px;color:#294777;margin:0 0 9px}
.field-shell{display:flex;align-items:center;gap:14px;height:58px;padding:0 17px;margin:0 0 22px;border-radius:19px;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(243,249,255,.72));border:1.5px solid #c4d7ff;box-shadow:inset 0 2px rgba(255,255,255,.98),inset 0 -2px rgba(146,173,233,.13),0 5px 8px rgba(83,123,191,.10)}
.field-shell:focus-within{border-color:#7caeff;box-shadow:0 0 0 4px rgba(91,155,251,.17),inset 0 2px rgba(255,255,255,.98),0 6px 16px rgba(70,128,220,.12)}
.field-shell>svg{flex:none;color:#6e91c5}
.field-shell input{min-width:0;flex:1;height:100%;border:0;outline:0;background:transparent;color:#1b396e;font-size:14px;font-weight:650}
.field-shell input::placeholder{color:#9aaed0;font-weight:500}
.password-toggle{flex:none;display:grid;place-items:center;padding:6px;border-radius:10px;border:0;background:transparent;color:#7291c4}
.password-toggle:hover{background:rgba(97,155,248,.10)}
.error{background:#fff0f3;color:#a52c48;padding:12px 13px;border:1px solid #f2bfc8;border-radius:13px;margin:-6px 0 14px;font-size:12px;font-weight:700}
.error[hidden]{display:none}
.submit{display:flex;align-items:center;justify-content:center;gap:18px;width:100%;height:62px;margin-top:4px;border-radius:20px;border:1.5px solid rgba(226,245,255,.92);color:white;font-size:16px;font-weight:900;background:linear-gradient(115deg,#1ad4e8 0%,#3079f5 58%,#653de3 100%);box-shadow:inset 0 2px rgba(255,255,255,.66),inset 0 -3px rgba(36,39,168,.40),0 6px 0 rgba(152,173,236,.55),0 16px 23px rgba(50,83,183,.20);text-shadow:0 1px 2px rgba(27,55,141,.25);transition:transform .17s ease,box-shadow .17s ease,filter .17s ease}
.submit span:last-child{font-size:23px;line-height:1}
.submit:not(:disabled):hover{transform:translateY(-2px);filter:brightness(1.045);box-shadow:inset 0 2px rgba(255,255,255,.66),0 8px 0 rgba(152,173,236,.50),0 18px 25px rgba(50,83,183,.22)}
.submit:disabled{cursor:wait;opacity:.75}
.secure-footer{display:flex;align-items:center;justify-content:center;gap:13px;color:#5d75a1;font-size:11px;font-weight:800;margin:24px 0 0}
.secure-footer .secure-dot{width:8px;height:8px;box-shadow:0 0 0 3px rgba(22,200,172,.12)}
.separator{width:1px;height:13px;background:#b8c8e6}
.floating-cross{position:absolute;right:-37px;bottom:-29px;display:grid;place-items:center;width:72px;height:72px;border-radius:22px;color:#17c8d2;font-size:40px;transform:rotate(18deg);background:linear-gradient(145deg,rgba(255,255,255,.85),rgba(191,237,253,.57));border:2px solid rgba(255,255,255,.82);box-shadow:inset 0 2px rgba(255,255,255,.94),0 15px 24px rgba(63,105,178,.16);pointer-events:none}
.form-legal{color:#61759f;font-size:11px;line-height:1.8;text-align:center;font-weight:700}
@keyframes shield-float{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-10px) rotate(3deg)}}
@keyframes chip-float{0%,100%{translate:0 0}50%{translate:0 -8px}}
@keyframes orbit-breathe{0%{opacity:.64;scale:.95}100%{opacity:1;scale:1.06}}
@keyframes spark-pulse{0%{opacity:.3;scale:.8}100%{opacity:1;scale:1.25}}
@keyframes shield-ring{0%{opacity:.85;transform:scale(.88)}75%,100%{opacity:0;transform:scale(1.16)}}
@keyframes ecg-write{0%{stroke-dashoffset:1160;opacity:.6}25%,70%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:-1160;opacity:.55}}
@keyframes bar-grow{from{transform:scaleY(.08);opacity:.3}to{transform:scaleY(1);opacity:1}}
@media(max-width:1350px){
 .login-layout{gap:30px;grid-template-columns:minmax(0,1.05fr) minmax(400px,.95fr);padding:24px}
 .intro h1{font-size:clamp(35px,4vw,57px)}.orbit-scene{width:310px;top:20%;right:-7%}
 .health-dashboard{min-height:195px}.mini-bi{width:220px;right:-3px}.masthead{min-width:0;width:100%}
 .signin-card{padding:30px 32px 30px;min-height:620px}
}
@media(max-width:1040px){
 .login-layout{grid-template-columns:minmax(0,1fr) minmax(360px,.95fr);gap:20px}
 .orbit-scene{width:235px;height:290px;opacity:.55;right:0;top:24%}
 .intro h1{font-size:37px}.intro p{font-size:13px;max-width:390px}
 .health-dashboard{min-height:170px;padding:17px}.monitor-head-icon{display:none}.monitor-trace{left:85px}.mini-bi{transform:scale(.72);transform-origin:top right}
 .benefits{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .masthead .brand-description,.masthead .brand-divider{display:none}
 .signin-heading h2{white-space:normal;font-size:28px}.form-column{padding-top:0}.floating-cross{display:none}
}
@media(max-width:780px){
 .login-layout{grid-template-columns:1fr;max-width:600px;gap:25px;padding:16px 16px 28px;min-height:100dvh}
 .story-column{gap:15px}.masthead{width:100%;padding:8px 10px;border-radius:22px}.logo{width:44px;height:44px}.brand strong{font-size:22px}
 .intro{margin:2px 0 0;padding:0 4px}.intro h1{font-size:clamp(30px,7vw,40px);letter-spacing:-1.7px;margin:13px 0 10px}
 .intro p{font-size:12px;line-height:1.55;max-width:560px}.eyebrow{font-size:10px;padding:7px 10px}
 .orbit-scene{display:none}.health-dashboard,.benefits{display:none}
 .form-column{padding-top:2px;gap:18px}.signin-card{min-height:unset;max-width:100%;padding:24px 22px 28px;border-radius:30px}
 .signin-lock-row{height:70px}.signin-icon{width:54px;height:54px;border-radius:18px}.signin-icon:after{display:none}
 .heartbeat-decoration{width:54px}.signin-heading h2{font-size:25px;margin:12px 0 6px}
 .signin-heading p{font-size:12px;margin-bottom:20px}.signin-subtitle{font-size:10px}
 .field-shell{height:53px;margin-bottom:16px}.submit{height:56px}.secure-footer{margin-top:21px}
 .layer-back,.layer-mid{display:none}
}
@media(max-width:380px){.signin-card{padding:20px 15px}.intro h1{font-size:30px}.field-shell{padding:0 12px}.signin-heading h2{font-size:23px}.secure-footer{font-size:10px;gap:9px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}