/* Login shell (index.html) only. Loaded after base.css. The application
   stylesheet (app.css) is deliberately NOT loaded on the login page. */

/* AUTH GATE */
#auth-gate { display: flex; align-items: center; justify-content: center; min-height: 100vh; background: linear-gradient(135deg, #225C5C 0%, #1a4a4a 60%, #3C3C3B 100%); }
.auth-box { background: var(--card); border-radius: var(--radius); padding: 48px 40px; width: 380px; text-align: center; box-shadow: 0 25px 50px rgba(0,0,0,.25); }
.auth-box h1 { font-size: 28px; margin-bottom: 6px; color: var(--primary); }
.auth-box p { color: var(--muted); margin-bottom: 28px; font-size: 14px; }
.auth-box input { width: 100%; padding: 12px 16px; border: 1px solid var(--border); border-radius: 8px; font-size: 15px; margin-bottom: 16px; }
.auth-box input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(34,92,92,.15); }
.auth-box button { width: 100%; padding: 12px; background: var(--coral); color: #fff; border: none; border-radius: 8px; font-size: 15px; font-weight: 600; cursor: pointer; transition: background .2s; }
.auth-box button:hover { background: #d95a49; }
.auth-err { color: var(--red); font-size: 13px; margin-bottom: 12px; display: none; }
.auth-box .form-group { margin-bottom: 12px; text-align: left; }
.auth-box .form-group label { display: block; font-size: 12px; font-weight: 600; color: var(--muted); margin-bottom: 4px; text-transform: uppercase; letter-spacing: .5px; }