:root {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #151515;
  background: #fff;
  color-scheme: light;
  font-synthesis: none;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; }
button, input { font: inherit; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }
button:focus-visible, input:focus-visible { outline: 2px solid #1f5f9b; outline-offset: 3px; }
.login-shell { width: min(100% - 44px, 424px); margin: clamp(26px, 12vh, 120px) auto 36px; }
.brand { padding-bottom: 17px; border-bottom: 1px solid #dcdcdc; font-size: 26px; font-weight: 780; letter-spacing: -.04em; }
.login-content { padding: 26px 0 30px; }
h1 { margin: 0; font-size: clamp(29px, 7vw, 34px); font-weight: 780; letter-spacing: -.055em; }
.intro { font-size: 17px; color: #505050; margin: 7px 0 23px; }
label { display: block; margin: 0 0 8px; font-size: 15px; font-weight: 570; }
.password-field { position: relative; }
input { width: 100%; height: 50px; padding: 10px 51px 10px 12px; border: 1px solid #bfbfbf; border-radius: 8px; font-size: 17px; background: #fff; }
input[aria-invalid=true] { border-color: #ad2323; }
.visibility { display: grid; place-items: center; background: transparent; border: none; color: #202020; position: absolute; top: 3px; right: 3px; height: 44px; width: 44px; border-radius: 5px; }
.visibility svg { width: 20px; height: 20px; }
.visibility[aria-pressed=true] { background: #f2f2f2; }
.submit { display: flex; justify-content: center; align-items: center; gap: 8px; width: 100%; min-height: 50px; margin-top: 24px; background: #111; color: white; border: 0; border-radius: 8px; font-weight: 650; }
.submit:hover { background: #323232; }
.submit svg { width: 20px; height: 20px; }
.error { color: #ad2323; font-size: 14px; margin: 9px 0 0; }
footer { text-align: center; padding-top: 16px; border-top: 1px solid #dcdcdc; color: #505050; font-size: 14px; }