/* Panel login screen — extracted from resources/views/auth/login.blade.php in 0.7.1.
   Was an inline <style> block, re-sent in every HTML response and
   impossible to allow under a `style-src 'self'` policy. */

* { box-sizing: border-box; }
body {
    margin: 0; min-height: 100vh; display: flex; align-items: center; justify-content: center;
    background: #0a0a11; color: #c3c8d8; padding: 24px;
    font-family: 'Archivo', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
    position: relative; overflow: hidden;
}
body::before {
    content: '';
    position: absolute; top: -35%; right: -12%;
    width: 520px; height: 520px;
    background: radial-gradient(circle, rgba(99,102,241,0.08) 0%, transparent 62%);
    pointer-events: none;
}
body::after {
    content: '';
    position: absolute; bottom: -25%; left: -10%;
    width: 420px; height: 420px;
    background: radial-gradient(circle, rgba(99,102,241,0.04) 0%, transparent 60%);
    pointer-events: none;
}
.login-card {
    width: 100%; max-width: 410px;
    background: rgba(20,20,30,0.85);
    backdrop-filter: blur(16px);
    border: 1px solid rgba(150,155,185,0.12); border-radius: 18px;
    padding: 40px 36px;
    box-shadow: 0 30px 80px -30px rgba(0,0,0,0.7),
                inset 0 1px 0 rgba(255,255,255,0.03);
    position: relative; z-index: 1;
}
.brand-row { display: flex; align-items: center; gap: 11px; margin-bottom: 6px; }
.brand-icon {
    width: 38px; height: 38px; border-radius: 10px;
    background: linear-gradient(135deg, #6366f1, #818cf8);
    display: flex; align-items: center; justify-content: center;
    font-size: 0.82rem; font-weight: 700; color: #fff;
    font-family: 'JetBrains Mono', monospace; letter-spacing: -0.02em;
}
.brand { font-family: 'JetBrains Mono', monospace; font-size: 1.55rem; font-weight: 700; letter-spacing: -0.02em; color: #f4f5fb; margin: 0; line-height: 1; }
.brand span { color: #6366f1; }
.subtitle { color: #8b93a7; font-size: 0.88rem; margin-bottom: 28px; margin-top: 4px; }

label { display: block; font-size: 0.8rem; color: #94a3b8; margin-bottom: 7px; font-weight: 600; letter-spacing: 0.01em; }
input[type=email], input[type=password] {
    width: 100%; background: rgba(11,11,17,0.8); border: 1px solid rgba(150,155,185,0.14); color: #f4f5fb;
    border-radius: 9px; padding: 12px 15px; font-size: 0.92rem; outline: none;
    font-family: inherit; transition: all 0.18s ease;
}
input:focus { border-color: #6366f1; box-shadow: 0 0 0 3px rgba(99,102,241,0.15); background: rgba(11,11,17,1); }

.remember { display: flex; align-items: center; gap: 9px; margin-bottom: 24px; font-size: 0.84rem; color: #8b93a7; cursor: pointer; }
.remember input { margin: 0; accent-color: #6366f1; width: 16px; height: 16px; }

button {
    width: 100%; background: linear-gradient(135deg, #6366f1, #818cf8); border: none; color: #fff;
    font-weight: 600; font-size: 0.95rem; border-radius: 9px; padding: 13px;
    cursor: pointer; transition: all 0.2s ease; font-family: inherit;
}
button:hover { transform: translateY(-1px); box-shadow: 0 8px 28px rgba(99,102,241,0.32); }
button:active { transform: translateY(0); }

.error-box {
    background: rgba(248,113,113,0.08); border: 1px solid rgba(248,113,113,0.25);
    color: #fca5a5; border-radius: 9px; padding: 11px 15px; font-size: 0.84rem;
    margin-bottom: 20px; display: flex; align-items: center; gap: 8px;
}
.field-error { color: #fca5a5; font-size: 0.76rem; margin-top: -10px; margin-bottom: 16px; }

.back {
    display: inline-flex; align-items: center; gap: 5px;
    text-align: center; margin-top: 24px; color: #8b93a7;
    font-size: 0.82rem; text-decoration: none;
    transition: color 0.18s ease;
}
.back:hover { color: #a5b4fc; }