/* Stitch login export, isolated from authenticated panel styles. */
* { box-sizing: border-box; }
html { background: #020617; color-scheme: dark; }
body.auth-page { margin: 0; min-height: 100svh; display: flex; align-items: center; justify-content: center; background: #020617; color: #f1f5f9; font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", Inter, sans-serif; -webkit-font-smoothing: antialiased; touch-action: manipulation; }
button, input { font: inherit; }
button { cursor: pointer; }
[hidden] { display: none !important; }
.auth-shell { position: relative; isolation: isolate; width: 100%; max-width: 430px; min-height: 640px; height: 100svh; display: flex; flex-direction: column; overflow: hidden; background: #020617; }
.auth-backdrop { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.auth-portrait { position: absolute; inset: 0; width: 100%; height: 68%; object-fit: cover; object-position: top; opacity: 0; filter: blur(16px); transform: scale(1.03); transition: opacity 280ms cubic-bezier(.16,1,.3,1), filter 280ms cubic-bezier(.16,1,.3,1); }
.auth-portrait.is-active { opacity: .8; filter: blur(0); transition-duration: 1.8s; transition-timing-function: cubic-bezier(.42,0,.58,1); }
.auth-shade, .auth-vignette { position: absolute; inset: 0; }
.auth-shade-top { bottom: auto; height: 160px; background: linear-gradient(to bottom, rgba(2,6,23,.9), rgba(2,6,23,.5), transparent); }
.auth-shade-middle { background: linear-gradient(to bottom, transparent, rgba(2,6,23,.4) 55%, #020617); }
.auth-shade-bottom { top: auto; height: 60%; background: linear-gradient(to top, #020617, rgba(2,6,23,.95), transparent); }
.auth-vignette { background: radial-gradient(circle at top, transparent 30%, rgba(2,6,23,.75) 100%); }
.auth-card { margin-top: auto; margin-bottom: 8px; padding: 12px 28px; }
.auth-form { display: flex; flex-direction: column; gap: 24px; }
.auth-logo { display: block; width: auto; max-width: 100%; height: 36px; object-fit: contain; align-self: center; margin: 0; filter: brightness(0) invert(1); }
.auth-field { display: flex; align-items: center; position: relative; min-width: 0; padding: 4px 0 10px; border-bottom: 1px solid rgba(255,255,255,.2); }
.auth-field:focus-within { border-color: rgba(255,255,255,.8); }
.auth-field > svg { width: 20px; height: 20px; margin-right: 12px; flex-shrink: 0; color: #cbd5e1; }
.auth-field svg, .auth-submit svg, .auth-footer svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.auth-field input { width: 100%; min-width: 0; border: 0; border-radius: 0; outline: none; padding: 0; background: transparent; color: #f1f5f9; font-size: 16px; font-weight: 400; line-height: 24px; box-shadow: none; appearance: none; -webkit-appearance: none; }
.auth-field input::placeholder { color: #94a3b8; opacity: 1; }
.auth-field input:-webkit-autofill { -webkit-text-fill-color: #f1f5f9; caret-color: #f1f5f9; -webkit-background-clip: text !important; background-clip: text !important; -webkit-box-shadow: none !important; box-shadow: none !important; }
.auth-field input:autofill { -webkit-text-fill-color: #f1f5f9; caret-color: #f1f5f9; -webkit-background-clip: text !important; background-clip: text !important; box-shadow: none !important; }
#passwordInput { padding-right: 40px; }
.auth-password-toggle { display: grid; place-items: center; position: absolute; right: -8px; top: -6px; width: 40px; height: 40px; border: 0; padding: 0; background: transparent; color: #94a3b8; }
.auth-password-toggle svg { width: 16px; height: 16px; }
.auth-options { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 4px; font-size: 12px; line-height: 20px; }
.auth-options label { display: flex; align-items: center; gap: 8px; color: #cbd5e1; cursor: pointer; }
.auth-options input { appearance: none; width: 16px; height: 16px; border: 1px solid rgba(255,255,255,.25); border-radius: 4px; background: rgba(15,23,42,.6); margin: 0; cursor: pointer; }
.auth-options input:checked { background: #2563eb; border-color: #60a5fa; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='white' stroke-width='2' d='m3 8 3 3 7-7'/%3E%3C/svg%3E"); }
.auth-forgot { border: 0; padding: 0; background: none; color: #94a3b8; font-size: 12px; line-height: 20px; font-style: italic; }
.auth-password-toggle:hover, .auth-forgot:hover { color: #e2e8f0; }
.auth-submit-wrap { padding-top: 12px; }
.auth-submit { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 50px; padding: 14px 20px; border: 1px solid rgba(255,255,255,.22); border-radius: 16px; background: rgba(255,255,255,.08); backdrop-filter: blur(16px) saturate(120%); -webkit-backdrop-filter: blur(16px) saturate(120%); color: #f1f5f9; font-size: 14px; line-height: 20px; font-weight: 600; box-shadow: none; transition: transform 180ms cubic-bezier(.16,1,.3,1); }
.auth-submit:hover { background: rgba(255,255,255,.14); }
.auth-submit:active { transform: scale(.98); }
.auth-submit svg { width: 16px; height: 16px; stroke-width: 2.2; }
.auth-submit:disabled { opacity: .6; cursor: wait; }
.auth-footer { text-align: center; padding: 4px 24px calc(24px + env(safe-area-inset-bottom)); font-size: 11px; line-height: 16px; color: #94a3b8; }
.auth-footer > div { display: flex; align-items: center; justify-content: center; gap: 6px; }
.auth-footer svg { width: 14px; height: 14px; color: #60a5fa; stroke-width: 2; }
.auth-footer p { font-size: 10px; color: #64748b; margin: 4px 0 0; line-height: 16px; }
.auth-error, .auth-help { font-size: 12.8px; line-height: 20px; }
.auth-error { color: #fecaca; margin: 0 0 16px; }
.auth-help { color: #cbd5e1; margin: 0; }
button:focus-visible, .auth-options input:focus-visible { outline: 2px solid #60a5fa; outline-offset: 4px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (min-width: 640px) { .auth-shell { height: min(932px, 92svh); } }
@media (max-width: 639px) {
  .auth-page.auth-keyboard-open { overflow: hidden; }
  .auth-page.auth-keyboard-open .auth-shell { position: fixed; top: var(--auth-viewport-top, 0px); right: 0; left: 0; margin-inline: auto; min-height: 0; height: var(--auth-viewport-height); overflow-y: auto; overscroll-behavior-y: contain; }
  .auth-page.auth-keyboard-open .auth-card { margin-top: 24px; }
  .auth-page.auth-keyboard-open .auth-form { gap: 16px; }
  .auth-page.auth-keyboard-open .auth-logo { margin-bottom: 8px; }
  .auth-page.auth-keyboard-open .auth-card, .auth-page.auth-keyboard-open .auth-footer { flex-shrink: 0; }
}
@media (prefers-reduced-motion: reduce) { .auth-portrait, .auth-portrait.is-active, .auth-submit { transition: none; transform: none; } }