* { box-sizing: border-box; }
body { margin: 0; min-width: 280px; min-height: 100dvh; background: var(--ground); color: var(--ink); font-family: var(--font-family); font-size: 15px; line-height: 1.5; letter-spacing: -.3px; }
.login-header { height: var(--header-height); display: flex; align-items: center; padding: 0 28px; background: var(--surface); border-bottom: 1px solid var(--line); }
.login-header a { color: var(--ink); font-weight: 600; text-decoration: none; }
.login-main { display: grid; place-items: start center; padding: clamp(40px, 9vh, 88px) 20px 40px; }
.login-panel { width: 100%; max-width: 440px; padding: 32px; border: 1px solid var(--line); border-radius: var(--radius-panel); background: var(--surface); }
h1 { margin: 0; font-size: 24px; line-height: 1.4; font-weight: 600; letter-spacing: -.6px; }
.login-description { margin: 8px 0 28px; color: var(--muted); }
.login-field { display: grid; gap: 8px; margin-bottom: 20px; }
.login-field label { font-size: 14px; font-weight: 500; }
.login-field input { min-width: 0; width: 100%; height: 48px; padding: 0 12px; border: 1px solid var(--control-border); border-radius: var(--radius-control); background: var(--surface); color: var(--ink); font: inherit; }
.password-toggle { display: flex; align-items: center; gap: 8px; width: fit-content; margin: 0 0 24px; color: var(--muted); font-size: 14px; cursor: pointer; }
.password-toggle input { width: 16px; height: 16px; margin: 0; accent-color: var(--action-fill); }
button { width: 100%; height: 48px; border: 0; border-radius: var(--radius-control); background: var(--action-fill); color: var(--surface); font: inherit; font-weight: 600; cursor: pointer; }
button:hover { background: var(--accent-hover); }
button:disabled { opacity: .6; cursor: wait; }
:is(input, button, a, summary):focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.login-message { margin: 0 0 20px; color: var(--caution-ink); overflow-wrap: anywhere; }
.login-setup { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: 14px; }
.login-setup summary { color: var(--ink); font-weight: 600; cursor: pointer; }
.login-setup p { margin: 12px 0 0; }
.login-setup ol { margin: 12px 0 0; padding-left: 20px; }
.login-setup li + li { margin-top: 10px; }
code { font-size: 12px; overflow-wrap: anywhere; }
[hidden] { display: none !important; }
@media (max-width: 520px) { .login-header { padding: 0 20px; } .login-main { padding: 32px 16px; } .login-panel { padding: 24px 20px; } }