@import url('/css/app.css?v=4');
* { box-sizing: border-box; }
body { display: grid; min-height: 100vh; margin: 0; place-items: center; padding: 24px; background: var(--bg); color: var(--text); }
.auth-card { width: min(400px, 100%); padding: 32px; border: 1px solid var(--border); border-radius: 24px; background: var(--surface); box-shadow: 0 24px 80px rgba(0,0,0,.24); }
.auth-brand { display: flex; align-items: center; gap: 13px; margin-bottom: 30px; }
.auth-brand img { width: 54px; height: 54px; border-radius: 17px; object-fit: cover; }
.auth-brand strong, .auth-brand small { display: block; }
.auth-brand strong { font: 700 1.15rem 'Outfit', sans-serif; letter-spacing: .08em; }
.auth-brand small { margin-top: 2px; color: var(--muted); font-size: .67rem; letter-spacing: .25em; }
h1 { margin: 0 0 24px; font: 600 1.6rem 'Outfit', sans-serif; }
label { display: block; margin: 15px 0 7px; color: var(--muted); font-size: .78rem; }
input { width: 100%; height: 48px; padding: 0 14px; border: 1px solid var(--border); border-radius: 12px; outline: 0; background: var(--bg); color: var(--text); font: inherit; }
input:focus { border-color: #5791f5; box-shadow: 0 0 0 3px rgba(87,145,245,.1); }
.primary { width: 100%; height: 48px; margin-top: 22px; border: 0; border-radius: 12px; background: #3979ee; color: white; font-weight: 700; cursor: pointer; }
.primary:disabled { opacity: .6; cursor: wait; }
.text-link { display: block; margin-top: 17px; color: #72a1fa; font-size: .8rem; text-align: center; text-decoration: none; }
.status { margin: 16px 0 0; color: var(--muted); font-size: .8rem; line-height: 1.5; text-align: center; }
.status.error { color: #fb7185; }
[hidden] { display: none !important; }