html { color-scheme: dark; }
body {
  background: radial-gradient(circle at 15% 10%, rgba(56, 143, 220, .25), transparent 38%),
              radial-gradient(circle at 85% 85%, rgba(65, 174, 151, .15), transparent 35%), #071320 !important;
  font-family: Inter, "Segoe UI", system-ui, sans-serif !important;
}
body .card {
  width: min(450px, 100%);
  padding: clamp(26px, 5vw, 38px);
  border: 1px solid rgba(142, 190, 234, .24) !important;
  border-radius: 24px;
  background: linear-gradient(145deg, #182e49, #101f34) !important;
  box-shadow: 0 24px 65px rgba(1, 8, 18, .36), inset 0 1px rgba(255, 255, 255, .06);
}
.login-mark { display: grid; place-items: center; width: 58px; height: 58px; margin-bottom: 22px; border-radius: 16px; background: linear-gradient(145deg, #a4dfff, #66affb 60%, #77e0ba); color: #062137; font-size: 32px; font-weight: 800; box-shadow: 0 10px 30px rgba(66, 153, 237, .25); }
body h1 { font-size: clamp(27px, 5vw, 34px); letter-spacing: -.04em; }
body .subtitle { margin-bottom: 25px; color: #b7cbdf; font-size: 14px; }
body label { margin-top: 16px; color: #d0e0ef; font-size: 13px; font-weight: 650; }
body input { min-height: 48px; border-color: rgba(146, 187, 226, .34); border-radius: 11px; background: #0a1b2c; }
body input:focus-visible, body button:focus-visible { outline: 3px solid #7ac5ff; outline-offset: 3px; }
body button { min-height: 47px; border-color: rgba(144, 205, 255, .46); border-radius: 11px; background: linear-gradient(130deg, #3678b7, #26669e); font-size: 14px; font-weight: 750; }
body button:hover:not(:disabled) { background: #4389c9; }
body button.secondary { background: rgba(111, 155, 198, .1); color: #d3e5f6; }
body .info { border-color: rgba(138, 185, 227, .3); border-radius: 11px; background: rgba(84, 145, 203, .09); color: #c8ddf0; }