.auth-page{min-height:100dvh;display:grid;align-items:center;gap:2rem;padding:max(1rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left));background:radial-gradient(circle at 10% 10%,color-mix(in srgb,var(--color-brand) 14%,transparent),transparent 34%),var(--color-canvas)}
.auth-brand,.auth-card{width:min(100%,30rem);margin:auto}.auth-brand{display:grid;gap:.75rem;text-align:center}.auth-brand img{background:#fff;padding:6px;border-radius:12px;width:4.5rem;margin:auto}.auth-env{width:max-content;margin:auto;padding:.25rem .55rem;border:1px solid var(--color-brand);border-radius:999px;color:var(--color-brand-soft);font-size:.72rem;font-weight:800}.auth-brand p{color:var(--color-text-soft);line-height:1.55}
.auth-card{display:grid;gap:1.25rem;padding:clamp(1rem,5vw,2rem);border:1px solid var(--color-border);border-radius:var(--radius-2xl);background:var(--color-surface);box-shadow:var(--shadow-xl)}.auth-card header{display:grid;gap:.35rem}.auth-card header span{color:var(--color-brand-hover);font-size:.72rem;font-weight:800}.auth-card form{display:grid;gap:1rem}.auth-card label{display:grid;gap:.4rem;font-weight:700}.auth-card input{width:100%;min-height:48px;padding:0 .8rem;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-canvas)}.password-field{display:grid;grid-template-columns:1fr auto}.password-field input{border-radius:var(--radius-lg) 0 0 var(--radius-lg)}.password-field button{border:1px solid var(--color-border);border-left:0;border-radius:0 var(--radius-lg) var(--radius-lg) 0;background:var(--color-surface-soft)}.auth-submit{min-height:50px;border:0;border-radius:var(--radius-lg);color:#fff;background:var(--color-brand);font-weight:850}.auth-submit:hover{background:var(--color-brand-hover)}.auth-error{display:grid;gap:.2rem;padding:.8rem;border-left:3px solid var(--color-danger);border-radius:var(--radius-md);background:color-mix(in srgb,var(--color-danger) 10%,var(--color-surface))}.auth-error span{color:var(--color-text-soft)}.auth-links{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.75rem;font-size:.85rem}.demo-entry{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:1rem;border-top:1px solid var(--color-border)}.demo-entry>span{display:grid}.demo-entry button{border:1px solid var(--color-border);border-radius:var(--radius-lg);background:transparent}.auth-card footer{text-align:center;color:var(--color-text-muted);font-size:.75rem}.dev-session-strip{position:relative;z-index:60;display:flex;min-height:44px;align-items:center;gap:.75rem;padding:.35rem 1rem;color:#fff;background:var(--color-nav)}.dev-session-strip span{font-weight:850}.dev-session-strip small{color:#fff;flex:1}.dev-session-strip button{min-height:36px;border:1px solid rgba(255,255,255,.45);border-radius:.5rem;color:#fff;background:transparent}
@media(min-width:48rem){.auth-page{grid-template-columns:minmax(18rem,1fr) minmax(22rem,30rem);padding:clamp(2rem,7vw,6rem)}.auth-brand{text-align:left}.auth-brand img,.auth-env{margin-left:0}.auth-brand h1{font-size:clamp(2.4rem,6vw,4.8rem)}}
@media(max-width:30rem){.dev-session-strip{align-items:flex-start;flex-wrap:wrap}.dev-session-strip small{flex-basis:100%;order:3}.demo-entry{align-items:flex-start;flex-direction:column}.demo-entry button{width:100%}}