:root { color-scheme: light; --ink: #17374a; --muted: #718493; --blue: #075d80; --orange: #ee842e; --border: #dce6ea; }
* { box-sizing: border-box; }
body { min-width: 320px; min-height: 100vh; min-height: 100svh; margin: 0; padding: clamp(16px, 4vw, 48px); display: grid; place-items: center; overflow-x: hidden; background: radial-gradient(circle at 0% 0%, #dceff1, transparent 35%), radial-gradient(circle at 100% 100%, #f8e8d7, transparent 33%), #f2f6f7; color: var(--ink); font-family: "DM Sans", "Segoe UI", Arial, sans-serif; -webkit-font-smoothing: antialiased; }
button, input { font: inherit; }
.login-shell { width: min(100%, 1120px); min-height: min(690px, calc(100svh - 96px)); display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr); overflow: hidden; border: 1px solid rgb(19 67 82 / 8%); border-radius: 28px; background: #fff; box-shadow: 0 30px 85px rgb(35 80 93 / 14%), 0 4px 14px rgb(35 80 93 / 5%); }
.identity-panel { position: relative; display: flex; min-height: 590px; overflow: hidden; background: radial-gradient(circle at 87% 17%, rgb(19 145 170 / 43%), transparent 36%), linear-gradient(145deg, #155c72 0%, #0f4c64 43%, #0b344e 100%); color: #fff; }
.identity-panel::after { position: absolute; right: -66px; bottom: -158px; width: 340px; height: 340px; border: 1px solid rgb(255 255 255 / 16%); border-radius: 50%; content: ""; }
.contour-lines { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .45; pointer-events: none; stroke: #73bfd0; stroke-width: 1.25; }
.identity-content { position: relative; z-index: 1; flex: 1; padding: clamp(34px, 4vw, 58px); display: flex; flex-direction: column; }
.brand-lockup { display: flex; align-items: center; gap: 18px; }
.brand-logo-frame { width: 94px; height: 94px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid rgb(255 255 255 / 26%); border-radius: 22px; background: #fff; box-shadow: 0 12px 26px rgb(0 25 36 / 17%); }
.brand-logo-frame img { width: 76px; height: 76px; object-fit: contain; }
.brand-copy { display: grid; gap: 6px; }
.brand-name { max-width: 205px; font-size: 14px; font-weight: 750; line-height: 1.35; letter-spacing: .02em; }
.brand-name-marathi { color: #d2e8ea; font-family: "Nirmala UI", Mangal, sans-serif; font-size: 14px; line-height: 1.45; }
.identity-message { margin: auto 0; padding: 76px 0 56px; }
.identity-eyebrow { display: inline-flex; align-items: center; gap: 10px; color: #c8e4e7; font-size: 11px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.eyebrow-dot { width: 7px; height: 7px; border-radius: 50%; background: #f5a053; box-shadow: 0 0 0 4px rgb(245 160 83 / 16%); }
.identity-message h1 { margin: 26px 0 19px; font-family: Manrope, "Segoe UI", sans-serif; font-size: clamp(43px, 4.8vw, 67px); font-weight: 700; line-height: 1.09; letter-spacing: -.055em; }
.identity-message h1 em { color: #ffc88f; font-style: normal; }
.identity-message p { max-width: 330px; margin: 0; color: #c7e0e4; font-size: 16px; line-height: 1.75; }
.identity-footer { display: flex; align-items: center; gap: 13px; color: #bed8dc; font-size: 11px; letter-spacing: .04em; }
.footer-rule { width: 28px; height: 1px; background: var(--orange); }
.login-panel { min-width: 0; padding: clamp(34px, 4vw, 58px); display: flex; flex-direction: column; }
.panel-topline { display: flex; align-items: center; gap: 10px; color: #69808d; font-size: 11px; font-weight: 750; letter-spacing: .16em; text-transform: uppercase; }
.panel-topline-mark { width: 24px; height: 24px; display: flex; align-items: flex-end; gap: 3px; padding: 5px; border-radius: 7px; background: #e8f2f3; transform: rotate(-8deg); }
.panel-topline-mark span { width: 3px; background: var(--blue); border-radius: 3px; }
.panel-topline-mark span:nth-child(1) { height: 8px; }
.panel-topline-mark span:nth-child(2) { height: 13px; background: var(--orange); }
.panel-topline-mark span:nth-child(3) { height: 10px; }
.login-content { width: min(100%, 390px); margin: auto; padding: 54px 0; }
.form-eyebrow { color: #995016; font-size: 11px; font-weight: 750; letter-spacing: .2em; text-transform: uppercase; }
.login-intro h2 { margin: 14px 0 10px; color: #183b4d; font-family: Manrope, "Segoe UI", sans-serif; font-size: clamp(34px, 3.2vw, 43px); font-weight: 700; letter-spacing: -.055em; line-height: 1.15; }
.login-intro h2 span { color: var(--orange); }
.login-intro p { margin: 0 0 42px; color: var(--muted); font-size: 14px; line-height: 1.65; }
form { display: grid; gap: 23px; }
.field { display: grid; gap: 9px; }
.field label { color: #284657; font-size: 13px; font-weight: 700; }
.field input { width: 100%; height: 54px; padding: 0 17px; border: 1px solid var(--border); border-radius: 10px; outline: none; background: #f9fbfb; color: var(--ink); font-size: 14px; transition: border-color .2s, box-shadow .2s, background .2s; }
.field input::placeholder { color: #9aacb5; }
.field input:hover { border-color: #b5cbd3; }
.field input:focus { border-color: #2c869b; background: #fff; box-shadow: 0 0 0 4px rgb(44 134 155 / 12%); }
.password-field { position: relative; }
.password-field input { padding-right: 56px; }
.password-toggle { position: absolute; top: 5px; right: 5px; width: 44px; height: 44px; display: grid; place-items: center; border: 0; border-radius: 7px; background: transparent; color: #748994; cursor: pointer; }
.password-toggle svg { width: 20px; height: 20px; }
.password-toggle[aria-pressed="true"] .eye-slash { display: none; }
.password-toggle:hover { color: var(--blue); background: #eaf3f5; }
.password-toggle:focus-visible { outline: 2px solid #2c869b; outline-offset: 2px; }
.login-button { width: 100%; min-height: 56px; margin-top: 9px; padding: 0 18px 0 23px; display: flex; align-items: center; justify-content: space-between; border: 0; border-radius: 10px; background: linear-gradient(110deg, #116a82, #0a506b); box-shadow: 0 11px 20px rgb(13 91 119 / 18%); color: #fff; cursor: pointer; font-size: 14px; font-weight: 700; text-decoration: none; transition: transform .2s, box-shadow .2s, filter .2s; }
.login-button:hover { transform: translateY(-2px); box-shadow: 0 14px 23px rgb(13 91 119 / 24%); filter: brightness(1.07); }
.login-button:active { transform: translateY(0); }
.login-button:focus-visible { outline: 3px solid #63b3bf; outline-offset: 4px; }
.login-button svg { width: 20px; height: 20px; }
.access-note { margin: 28px 0 0; display: flex; align-items: center; justify-content: center; gap: 8px; color: #84969f; font-size: 12px; }
.access-note svg { width: 16px; height: 16px; }
.panel-footer { margin: 0; color: #a0afb6; font-size: 11px; }
@media (max-width: 760px) {
  body { padding: 16px; }
  .login-shell { max-width: 500px; min-height: 0; grid-template-columns: 1fr; border-radius: 22px; }
  .identity-panel { min-height: 230px; }
  .identity-content { padding: 28px; }
  .brand-logo-frame { width: 64px; height: 64px; border-radius: 16px; }
  .brand-logo-frame img { width: 54px; height: 54px; }
  .identity-message { padding: 27px 0 0; }
  .identity-message h1 { margin: 13px 0 8px; font-size: clamp(31px, 7vw, 42px); }
  .identity-message p, .identity-footer, .identity-eyebrow { display: none; }
  .login-panel { padding: 30px 28px 26px; }
  .login-content { padding: 38px 0 42px; }
  .login-intro p { margin-bottom: 32px; }
}
@media (max-width: 420px) {
  body { padding: 10px; }
  .login-shell { border-radius: 18px; }
  .identity-panel { min-height: 211px; }
  .identity-content { padding: 22px; }
  .brand-lockup { gap: 12px; }
  .brand-name, .brand-name-marathi { font-size: 12px; }
  .identity-message { padding-top: 26px; }
  .login-panel { padding: 25px 22px 22px; }
  .login-content { padding: 34px 0 36px; }
  .login-intro h2 { font-size: 34px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; } }

/* Fill the viewport without an outer card or page scroll. */
html, body { width: 100%; height: 100%; overflow: hidden; }
body { padding: 0; }
.login-shell { width: 100%; height: 100vh; height: 100dvh; min-height: 0; border: 0; border-radius: 0; box-shadow: none; }
.identity-panel { min-height: 0; }
.identity-message { padding: 20px 0; }
.login-panel { min-height: 0; padding: clamp(20px, 3vw, 48px); }
.login-content { padding: 0; }
.login-error { margin:10px 0 0; color:#b82929; font-size:13px; }
.admin-submit { min-height: 48px; margin-top: 0; }
.forgot-button { justify-self: center; border: 0; padding: 0; background: none; color: #075d80; font-size: 12px; font-weight: 700; cursor: pointer; }
.forgot-button:hover { text-decoration: underline; }
.forgot-button:focus-visible { outline: 2px solid #63b3bf; outline-offset: 4px; }
.reset-dialog { width: min(430px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); padding: 28px; border: 1px solid #d6e6e9; border-radius: 18px; box-shadow: 0 28px 90px rgb(8 41 57 / 30%); color: var(--ink); overflow: auto; }
.reset-dialog::backdrop { background: rgb(8 37 52 / 65%); backdrop-filter: blur(4px); }
.reset-heading { display: flex; align-items: center; justify-content: space-between; }
.reset-close { width: 32px; height: 32px; border: 0; border-radius: 8px; background: #ecf4f5; color: var(--ink); font-size: 24px; cursor: pointer; }
.reset-dialog h2 { margin: 12px 0 7px; font-family: Manrope, "Segoe UI", sans-serif; font-size: 27px; letter-spacing: -.04em; }
.reset-dialog h2 span { color: var(--orange); }
.reset-dialog > p { margin: 0 0 20px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.reset-dialog form { gap: 14px; }
.reset-dialog .field input { height: 46px; }
.reset-message { margin: 0; color: #a52e2e; font-size: 13px; line-height: 1.4; }
.reset-message.success { color: #157243; }
.login-intro p { margin-bottom: 24px; }
form { gap: 16px; }

@media (max-width: 760px) {
  body { padding: 0; }
  .login-shell { max-width: none; grid-template-rows: clamp(130px, 29dvh, 220px) minmax(0, 1fr); border-radius: 0; }
  .identity-panel { min-height: 0; }
  .identity-content { padding: 20px 24px; }
  .identity-message { padding: 8px 0 0; }
  .login-panel { padding: 16px 24px 12px; }
  .login-content { padding: 0; }
  .login-intro p { margin-bottom: 18px; }
  .field input { height: 46px; }
  .password-toggle { top: 1px; right: 1px; }
  .login-button { min-height: 48px; margin-top: 0; }
  .access-note { margin-top: 14px; }
}
@media (max-width: 760px) and (max-height: 650px) {
  .login-shell { grid-template-rows: 86px minmax(0, 1fr); }
  .identity-content { padding: 12px 18px; }
  .identity-message, .panel-footer { display: none; }
  .login-panel { padding: 10px 18px; }
  .login-intro p { margin-bottom: 12px; }
  form { gap: 10px; }
}
/* Keep public verification separate from administrator credentials. */
.public-entry { padding: 16px; border: 1px solid #cfe3e8; border-radius: 13px; background: #f4fafb; }
.public-entry strong { display: block; color: #174658; font-size: 15px; }
.public-entry p { margin: 3px 0 10px; color: #69818d; font-size: 12px; }
.public-entry .login-button { margin-top: 0; }
.access-divider { margin: 18px 0; display: flex; align-items: center; gap: 10px; color: #607986; font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; white-space: nowrap; }
.access-divider::before, .access-divider::after { height: 1px; flex: 1; background: #dce6ea; content: ""; }
.access-note { margin-top: 13px; }
.mobile-access-label, .mobile-intro { display: none; }
@media (max-width: 760px) { .public-entry { padding: 12px; } .access-divider { margin: 12px 0; } }
@media (max-width: 760px) and (max-height: 650px) {
  .login-intro h2 { margin: 0 0 7px; font-size: 25px; }
  .login-intro p { display: none; }
  .public-entry { padding: 8px 10px; }
  .public-entry p { display: none; }
  .public-entry .login-button { min-height: 38px; margin-top: 5px; }
  .access-divider { margin: 8px 0; }
  .field { gap: 3px; }
  .field input { height: 36px; }
  .password-toggle { width: 34px; height: 34px; }
  .access-note { display: none; }
}
@media (max-width: 760px) {
  .desktop-access-label, .desktop-intro, .access-divider, .login-panel form, .access-note { display: none; }
  .mobile-access-label, .mobile-intro { display: block; }
  .login-content { width: min(100%, 420px); }
  .public-entry { padding: 18px; }
  .public-entry strong { font-size: 17px; }
  .public-entry p { font-size: 13px; }
  .public-entry .login-button { min-height: 54px; }
}
@media (max-width: 760px) and (max-height: 650px) {
  .login-intro p, .public-entry p { display: block; }
  .login-intro .desktop-intro { display: none; }
  .public-entry { padding: 12px; }
  .public-entry .login-button { min-height: 44px; }
}
@media (min-width: 761px) and (max-height: 690px) {
  .login-panel { padding-top: 16px; padding-bottom: 16px; }
  .login-intro p { display: none; }
  .login-intro h2 { margin: 6px 0 12px; font-size: 32px; }
  .public-entry { padding: 10px 12px; }
  .public-entry p { margin-bottom: 6px; }
  .public-entry .login-button { min-height: 42px; }
  .access-divider { margin: 10px 0; }
  .login-panel form { gap: 10px; }
  .login-panel .field { gap: 4px; }
  .login-panel .field input { height: 42px; }
  .password-toggle { top: 0; right: 0; height: 42px; }
  .access-note { margin-top: 8px; }
}
