/* ═══ Auth Pages — Shared CSS ═════════════════════════════ */

.auth-wrapper { min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;position:relative }
.auth-bg { position:fixed;top:0;left:0;right:0;bottom:0;pointer-events:none;z-index:0 }
.auth-bg-grid { position:absolute;inset:0;background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:60px 60px;opacity:.15;mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,black,transparent);-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,black,transparent) }
.auth-bg-orb { position:absolute;border-radius:50%;filter:blur(120px);opacity:.1 }
.auth-bg-orb-1 { width:400px;height:400px;background:var(--accent);top:-100px;right:-80px }
.auth-bg-orb-2 { width:300px;height:300px;background:var(--conforme);bottom:-60px;left:-60px;opacity:.05 }

.auth-theme-btn { position:fixed;top:20px;right:20px;z-index:100;width:40px;height:40px;border-radius:10px;background:var(--toggle-bg);border:1px solid var(--border);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1rem;transition:all .2s }
.auth-theme-btn:hover { background:var(--bg-card) }

.auth-card { position:relative;z-index:1;background:var(--bg-card);border:1px solid var(--border);border-radius:20px;padding:44px 40px;width:100%;max-width:420px;box-shadow:var(--shadow-card);animation:authFadeUp .5s ease-out both }

.auth-logo { text-align:center;margin-bottom:24px }
.auth-logo-icon { margin:0 auto 12px }
.auth-logo-wordmark { display:flex;align-items:baseline;justify-content:center;gap:2px }
.auth-logo-e { font-family:var(--font-display);font-size:1.8rem;color:var(--text) }
.auth-logo-s { font-family:var(--font-body);font-size:1.8rem;font-weight:300;color:var(--accent) }
.auth-logo-sub { font-size:.7rem;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--text-muted);margin-top:4px }

.auth-divider { height:1px;background:var(--border);margin:24px 0 }

.auth-tabs { display:flex;gap:0;margin-bottom:20px;border-bottom:2px solid var(--border) }
.auth-tab { flex:1;padding:10px 8px;text-align:center;font-size:.8rem;font-weight:600;color:var(--text-muted);cursor:pointer;border:none;background:none;border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .2s;font-family:var(--font-body) }
.auth-tab:hover { color:var(--text) }
.auth-tab.active { color:var(--accent);border-bottom-color:var(--accent) }
.auth-panel { display:none }
.auth-panel.active { display:block;animation:authFadeUp .3s ease-out both }

.auth-buttons { display:flex;flex-direction:column;gap:10px }
.btn-oauth { display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid var(--border);border-radius:var(--radius-sm);padding:13px 20px;font-family:var(--font-body);font-size:.88rem;font-weight:600;cursor:pointer;transition:all .2s;text-decoration:none }
.btn-oauth:hover { border-color:var(--accent);transform:translateY(-1px);box-shadow:var(--shadow) }
.btn-oauth:active { transform:translateY(0) }
.btn-oauth svg { width:20px;height:20px;flex-shrink:0 }
.btn-google { background:#fff;color:#1f1f1f }
.btn-microsoft { background:var(--bg-card);color:var(--text) }
[data-theme="dark"] .btn-google { background:var(--bg-input);color:var(--text) }
.auth-hint { text-align:center;font-size:.72rem;color:var(--text-dim);margin-top:12px;line-height:1.5 }

.form-group { display:flex;flex-direction:column;gap:5px;margin-bottom:12px;text-align:left }
.form-label { font-size:.75rem;font-weight:600;color:var(--text-secondary) }
.form-input { padding:11px 14px;border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-input);color:var(--text);font-family:var(--font-body);font-size:.85rem;transition:all .2s;outline:none }
.form-input:focus { border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-softer) }
.form-input::placeholder { color:var(--text-dim) }
.btn-submit { width:100%;padding:12px;border-radius:var(--radius-sm);background:var(--accent);color:var(--accent-text);border:none;font-family:var(--font-body);font-size:.88rem;font-weight:700;cursor:pointer;transition:all .2s;margin-top:6px;box-shadow:var(--shadow-accent) }
.btn-submit:hover { background:var(--accent-hover);transform:translateY(-1px) }
.form-footer { margin-top:12px;font-size:.75rem;color:var(--text-muted);text-align:center }
.form-footer a { color:var(--accent);text-decoration:none;font-weight:600 }

.msg-error { background:var(--non-conforme-bg);border:1px solid var(--non-conforme-border);color:var(--non-conforme);padding:10px 14px;border-radius:var(--radius-sm);font-size:.8rem;margin-bottom:14px;text-align:center }
.msg-success { background:var(--conforme-bg);border:1px solid var(--conforme-border);color:var(--conforme);padding:10px 14px;border-radius:var(--radius-sm);font-size:.8rem;margin-bottom:14px;text-align:center }
.resend-block { background:var(--accent-soft);border:1px solid var(--accent-border);border-radius:var(--radius-sm);padding:12px 14px;margin-bottom:14px;text-align:center }
.resend-block p { font-size:.75rem;color:var(--text-secondary);margin:0 0 8px }
.resend-btn { background:var(--accent);color:var(--accent-text);border:none;border-radius:6px;padding:6px 16px;font-size:.75rem;font-weight:700;cursor:pointer;font-family:var(--font-body) }

.auth-notice { margin-top:20px;font-size:.72rem;color:var(--text-muted);line-height:1.6;padding:12px 16px;background:var(--toggle-bg);border-radius:var(--radius-sm);border:1px solid var(--border);text-align:center }
.auth-notice a { color:var(--accent);text-decoration:none;font-weight:600 }

.auth-footer { position:relative;z-index:1;width:100%;max-width:420px;margin-top:20px;padding:16px 0;text-align:center;border-top:1px solid var(--border);animation:authFadeUp .5s ease-out .2s both }
.auth-footer-links { display:flex;gap:8px;justify-content:center;flex-wrap:wrap }
.auth-footer-links a { font-size:.72rem;color:var(--text-muted);transition:color .2s }
.auth-footer-links a:hover { color:var(--accent) }
.auth-footer-links .dot { width:3px;height:3px;border-radius:50%;background:var(--text-dim);align-self:center }
.auth-footer-copy { font-size:.65rem;color:var(--text-dim);margin-top:8px }

@keyframes authFadeUp { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }
@media(max-width:480px){ .auth-card{padding:32px 24px;border-radius:16px} .auth-logo-e,.auth-logo-s{font-size:1.5rem} }
