/* ========================================================================
   V4.3.55 — RSCM IoMT public login / institutional clean design
   Presentation only. Firebase login flow, JS, form IDs and dialogs unchanged.
   ======================================================================== */
.login-page {
  min-height:100vh;
  background:#fff;
  color:#17384c;
}
.login-page .container {width:min(1210px,calc(100% - 72px));max-width:1210px;}
.login-header {display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:85px;border-bottom:1px solid #e7eef2;}
.login-header .brand-mark {background:#eaf6f3;color:#218b85;border:1px solid #d9eae5;box-shadow:none;border-radius:11px;width:42px;height:42px;}
.login-header .brand-mark .icon {width:22px;height:22px;}
.login-header .brand-lockup strong {font-size:22px;}
.login-header .brand-lockup strong>span:last-child {font-size:21px;color:#218b85;}
.login-header .brand-lockup small {font-size:9px;letter-spacing:.045em;}
.login-header .back-link {display:inline-flex;align-items:center;gap:8px;color:#5b7585;font-size:13px;font-weight:620;}
.login-header .back-link:hover {color:#218b85;}
.login-header .back-link .icon {width:17px;height:17px;}
.login-layout {
  display:grid;
  grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr);
  gap:clamp(35px,5vw,72px);
  align-items:center;
  min-height:calc(100svh - 150px);
  padding-top:35px;
  padding-bottom:42px;
}
.login-story {
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:560px;
  overflow:hidden;
  border:1px solid #e2eaf0;
  border-radius:19px;
  background:#fbfcfd;
  box-shadow:0 3px 9px rgba(54,89,117,.03),0 12px 26px rgba(54,89,117,.045);
}
.login-story::before {display:none;}
.story-copy {position:relative;z-index:2;padding:35px 37px 0;}
.login-story-kicker {display:block;color:#218b85;font-size:11.5px;font-weight:750;letter-spacing:.055em;line-height:1.4;}
.story-copy h1 {margin:17px 0 14px;font-size:clamp(30px,2.8vw,40px);font-weight:750;letter-spacing:-.03em;line-height:1.16;color:#17384c;}
.story-copy h1 em {color:#218b85;font-style:normal;}
.story-copy p:not(.login-story-kicker) {max-width:420px;color:#5e7686;font-size:14px;line-height:1.74;}
.login-bed {position:relative;width:100%;margin:0;flex:1 1 auto;display:flex;align-items:center;justify-content:center;min-height:245px;padding:1px 6px 0;}
.login-bed .bed-illustration {max-height:305px;width:100%;height:auto;filter:drop-shadow(0 6px 9px rgba(48,86,112,.085));}
.story-foot {position:relative;z-index:2;display:flex;align-items:center;gap:11px;margin:0 26px 26px;padding:14px 17px;border:1px solid #e0e9ed;border-radius:11px;background:#fff;box-shadow:none;}
.story-foot .feature-icon {display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;background:#eaf6f3;border:1px solid #d9eae5;border-radius:10px;color:#218b85;}
.story-foot .feature-icon .icon {width:19px;height:19px;}
.story-foot strong {display:block;font-size:12.5px;font-weight:720;color:#17384c;}
.story-foot p {margin-top:3px;font-size:11px;line-height:1.55;color:#6c8492;}
.login-form-column {display:flex;align-items:center;justify-content:center;padding:12px 0;min-width:0;}
.login-card {
  width:100%;
  max-width:460px;
  padding:33px 36px 34px;
  border:1px solid #e2eaf0;
  border-radius:19px;
  background:#fff;
  box-shadow:0 3px 9px rgba(54,89,117,.04),0 14px 28px rgba(54,89,117,.09),0 27px 43px rgba(54,89,117,.04),inset 0 1px 0 #fff;
}
.login-symbol {display:none;}
.login-card h2 {font-size:29px;line-height:1.18;letter-spacing:-.025em;font-weight:760;color:#17384c;}
.login-subtitle {margin-top:9px;margin-bottom:21px;color:#637d8c;font-size:13.5px;line-height:1.6;}
.login-page .auth-login-note {margin:0 0 22px;padding:12px 14px;border:1px solid #e0ebe9;border-radius:10px;background:#f5faf8;color:#5a7578;font-size:11.5px;line-height:1.7;}
.login-page .auth-login-note strong {color:#246d69;font-weight:750;}
.login-card .form-field {margin-bottom:19px;}
.login-card .form-field label {font-size:13px;font-weight:680;color:#2c4b5f;margin-bottom:7px;}
.login-card .form-field input {height:48px;border-radius:10px;border:1px solid #d7e3ea;background:#fff;font-size:14px;color:#17384c;}
.login-card .form-field input:focus {border-color:#39a79e;box-shadow:0 0 0 3px rgba(48,163,154,.12);}
.login-card .form-field small {font-size:11px;line-height:1.4;color:#728998;margin-top:7px;}
.login-card .input-with-icon {position:relative;}
.login-card .label-row {display:flex;align-items:center;justify-content:space-between;gap:12px;}
.login-card .label-row .text-button {font-size:11.5px;color:#218b85;font-weight:650;}
.login-card .password-toggle {position:absolute;right:6px;top:6px;border-radius:8px;}
.login-card .password-toggle .icon {width:18px;height:18px;}
.login-card .password-toggle[aria-pressed="true"] {color:#218b85;background:#eaf6f3;}
.login-card .auth-remember {display:flex;align-items:center;gap:9px;margin:1px 0 16px;font-size:12px;color:#516d7c;}
.login-card .auth-remember input {width:16px;height:16px;accent-color:#218b85;flex:0 0 16px;}
.login-card .form-feedback {font-size:12px;line-height:1.6;min-height:0;color:#456f72;}
.login-card .form-feedback:not(:empty) {margin:0 0 12px;padding:10px 12px;border:1px solid #d9e9e5;border-radius:9px;background:#f5faf8;}
.login-card .form-feedback[data-kind="error"] {background:#fff4f2;color:#a0433b;border-color:#edceca;}
.login-card .form-feedback[data-kind="info"] {background:#f5faf8;color:#247f78;}
.login-page .button-primary {
  border:1px solid #2f9f95;
  border-radius:10px;
  color:#fff;
  background:linear-gradient(180deg,#46b6ad 0%,#218b85 100%);
  box-shadow:0 6px 14px rgba(31,129,121,.16),inset 0 1px 0 rgba(255,255,255,.28);
  font-weight:720;
}
.login-page .button-primary:hover {transform:translateY(-1px);background:linear-gradient(180deg,#3aa9a0 0%,#177b75 100%);}
.login-page .submit-button {width:100%;min-height:48px;margin-top:7px;font-size:14px;}
.login-page .submit-button .icon {width:18px;height:18px;margin-left:auto;}
.login-page .submit-button:disabled {opacity:.58;cursor:not-allowed;}
.login-help {text-align:center;font-size:12px;color:#738996;margin-top:23px;}
.login-help .text-button {font-size:12px;margin-left:4px;color:#218b85;font-weight:650;}
.login-privacy {max-width:340px;margin:15px auto 0;text-align:center;font-size:11px;line-height:1.7;color:#8294a1;}
.login-footer {display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:24px;color:#8193a0;font-size:11px;}
.login-footer>span:last-child {display:flex;align-items:center;gap:7px;}
.login-footer .icon {width:14px;height:14px;}
.login-page a:focus-visible,.login-page button:focus-visible {outline:2px solid #218b85;outline-offset:3px;}
@media (max-width:1110px) {
  .login-page .container {width:calc(100% - 50px);}
  .login-layout {gap:26px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .login-story {min-height:530px;}
  .story-copy {padding:29px 28px 0;}
  .story-copy h1 {font-size:32px;}
  .login-card {padding:29px 28px;}
  .story-foot {margin-inline:19px;padding:12px;}
}
@media (max-width:800px) {
  .login-page .container {width:calc(100% - 40px);}
  .login-header {min-height:78px;}
  .login-layout {grid-template-columns:1fr;max-width:530px;min-height:0;gap:0;margin-inline:auto;padding-top:34px;padding-bottom:34px;}
  .login-story {display:none;}
  .login-form-column {padding:0;}
  .login-card {max-width:none;padding:32px;}
  .login-footer {justify-content:center;text-align:center;}
  .login-footer>span:last-child {display:none;}
}
@media (max-width:440px) {
  .login-page .container {width:calc(100% - 28px);}
  .login-header {min-height:72px;}
  .login-header .brand-mark {width:37px;height:37px;}
  .login-header .brand-lockup strong {font-size:19px;}
  .login-header .brand-lockup strong>span:last-child {font-size:19px;}
  .login-header .brand-lockup small {font-size:7.6px;}
  .login-header .back-link {font-size:11px;gap:5px;}
  .login-header .back-link .icon {width:14px;height:14px;}
  .login-layout {padding-top:25px;padding-bottom:28px;}
  .login-card {padding:27px 22px;border-radius:16px;}
  .login-card h2 {font-size:27px;}
  .login-card .label-row .text-button {font-size:11px;}
  .login-privacy {font-size:10.5px;}
}
@media (prefers-reduced-motion:reduce) {
  .login-page .button-primary {transition:none!important;}
}


/* =======================================================================
   RSCM IoMT V4.3.56 — DUAL INSTITUTIONAL BRAND
   Two actual local assets, matching the Dashboard sidebar identities.
   Visual only; no auth/monitoring/JavaScript changes.
   ======================================================================= */
.rscm-public-identities {
  display:flex;
  align-items:center;
  flex:0 1 auto;
  min-width:0;
  gap:13px;
  white-space:nowrap;
}
.rscm-public-identities .rscm-public-brand-link {
  display:inline-flex;
  align-items:center;
  min-width:0;
  flex:0 1 auto;
  gap:8px;
  margin:0;
  text-decoration:none;
}
.rscm-public-identities .rscm-public-logo {
  display:block;
  width:36px;
  height:36px;
  object-fit:contain;
  flex:0 0 36px;
  background:transparent;
  box-shadow:none;
  border:0;
}
.rscm-public-identities .brand-lockup {
  display:flex;
  flex-direction:column;
  min-width:0;
  gap:0;
}
.rscm-public-identities .brand-lockup strong {
  display:flex;
  align-items:center;
  gap:5px;
  color:#17384c;
  font-size:18px;
  font-weight:760;
  line-height:1.14;
  letter-spacing:-.032em;
}
.rscm-public-identities .brand-lockup strong > span:last-child {
  color:#218b85;
  font-size:17px;
  font-weight:700;
}
.rscm-public-identities .brand-lockup .brand-divider {
  width:1px;
  height:16px;
  background:#ccd8df;
  flex:0 0 1px;
}
.rscm-public-identities .brand-lockup small {
  display:block;
  margin-top:3px;
  color:#6e8190;
  font-size:7.2px;
  font-weight:720;
  letter-spacing:.07em;
  line-height:1.25;
}
.rscm-public-identities .rscm-public-identity-divider {
  display:block;
  height:28px;
  width:1px;
  flex:0 0 1px;
  background:#d7e0e4;
}
.rscm-public-identities .rscm-public-institution-mark {
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 1 150px;
  min-width:0;
  width:150px;
  max-width:150px;
}
.rscm-public-identities .rscm-public-institution-mark img {
  display:block;
  width:100%;
  max-width:150px;
  height:auto;
  max-height:42px;
  object-fit:contain;
  border:0;
  box-shadow:none;
  background:none;
}
.rscm-public-identities .rscm-public-brand-link:focus-visible {
  outline:2px solid #218b85;
  outline-offset:4px;
  border-radius:6px;
}
@media (max-width:1200px) {
  .rscm-public-identities {gap:10px;}
  .rscm-public-identities .rscm-public-logo {width:32px;height:32px;flex-basis:32px;}
  .rscm-public-identities .brand-lockup strong {font-size:16px;}
  .rscm-public-identities .brand-lockup strong > span:last-child {font-size:15.5px;}
  .rscm-public-identities .brand-lockup small {font-size:6.6px;}
  .rscm-public-identities .rscm-public-institution-mark {max-width:126px;flex-basis:126px;width:126px;}
}
@media (max-width:600px) {
  .rscm-public-identities {gap:6px;}
  .rscm-public-identities .rscm-public-brand-link {gap:4px;}
  .rscm-public-identities .rscm-public-logo {width:28px;height:28px;flex-basis:28px;}
  .rscm-public-identities .brand-lockup strong {gap:3px;font-size:13px;letter-spacing:-.035em;}
  .rscm-public-identities .brand-lockup strong > span:last-child {font-size:12.5px;}
  .rscm-public-identities .brand-lockup .brand-divider {height:11px;}
  .rscm-public-identities .brand-lockup small {font-size:5.1px;letter-spacing:.025em;}
  .rscm-public-identities .rscm-public-identity-divider {height:21px;}
  .rscm-public-identities .rscm-public-institution-mark {max-width:82px;flex-basis:82px;width:82px;}
}
@media (max-width:370px) {
  .rscm-public-identities {gap:4px;}
  .rscm-public-identities .rscm-public-logo {width:25px;height:25px;flex-basis:25px;}
  .rscm-public-identities .brand-lockup strong {font-size:11px;gap:2px;}
  .rscm-public-identities .brand-lockup strong > span:last-child {font-size:11px;}
  .rscm-public-identities .brand-lockup .brand-divider {height:9px;}
  .rscm-public-identities .brand-lockup small {font-size:4.5px;}
  .rscm-public-identities .rscm-public-institution-mark {max-width:64px;flex-basis:64px;width:64px;}
}


/* Login: dual brand replaces only the previous single-brand header lockup. */
.login-header .rscm-public-identities {flex:0 1 auto;}
.login-header .rscm-public-brand-link .brand-lockup strong {font-size:18px;}
.login-header .rscm-public-brand-link .brand-lockup strong > span:last-child {font-size:17px;}
.login-header .rscm-public-brand-link .brand-lockup small {font-size:7.2px;}
@media (max-width:1200px) {
  .login-header .rscm-public-brand-link .brand-lockup strong {font-size:16px;}
  .login-header .rscm-public-brand-link .brand-lockup strong > span:last-child {font-size:15.5px;}
  .login-header .rscm-public-brand-link .brand-lockup small {font-size:6.6px;}
}
@media (max-width:600px) {
  .login-header {gap:9px;}
  .login-header .rscm-public-brand-link .brand-lockup strong {font-size:13px;}
  .login-header .rscm-public-brand-link .brand-lockup strong > span:last-child {font-size:12.5px;}
  .login-header .rscm-public-brand-link .brand-lockup small {font-size:5.1px;}
  .login-header .back-link {flex:0 0 auto;font-size:11px;gap:5px;}
  .login-header .back-link .icon {width:14px;height:14px;}
}
@media (max-width:440px) {
  .login-header .back-link {font-size:0;gap:0;}
  .login-header .back-link .icon {width:19px;height:19px;}
}
@media (max-width:370px) {
  .login-header .rscm-public-brand-link .brand-lockup strong {font-size:11px;}
  .login-header .rscm-public-brand-link .brand-lockup strong > span:last-child {font-size:11px;}
  .login-header .rscm-public-brand-link .brand-lockup small {font-size:4.5px;}
}


/* ========================================================================
   RSCM IoMT V4.3.153 — LOGIN VISUAL MATCHES INDEX V4.3.152
   Only the LEFT hero-copy is replaced with the ORIGINAL Firebase login form.
   Topbar, monitor 3D, keyboard/mouse, responsive hero, and footer all inherit
   the approved css/pages/index.css unchanged. This file changes UI only.
   No JS/auth, Firebase config, form handlers, validation or RBAC changes.
   ======================================================================== */
body.rscm-index-matched-login .hero-copy.rscm-login-hero-copy {
  min-width:0;
  z-index:4;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-form-column {
  display:block;
  min-width:0;
  width:100%;
  padding:0;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card {
  width:100%;
  max-width:460px;
  min-width:0;
  margin:0;
  padding:27px 29px 25px;
  border:1px solid #dfe9ed;
  border-radius:20px;
  color:#203b50;
  background:#fff;
  box-shadow:
    0 4px 12px rgba(29,75,91,.045),
    0 18px 36px rgba(37,80,92,.095),
    0 30px 52px rgba(37,80,92,.035),
    inset 0 1px 0 #fff;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-symbol {
  display:grid;
  place-items:center;
  width:43px;
  height:43px;
  margin-bottom:13px;
  border:1px solid #d7e9e5;
  border-radius:12px;
  color:#218b85;
  background:linear-gradient(145deg,#f5fbf9,#e9f6f3);
  box-shadow:0 5px 11px rgba(25,107,99,.065),inset 0 1px 0 #fff;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-symbol .icon {
  display:block;
  width:23px;
  height:23px;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card h2 {
  margin:0;
  color:#17384c;
  font-size:27px;
  font-weight:770;
  letter-spacing:-.025em;
  line-height:1.2;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-subtitle {
  margin:7px 0 17px;
  font-size:12.6px;
  line-height:1.6;
  color:#667f8e;
}
body.rscm-index-matched-login .rscm-login-hero-copy .auth-login-note {
  margin:0 0 19px;
  padding:10px 12px;
  border:1px solid #deebe8;
  border-radius:10px;
  background:#f5faf8;
  color:#567473;
  font-size:11px;
  line-height:1.6;
}
body.rscm-index-matched-login .rscm-login-hero-copy .auth-login-note strong {
  color:#247b73;
}
body.rscm-index-matched-login .rscm-login-hero-copy .form-field {
  margin-bottom:16px;
}
body.rscm-index-matched-login .rscm-login-hero-copy .form-field label {
  color:#294b5b;
  font-size:12.5px;
  font-weight:710;
}
body.rscm-index-matched-login .rscm-login-hero-copy .form-field input {
  height:46px;
  font-size:13.5px;
}
body.rscm-index-matched-login .rscm-login-hero-copy .form-field input:focus {
  border-color:#218b85;
  box-shadow:0 0 0 3px rgba(33,139,133,.12);
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card .auth-remember {
  margin-bottom:13px;
}
body.rscm-index-matched-login .rscm-login-hero-copy .submit-button {
  min-height:46px;
  margin-top:6px;
  border-radius:10px;
  font-size:13.7px;
  box-shadow:
    0 5px 10px rgba(22,87,91,.10),
    0 14px 23px rgba(21,130,121,.18),
    inset 0 1px 0 rgba(255,255,255,.35);
}
body.rscm-index-matched-login .rscm-login-hero-copy .submit-button:hover:not(:disabled) {
  box-shadow:
    0 7px 12px rgba(22,87,91,.12),
    0 17px 27px rgba(21,130,121,.23),
    inset 0 1px 0 rgba(255,255,255,.38);
}
body.rscm-index-matched-login .rscm-login-hero-copy .submit-button:disabled {
  opacity:.58;
  cursor:not-allowed;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-help {
  margin-top:18px;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-privacy {
  max-width:100%;
  margin-top:12px;
  font-size:10.5px;
  line-height:1.55;
}
/* Prevent the fixed site header from covering the form when an anchor is used. */
body.rscm-index-matched-login #loginForm {
  scroll-margin-top:110px;
}
/* Do not alter the Index preview, header, footer, or responsive monitor rules. */
@media (min-width:1191px) and (max-width:1439px) {
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card {
    padding:23px 23px 22px;
  }
}
@media (max-width:1190px) {
  body.rscm-index-matched-login .rscm-login-hero-copy {
    max-width:540px;
  }
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card {
    max-width:540px;
    padding:28px 30px;
  }
}
@media (max-width:600px) {
  body.rscm-index-matched-login .rscm-login-hero-copy {
    width:100%;
    max-width:100%;
  }
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card {
    max-width:100%;
    padding:23px 19px 22px;
    border-radius:16px;
  }
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card h2 {
    font-size:25px;
  }
}
@media (prefers-reduced-motion:reduce) {
  body.rscm-index-matched-login .rscm-login-hero-copy .submit-button {
    transition:none;
  }
}

/* ========================================================================
   RSCM IoMT V4.3.156 — ENLARGED INSTITUTIONAL IDENTITIES / LOGIN CARD ONLY
   Increase BOTH brand marks, their labels and text for a stronger hierarchy.
   Scope: descendants of .login-card only. Login form/auth logic, monitor,
   header, footer, index.html and global CSS are not modified.
   ======================================================================== */
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex:0 0 auto;
  width:100%;
  height:43px;
  min-width:0;
  gap:11px;
  margin:0 0 13px;
  white-space:nowrap;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-brand-link {
  display:inline-flex;
  align-items:center;
  flex:0 1 auto;
  min-width:0;
  gap:7px;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-logo {
  width:45px;
  height:45px;
  flex:0 0 45px;
  object-fit:contain;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup {
  display:flex;
  flex-direction:column;
  min-width:0;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong {
  gap:4px;
  font-size:20px;
  font-weight:780;
  line-height:1.12;
  letter-spacing:-.03em;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong > span:last-child {
  font-size:19.5px;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup .brand-divider {
  height:17px;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup small {
  margin-top:4px;
  font-size:7.9px;
  letter-spacing:.012em;
  line-height:1.22;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-identity-divider {
  width:1px;
  height:39px;
  flex:0 0 1px;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-institution-mark {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  flex:0 1 130px;
  width:130px;
  max-width:130px;
  min-width:0;
  gap:2px;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-program-label {
  display:block;
  width:100%;
  color:#657f8b;
  font-size:10px;
  font-weight:800;
  line-height:1.12;
  letter-spacing:.015em;
  text-align:left;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-institution-mark img {
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  max-height:36px;
  object-fit:contain;
  object-position:left center;
}
@media (min-width:1600px) {
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities {height:43px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-logo {width:48px;height:48px;flex-basis:48px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong {font-size:21.5px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong > span:last-child {font-size:21px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup small {font-size:8.5px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-institution-mark {flex-basis:140px;width:140px;max-width:140px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-program-label {font-size:10.6px;}
}
@media (min-width:1191px) and (max-width:1439px) {
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities {height:43px;gap:8px;margin-bottom:13px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-brand-link {gap:5px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-logo {width:41px;height:41px;flex-basis:41px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong {font-size:18.5px;gap:3px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong > span:last-child {font-size:18px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup small {font-size:7.1px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-identity-divider {height:34px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-institution-mark {flex-basis:116px;width:116px;max-width:116px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-program-label {font-size:9.3px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-institution-mark img {max-height:32px;}
}
@media (min-width:1191px) and (max-width:1359px) {
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities {height:43px;gap:7px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-logo {width:38px;height:38px;flex-basis:38px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong {font-size:17.3px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong > span:last-child {font-size:17px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup small {font-size:6.7px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-institution-mark {flex-basis:107px;width:107px;max-width:107px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-program-label {font-size:8.8px;}
}
@media (min-width:1191px) and (max-width:1279px) {
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities {height:43px;gap:6px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-brand-link {gap:4px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-logo {width:35px;height:35px;flex-basis:35px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong {font-size:16.6px;gap:2px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong > span:last-child {font-size:16px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup small {font-size:6.35px;letter-spacing:0;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-institution-mark {flex-basis:100px;width:100px;max-width:100px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-program-label {font-size:8.35px;}
}
@media (max-width:600px) {
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities {height:43px;gap:8px;margin-bottom:13px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-brand-link {gap:5px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-logo {width:37px;height:37px;flex-basis:37px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong {font-size:16.4px;gap:3px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong > span:last-child {font-size:16px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup small {font-size:6.1px;letter-spacing:0;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-identity-divider {height:32px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-institution-mark {flex-basis:105px;width:105px;max-width:105px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-program-label {font-size:8.5px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-institution-mark img {max-height:30px;}
}
@media (max-width:370px) {
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities {height:43px;gap:5px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-brand-link {gap:4px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-logo {width:31px;height:31px;flex-basis:31px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong {font-size:13.5px;gap:2px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup strong > span:last-child {font-size:13.2px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .brand-lockup small {font-size:5.1px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-identity-divider {height:29px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-institution-mark {flex-basis:88px;width:88px;max-width:88px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-program-label {font-size:7.4px;}
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities .rscm-public-institution-mark img {max-height:25px;}
}


/* ========================================================================
   RSCM IoMT V4.3.157 — CENTER BOTH BRAND MARKS INSIDE LOGIN CARD
   Visual-only horizontal centering. Keep sizes, gap, vertical rhythm, form,
   Firebase auth, header, monitor and footer unchanged.
   ======================================================================== */
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities {
  justify-content:center;
}

/* ========================================================================
   RSCM IoMT V4.3.158 — MORE AIR BELOW TWO LOGIN BRAND MARKS
   Only increase spacing between the centered brand group and the next title.
   Both brands and login form remain unchanged; no JS/auth/global CSS edits.
   ======================================================================== */
body.rscm-index-matched-login .rscm-login-hero-copy .login-card > .rscm-public-identities {
  margin-bottom:27px; /* V4.3.157: 13px; add 14px visual breathing room */
}


/* ========================================================================
   RSCM IoMT V4.3.159 — LOGIN CARD ALIGNMENT + FONT AWESOME ICONS
   Only the .login-card position and its four form icons change.
   Keep login.js, form IDs, validation, Firebase, header, monitor and footer.
   ======================================================================== */
@media (min-width:1191px) {
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card {
    position:relative;
    top:-16px;
  }
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card .input-with-icon > .rscm-login-field-icon {
  position:absolute;
  z-index:1;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:17px;
  height:18px;
  font-size:16px;
  line-height:1;
  color:#849aab;
  pointer-events:none;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card .input-with-icon > input {
  padding-left:40px;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card #passwordToggle {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  line-height:1;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card #passwordToggle .rscm-login-eye-closed {
  display:inline-block;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card #passwordToggle .rscm-login-eye-open {
  display:none;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card #passwordToggle[aria-pressed="true"] .rscm-login-eye-closed {
  display:none;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card #passwordToggle[aria-pressed="true"] .rscm-login-eye-open {
  display:inline-block;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card .rscm-login-submit-icon {
  display:inline-block;
  margin-left:auto;
  font-size:17px;
  line-height:1;
}


/* ========================================================================
   RSCM IoMT V4.3.160 — TRUE FONT AWESOME CLASSIC SOLID ICONS / LOGIN ONLY
   Scope strictly to icons within .login-card. No SVG and no login JS edits.
   Same verified Font Awesome Classic Solid 900 face as the mini-Dashboard,
   already declared by css/pages/index.css (V4.3.107). The local file named
   fa-thin-100.woff2 actually contains Classic Solid 900 in this deployment.
   These precise codepoints prevent generic icon-fallback glyphs from rendering.
   ======================================================================== */
body.rscm-index-matched-login .rscm-login-hero-copy .login-card i.fa-classic.fa-solid,
body.rscm-index-matched-login .rscm-login-hero-copy .login-card i.fa-classic.fa-solid::before {
  font-family:"RSCM Sidebar Classic Solid", "Font Awesome 7 Pro", "Font Awesome 7 Free" !important;
  font-style:normal !important;
  font-weight:900 !important;
  font-variant:normal;
  font-synthesis:none;
  -webkit-text-stroke:0 !important;
  -webkit-font-smoothing:antialiased;
  line-height:1;
}
/* Reliable, filled Classic Solid shapes for the two fields and submit CTA. */
body.rscm-index-matched-login .rscm-login-hero-copy .login-card .rscm-login-field-icon.fa-envelope::before {
  content:"\f0e0" !important;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card .rscm-login-field-icon.fa-lock::before {
  content:"\f023" !important;
}
/* The configured Pro face may supply eye-closed; fall back to the solid
   concealed-eye symbol where the named glyph mapping is unavailable. */
body.rscm-index-matched-login .rscm-login-hero-copy .login-card .rscm-login-eye-closed.fa-eye-closed::before {
  content:var(--fa, "\f070") !important;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card .rscm-login-eye-open.fa-eye::before {
  content:"\f06e" !important;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card .rscm-login-submit-icon.fa-arrow-right::before {
  content:"\f061" !important;
}


/* ========================================================================
   RSCM IoMT V4.3.162 — THREE-DOT LOGIN PROGRESS (CSS ONLY)
   One, then two, then three solid white dots appear in sequence next to Masuk.
   No SVG, HTML/JS edits, or change in Firebase sign-in/redirect behavior.
   The dots are rendered by one pseudo-element with two box shadows and are
   visible ONLY during the form's existing aria-busy="true" state.
   ======================================================================== */
body.rscm-index-matched-login .rscm-login-hero-copy .login-card #loginSubmitLabel {
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card #loginForm[aria-busy="true"] #loginSubmitLabel::after {
  content:"";
  display:inline-block;
  box-sizing:border-box;
  width:6px;
  height:6px;
  flex:0 0 6px;
  margin-left:11px;
  margin-right:18px;
  border:0;
  border-radius:50%;
  background-color:#fff;
  box-shadow:9px 0 transparent,18px 0 transparent;
  animation:rscm-login-dots-v43162 1.3s steps(1,end) infinite;
}
body.rscm-index-matched-login .rscm-login-hero-copy .login-card #loginForm[aria-busy="true"] #loginSubmit {
  opacity:.95;
  cursor:progress;
}
@keyframes rscm-login-dots-v43162 {
  0%,24.9% {
    background-color:#fff;
    box-shadow:9px 0 transparent,18px 0 transparent;
  }
  25%,49.9% {
    background-color:#fff;
    box-shadow:9px 0 #fff,18px 0 transparent;
  }
  50%,84.9% {
    background-color:#fff;
    box-shadow:9px 0 #fff,18px 0 #fff;
  }
  85%,100% {
    background-color:transparent;
    box-shadow:9px 0 transparent,18px 0 transparent;
  }
}
@media (prefers-reduced-motion:reduce) {
  body.rscm-index-matched-login .rscm-login-hero-copy .login-card #loginForm[aria-busy="true"] #loginSubmitLabel::after {
    animation:none;
    background-color:#fff;
    box-shadow:9px 0 #fff,18px 0 #fff;
  }
}

/* ========================================================================
   RSCM IoMT — LOGIN FOOTER WHITE LOGO PARITY V1
   Referensi: tentang-iomt.html / css/pages/public-pages.css.
   Hanya footer login: logo RSCM IoMT dan institusi putih tanpa kotak putih.
   Tidak mengubah form Firebase, header, hero, mini-Dashboard atau responsif.
   ======================================================================== */
body.landing-page.login-page .rscm-home-footer-brandline .rscm-home-footer-logo-frame,
body.landing-page.login-page .rscm-home-footer-brandline .rscm-home-footer-institution {
  background:transparent;
  border:0;
  box-shadow:none;
}
body.landing-page.login-page .rscm-home-footer-brandline .rscm-home-footer-institution {
  padding:0;
}
body.landing-page.login-page .rscm-home-footer-brandline .rscm-home-footer-logo-frame img,
body.landing-page.login-page .rscm-home-footer-brandline .rscm-home-footer-institution > img {
  filter:grayscale(1) invert(1) brightness(5) contrast(2);
  mix-blend-mode:screen;
}
body.landing-page.login-page .rscm-home-footer-brandline .rscm-home-footer-brand-text strong,
body.landing-page.login-page .rscm-home-footer-brandline .rscm-home-footer-brand-text small,
body.landing-page.login-page .rscm-home-footer-brandline .rscm-home-footer-program-label {
  color:#fff;
}
body.landing-page.login-page .rscm-home-footer-brand-primary > .rscm-home-footer-brand-text {
  transform:translateX(-8px);
}


/* ========================================================================
   RSCM IoMT V4.3.238 — LOGIN: SEMBUNYIKAN DEMO DASHBOARD PADA HP
   Mobile <= 760px: sembunyikan SELURUH hero visual (monitor, keyboard,
   mouse, dan mini-Dashboard), tanpa menyisakan ruang kosong.
   Khusus login.html. Desktop, form Auth, dan sidebar mobile tetap utuh.
   ======================================================================== */
@media (max-width: 760px) {
  body.landing-page.login-page.rscm-index-matched-login
  .hero-section .hero-visual.rscm-dashboard-preview {
    display: none !important;
  }
}