/* Aurora-4 admin · luxe layer (login + entrance animations) */
@property --lx-a { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
:root { --lx-ease: cubic-bezier(.16, 1, .3, 1); --lx-gold: #d9b87a; --lx-gold-soft: #f3dfb4; --lx-red: #e11d48; --lx-red-deep: #a3112f; --lx-line: rgba(217, 184, 122, .18); --lx-display: 'Cormorant Garamond', Georgia, serif; --lx-text: 'Manrope', 'DM Sans', system-ui, sans-serif; }
body.admin-page { font-family: var(--lx-text); background: #0a0708; }
.admin-page h1, .admin-page h2 { font-family: var(--lx-display); font-style: normal; }
.admin-page .text-gradient, .admin-page .text-glow { background: none; -webkit-text-fill-color: currentColor; text-shadow: none; font-style: normal; }

/* ---------- Login ---------- */
.login-wrap { position: relative; overflow: hidden; isolation: isolate; background: #0a0708; }
.login-wrap::before, .login-wrap::after { content: ""; position: absolute; z-index: -2; width: 60vmax; height: 60vmax; border-radius: 50%; filter: blur(70px); opacity: .55; animation: lxFloat 16s ease-in-out infinite alternate; }
.login-wrap::before { background: radial-gradient(circle, rgba(225, 29, 72, .5), transparent 65%); top: -25vmax; left: -15vmax; }
.login-wrap::after { background: radial-gradient(circle, rgba(217, 184, 122, .3), transparent 65%); bottom: -28vmax; right: -18vmax; animation-delay: -6s; }
@keyframes lxFloat { to { transform: translate3d(8vmax, 6vmax, 0) scale(1.15); } }
.lx-spark { position: absolute; z-index: -1; width: 3px; height: 3px; border-radius: 50%; background: var(--lx-gold); opacity: 0; animation: lxSpark linear infinite; }
@keyframes lxSpark { 0% { transform: translateY(0) scale(.6); opacity: 0; } 15% { opacity: .8; } 100% { transform: translateY(-70vh) scale(1.2); opacity: 0; } }

.login-card { position: relative; width: min(440px, 100%); padding: clamp(28px, 6vw, 44px) !important; border: 0 !important; border-radius: 28px !important; background: rgba(16, 11, 12, .78) !important; backdrop-filter: blur(24px) saturate(140%); -webkit-backdrop-filter: blur(24px) saturate(140%); box-shadow: 0 50px 120px -30px rgba(0, 0, 0, .95), 0 0 80px -30px rgba(225, 29, 72, .5) !important; animation: lxCardIn 1.3s var(--lx-ease) both; }
.login-card::before { display: block !important; content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px; background: conic-gradient(from var(--lx-a), transparent 0 55%, var(--lx-gold) 75%, var(--lx-red) 90%, transparent 100%); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: lxSpin 6s linear infinite; pointer-events: none; }
@keyframes lxSpin { to { --lx-a: 360deg; } }
@keyframes lxCardIn { from { opacity: 0; transform: translate3d(0, 50px, 0) scale(.94); filter: blur(14px); } to { opacity: 1; transform: none; filter: none; } }
.login-card > * { animation: lxRise .9s var(--lx-ease) both; }
.login-card > *:nth-child(1) { animation-name: lxLogo; animation-delay: .35s; animation-duration: 1.3s; }
.login-card > *:nth-child(2) { animation-delay: .5s; } .login-card > *:nth-child(3) { animation-delay: .62s; } .login-card > *:nth-child(4) { animation-delay: .74s; }
.login-card > *:nth-child(5) { animation-delay: .84s; } .login-card > *:nth-child(6) { animation-delay: .94s; } .login-card > *:nth-child(7) { animation-delay: 1.04s; } .login-card > *:nth-child(8) { animation-delay: 1.12s; }
@keyframes lxRise { from { opacity: 0; transform: translate3d(0, 22px, 0); } to { opacity: 1; transform: none; } }
@keyframes lxLogo { from { opacity: 0; transform: scale(.4) rotate(-120deg); } to { opacity: 1; transform: none; } }
.login-logo { display: block; margin: 0 auto 14px; width: 78px !important; height: 78px !important; border-radius: 50%; box-shadow: 0 0 0 1px var(--lx-gold), 0 0 0 8px rgba(217, 184, 122, .08), 0 18px 40px -10px rgba(225, 29, 72, .6); }
.login-card h1 { font-size: 38px !important; font-weight: 600; text-align: center; color: var(--lx-gold-soft); margin-bottom: 22px; }
.login-field { position: relative; margin-bottom: 16px; }
.login-field label { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #a99d93; transition: color .3s; }
.login-field:focus-within label { color: var(--lx-gold); }
.login-field input { width: 100%; min-height: 52px; border-radius: 16px !important; border: 1px solid rgba(255, 255, 255, .1) !important; background: rgba(255, 255, 255, .04) !important; color: #f5ede1; transition: border-color .4s, box-shadow .4s, background .4s, transform .5s var(--lx-ease); }
.login-field input:focus { outline: none; border-color: var(--lx-gold) !important; background: rgba(217, 184, 122, .06) !important; box-shadow: 0 0 0 4px rgba(217, 184, 122, .12), 0 12px 30px -14px rgba(217, 184, 122, .5); transform: translateY(-2px); }
.pw-toggle { transition: color .3s, transform .4s var(--lx-ease); } .pw-toggle:hover { color: var(--lx-gold-soft); transform: scale(1.12); }
.login-error { min-height: 20px; color: #ff6b8a; font-size: 13px; }
.login-card.shake { animation: lxShake .5s cubic-bezier(.36, .07, .19, .97); }
@keyframes lxShake { 10%, 90% { transform: translateX(-2px); } 20%, 80% { transform: translateX(4px); } 30%, 50%, 70% { transform: translateX(-8px); } 40%, 60% { transform: translateX(8px); } }

/* premium buttons everywhere in admin */
.admin-btn { position: relative; overflow: hidden; isolation: isolate; border-radius: 999px !important; font-weight: 700; letter-spacing: .06em; transition: transform .5s var(--lx-ease), box-shadow .5s var(--lx-ease), border-color .4s, color .4s, background .4s; }
.admin-btn::after { content: ""; position: absolute; inset: 0; z-index: -1; transform: translateX(-120%) skewX(-20deg); background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .3), transparent); transition: transform .9s var(--lx-ease); }
.admin-btn:hover { transform: translateY(-3px); } .admin-btn:hover::after { transform: translateX(120%) skewX(-20deg); } .admin-btn:active { transform: translateY(0) scale(.97); }
.admin-btn.primary { background: linear-gradient(135deg, #f0305e, var(--lx-red) 50%, var(--lx-red-deep)) !important; border: 1px solid rgba(255, 255, 255, .16) !important; color: #fff; box-shadow: 0 12px 28px -12px rgba(225, 29, 72, .85); }
.admin-btn.primary:hover { box-shadow: 0 20px 38px -14px rgba(225, 29, 72, .95); }
.login-card .admin-btn.primary { min-height: 54px; font-size: 14px; }
.login-card .admin-btn.is-loading { pointer-events: none; color: transparent; }
.login-card .admin-btn.is-loading::before { content: ""; position: absolute; left: 50%; top: 50%; width: 20px; height: 20px; margin: -10px; border: 2px solid rgba(255, 255, 255, .35); border-top-color: #fff; border-radius: 50%; animation: lxRot .7s linear infinite; }
@keyframes lxRot { to { transform: rotate(360deg); } }
.login-secure, .login-note { color: #8d827a; text-align: center; }

/* ---------- Sign-in loader ---------- */
.login-loader { background: radial-gradient(circle at 50% 40%, #2b0b14, #0a0708 70%) !important; gap: 0 !important; overflow: hidden; }
.login-loader.show { animation: lxLoaderIn .6s var(--lx-ease) both; }
@keyframes lxLoaderIn { from { clip-path: circle(0% at 50% 60%); } to { clip-path: circle(150% at 50% 60%); } }
.ll-ring { position: relative; width: 120px; height: 120px; display: grid; place-items: center; margin-bottom: 26px; }
.ll-ring img { width: 84px; height: 84px; border-radius: 50%; animation: lxPulse 2s ease-in-out infinite; box-shadow: 0 0 40px -6px rgba(225, 29, 72, .7); }
.ll-ring::before, .ll-ring::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid transparent; }
.ll-ring::before { border-top-color: var(--lx-gold); border-right-color: rgba(217, 184, 122, .3); animation: lxRot 1.2s linear infinite; }
.ll-ring::after { inset: 10px; border-bottom-color: var(--lx-red); border-left-color: rgba(225, 29, 72, .3); animation: lxRot 1.8s linear infinite reverse; }
@keyframes lxPulse { 50% { transform: scale(1.06); } }
.ll-title { font-family: var(--lx-display); font-size: 40px; font-weight: 600; color: var(--lx-gold-soft); animation: lxRise .9s var(--lx-ease) .2s both; }
.ll-sub { color: #a99d93; font-size: 14px; letter-spacing: .08em; min-height: 22px; margin-top: 6px; transition: opacity .25s; animation: lxRise .9s var(--lx-ease) .35s both; }
.ll-sub.swap { opacity: 0; }
.ll-bar { width: min(260px, 70vw); height: 3px; margin-top: 22px; border-radius: 3px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.ll-bar span { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--lx-red), var(--lx-gold)); animation: lxBar 1.6s var(--lx-ease) forwards; }
@keyframes lxBar { to { width: 100%; } }

/* ---------- Dashboard entrance (plays once after login) ---------- */
.lx-enter .admin-topbar { animation: lxDown 1s var(--lx-ease) both; }
.lx-enter .admin-heading { animation: lxRise 1s var(--lx-ease) .12s both; }
.lx-enter .admin-stat { animation: lxPop .9s var(--lx-ease) both; }
.lx-enter .admin-stat:nth-child(1) { animation-delay: .22s; } .lx-enter .admin-stat:nth-child(2) { animation-delay: .3s; } .lx-enter .admin-stat:nth-child(3) { animation-delay: .38s; } .lx-enter .admin-stat:nth-child(4) { animation-delay: .46s; }
.lx-enter .admin-toolbar { animation: lxRise 1s var(--lx-ease) .5s both; }
.lx-enter .admin-items > * { animation: lxRise .9s var(--lx-ease) both; animation-delay: calc(.55s + var(--i, 0) * 45ms); }
@keyframes lxDown { from { opacity: 0; transform: translate3d(0, -40px, 0); } to { opacity: 1; transform: none; } }
@keyframes lxPop { from { opacity: 0; transform: translate3d(0, 24px, 0) scale(.9); } to { opacity: 1; transform: none; } }
.admin-stat { border-radius: 20px; transition: transform .6s var(--lx-ease), border-color .4s, box-shadow .6s var(--lx-ease); }
.admin-stat:hover { transform: translateY(-5px); border-color: rgba(217, 184, 122, .4); box-shadow: 0 24px 44px -24px rgba(225, 29, 72, .5); }
.admin-stat-value { font-family: var(--lx-display); font-size: 44px; color: var(--lx-gold-soft); }
.admin-heading h2 { font-weight: 600; }

@media (prefers-reduced-motion: reduce) { .login-card, .login-card > *, .lx-enter *, .login-wrap::before, .login-wrap::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }
.login-loader .ll-ring { animation: none !important; border: 0 !important; background: none !important; box-shadow: none !important; }
.login-loader .ll-ring img { transform: none; animation: lxPulse 2s ease-in-out infinite !important; }
.admin-stat-value, .admin-item-price, [class*="price"] { font-family: var(--lx-text) !important; font-variant-numeric: lining-nums tabular-nums; font-weight: 800; }
.admin-stat-value { font-size: 32px; color: #f5ede1; }