.login-page { min-height: 100vh; min-height: 100svh; display: grid; place-items: center; padding: 24px 16px; }
.login-card { width: 100%; max-width: 380px; background: var(--color-panel); border: 1px solid var(--color-border-line); border-radius: var(--cds-radius); padding: 32px; }
.login-card h1 { margin: 0; font-family: var(--font-anthropic-serif); font-size: var(--cds-font-size-title); font-weight: 400; }
.login-brand { margin: 0 0 12px; color: var(--color-fg-muted); font-size: 13px; font-weight: 600; }
.login-intro { margin: 8px 0 24px; color: var(--color-fg-muted); }
.login-card form { display: grid; gap: 8px; }
.login-card input, .login-card button { width: 100%; min-height: 42px; padding: 10px 12px; font: inherit; border: 1px solid var(--color-border-line); border-radius: var(--cds-radius); }
.login-card input { background: var(--color-bg); color: var(--color-fg); }
.login-card label:not(:first-child) { margin-top: 8px; }
.login-card input:focus-visible, .login-card button:focus-visible { outline: 2px solid var(--color-fg); outline-offset: 2px; }
.login-card button { margin-top: 12px; background: var(--color-fg); color: var(--color-bg); cursor: pointer; }
.login-error { color: var(--color-bad); margin: 0 0 16px; }