*{box-sizing:border-box}html,body,form{margin:0;min-height:100%;font-family:Tahoma,"Leelawadee UI",sans-serif;color:#082d55}body{background:#eef4f7}.login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(480px,58%) minmax(420px,42%);background:#fff}.login-visual{position:relative;overflow:hidden;min-height:680px;background:linear-gradient(145deg,#d8f1f5 0%,#79c6e1 43%,#006398 75%,#003f6c 100%)}.visual-brand{position:absolute;z-index:4;left:6%;top:7%;display:flex;align-items:center;gap:14px;color:#fff}.visual-brand strong{display:block;font-size:1.35rem}.visual-brand small{display:block;margin-top:6px;color:#ccecf5}.medical-mark{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:#0aa39c;color:#fff;font:bold 2.1rem Arial}.silhouette .head{position:absolute;z-index:2;width:340px;height:390px;right:7%;top:0;border-radius:48% 52% 45% 55%;background:linear-gradient(180deg,#1488c3,#006eaa);box-shadow:0 0 4px #085c8b}.silhouette .body-shape{position:absolute;z-index:1;width:750px;height:470px;left:-12%;top:320px;border-radius:50% 55% 0 0;transform:rotate(-10deg);background:linear-gradient(135deg,#0877ae,#003f6c)}.green-line{position:absolute;z-index:5;left:0;right:0;top:67%;height:27px;background:repeating-linear-gradient(150deg,#22bc72 0 25px,#17ad64 25px 50px)}.diagonal-lines{position:absolute;z-index:3;left:0;right:0;bottom:0;height:29%;background-color:#003f6c;background-image:repeating-linear-gradient(155deg,transparent 0 25px,#2c82b4 25px 40px,transparent 40px 70px)}.login-form-side{display:grid;place-items:center;padding:55px}.login-box{width:min(390px,100%)}.staff-label{color:#008979;font-weight:bold;margin-bottom:12px}.login-box h1{margin:0 0 12px;font-size:2.35rem;color:#062a54}.login-box p{margin:0 0 27px;color:#718096}.login-box label{display:block;margin:15px 0 8px;font-weight:bold;color:#263f5c}.login-box input[type=text],.login-box input[type=password]{width:100%;height:48px;border:1px solid #bfd0dc;border-radius:10px;padding:10px 13px;font:inherit}.login-box input[type=submit]{width:100%;margin-top:20px;height:49px;border:0;border-radius:10px;background:#23bd5b;color:#fff;font:bold 1.05rem Tahoma;cursor:pointer}.login-box input[type=submit]:hover{background:#18a94e}.login-message{display:block;padding:10px;border-radius:8px;background:#fee2e2;color:#991b1b;margin-bottom:15px}@media(max-width:850px){.login-shell{grid-template-columns:1fr}.login-visual{min-height:250px}.silhouette .head{width:180px;height:210px}.silhouette .body-shape{top:160px;height:260px}.green-line{top:auto;bottom:55px}.diagonal-lines{height:55px}.login-form-side{padding:38px 24px}}
