body { margin:0; min-height:100vh; background:#080e20!important; color:#e8edff; font-family:'Josefin Sans',sans-serif; overflow-x:hidden; }
body .sky-motion#sky-motion { left:14px; right:auto; bottom:14px; width:40px; height:40px; padding:0; margin:0; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#101a2dcc; color:#afbdd6; border:1px solid #bbcfff30; }
body .sky-motion#sky-motion:hover,body .sky-motion#sky-motion:focus-visible { color:#fff; background:#263353; border-color:#b49ee6; }
.sky-motion .sky-play-icon,.sky-motion[aria-pressed=true] .sky-pause-icon { display:none; }
.sky-motion[aria-pressed=true] .sky-play-icon { display:block; }
.night-user .footer .container-fluid { padding-left:70px; }
body:is(.night-user,.night-public,.night-auth) :is(.card,.form-box,.user-info,.stats-section,.last-5-unlocks,.the-cards,.the-body) { background:linear-gradient(145deg,#1b2840,#101a2d)!important; color:#dfe8fa; border:1px solid #bbcfff38; border-radius:20px; box-shadow:0 18px 50px #0003; transition:border-color .2s ease,box-shadow .2s ease; }
body:is(.night-user,.night-public,.night-auth) :is(.card,.form-box,.user-info,.stats-section,.last-5-unlocks,.the-cards,.the-body):hover { background:linear-gradient(145deg,#263353,#1c2440)!important; border:1px solid #b49ee680; box-shadow:0 18px 50px #0003,0 0 24px #a984ff18; transform:none; }
@media(prefers-reduced-motion:reduce) { body:is(.night-user,.night-public,.night-auth) :is(.card,.form-box,.user-info,.stats-section,.last-5-unlocks,.the-cards,.the-body) { transition:none; } }
.night-content { position:relative; z-index:1; }
.night-shared-moon { position:fixed; top:8vh; left:5vw; pointer-events:none; opacity:.75; }
.night-secondary { overflow-y:auto!important; height:auto!important; }
.night-secondary .night-content { min-height:100vh; padding:48px 20px 75px; }
.night-secondary .night-content>.container { display:block; height:auto; max-width:760px; padding:0; }
.night-secondary .account-pages { margin:0!important; }
.night-secondary .form-box,.night-secondary .card,.night-secondary .auth-fluid-form-box { background:linear-gradient(145deg,#1b2840ed,#101a2df5)!important; border:1px solid #bbcfff24; border-radius:24px; color:#dfe8fa; box-shadow:0 28px 80px #0005; }
.night-secondary .form-box { width:100%; max-width:640px; padding:32px; margin:auto; }
.night-secondary .card-header { background:#192740!important; border-bottom:1px solid #bbcfff24; }
.night-secondary .text-dark-50,.night-secondary h1,.night-secondary h2,.night-secondary h3,.night-secondary h4,.night-secondary label { color:#e8edff!important; }
.night-secondary .text-muted,.night-secondary p { color:#afbdd6!important; }
.night-secondary a { color:#c2b2f1; }
.night-secondary .form-control,.night-secondary select { background:#081225!important; color:#f2f6ff!important; border:1px solid #a4bde34d; border-radius:10px; min-height:46px; }
.night-secondary .form-control::placeholder { color:#8091ae; }
.night-secondary .form-control:focus { border-color:#b49ee6; box-shadow:0 0 0 3px #b49ee620; }
.night-secondary .btn-primary { background:#dce7ff!important; color:#132342!important; border:0; border-radius:10px; min-height:46px; }
.night-secondary .auth-fluid { background:none; min-height:0; max-width:640px; padding:0; margin:auto; }
.night-secondary .auth-fluid-form-box { width:100%; max-width:none; }
.night-secondary .auth-fluid-right,.night-secondary .green-header,.night-secondary .green-footer { display:none; }
.night-secondary .footer-bg-footer,.night-secondary .footer-bg-footer .container { background:transparent!important; height:auto; }
.night-directory .el-container { background:transparent!important; position:relative; z-index:1; }
.night-directory .navbar { background:#101a2deb!important; }
.night-directory .night-shared-moon { opacity:.35; }
.night-directory .footer-bg-footer,.night-directory .litte-footer-container,.night-secondary .litte-footer-container { background:transparent!important; }
.night-directory .search-box { background:#101a2deb!important; color:#e8edff!important; border:1px solid #bbcfff40; }
.night-directory .search-box::placeholder { color:#afbdd6!important; }
.night-directory .sky-motion { right:auto; left:22px; }
.sky-paused .night-sky::before,.sky-paused .night-sky::after { animation-play-state:paused; }
@media(max-width:720px) { .night-secondary .night-content { padding:135px 12px 70px; } .night-shared-moon { position:absolute; top:12px; left:calc(50% - 62px); } .night-secondary .form-box { padding:24px; } }
.night-sky { position:fixed; inset:0; overflow:hidden; pointer-events:none; isolation:isolate; background:radial-gradient(ellipse at 24% 35%,#1b2c50 0,transparent 48%),linear-gradient(135deg,#0c1429,#060a17); }
.night-sky::before,.night-sky::after { content:''; position:absolute; inset:-18%; z-index:-1; pointer-events:none; filter:blur(34px); opacity:.9; transform:translate(var(--nebula-x,0px),var(--nebula-y,0px)) rotate(-12deg) scale(1.12); background:radial-gradient(ellipse at 18% 45%,#8e52c878 0,transparent 25%),radial-gradient(ellipse at 44% 70%,#3468c878 0,transparent 26%),radial-gradient(ellipse at 77% 28%,#7040ad70 0,transparent 23%),radial-gradient(ellipse at 92% 72%,#27a7af58 0,transparent 21%); animation:nebulaDrift 42s ease-in-out infinite alternate,nebulaPulse 18s ease-in-out infinite; }
.night-sky::after { opacity:.42; filter:blur(58px); transform:translate(calc(var(--nebula-x,0px) * -.55),calc(var(--nebula-y,0px) * -.55)) rotate(18deg) scale(1.2); background:radial-gradient(ellipse at 12% 78%,#3f71bc42 0,transparent 24%),radial-gradient(ellipse at 62% 18%,#bb5c9540 0,transparent 22%),radial-gradient(ellipse at 84% 60%,#1faaa035 0,transparent 25%); animation:nebulaDriftReverse 58s ease-in-out infinite alternate,nebulaPulse 24s ease-in-out infinite reverse; }
@keyframes nebulaDrift { from { translate:-2% -1%; } to { translate:3% 2%; } }
@keyframes nebulaDriftReverse { from { translate:3% 2%; } to { translate:-2% -1%; } }
@keyframes nebulaPulse { 0%,100% { opacity:.82; } 50% { opacity:1; } }
.night-sky canvas { width:100%; height:100%; display:block; }
.night-login { position:relative; z-index:1; min-height:100vh; max-width:1180px; margin:auto; padding:64px 40px; display:grid; grid-template-columns:1fr 440px; align-items:center; gap:100px; }
.night-story { align-self:center; padding-bottom:45px; }
.night-eyebrow { color:#a5bbdf; letter-spacing:4px; font-size:11px; font-weight:700; text-transform:uppercase; }
.night-story h1 { color:#f3f5ff; font-size:clamp(42px,5vw,68px); line-height:1.08; font-weight:300; letter-spacing:-2px; margin:30px 0 20px; }
.night-story h1 span { color:#abbfef; }
.night-story p { color:#a3afc8; font-size:16px; line-height:1.8; max-width:340px; }
.moon-scene { width:240px; height:240px; margin:0 0 46px 25px; position:relative; transform:translate(var(--moon-x,0px),var(--moon-y,0px)); transition:transform .7s ease-out; }
.moon-scene::before { content:''; position:absolute; inset:-78px; border-radius:50%; background:radial-gradient(circle,#bf9cff2b 0 18%,#8d6fca18 38%,transparent 69%); filter:blur(4px); }
.moon-scene::after { content:'✦  ·  ✧'; position:absolute; right:-18px; top:20px; color:#d9c9ff; font-size:15px; letter-spacing:10px; text-shadow:0 0 14px #b995ff; transform:rotate(-18deg); opacity:.8; }
.moon { position:absolute; inset:22px; border-radius:50%; background:linear-gradient(118deg,#fff8e9 0%,#d8c6ff 38%,#9675c9 72%,#4a326d 100%); box-shadow:0 0 20px #d5bfff66,0 0 54px #a984ff3b,0 0 110px #7651c322; -webkit-mask:radial-gradient(circle at 66% 35%,transparent 0 53%,#000 54%); mask:radial-gradient(circle at 66% 35%,transparent 0 53%,#000 54%); transform:rotate(-18deg); }
.moon::before { content:'☽'; position:absolute; left:28%; top:28%; color:#f3eaffcc; font-size:26px; opacity:.38; transform:rotate(18deg); }
.moon-orbit { position:absolute; inset:-15px; border:1px solid #cab4ff36; border-radius:50%; transform:rotate(-25deg) scaleY(.82); box-shadow:0 0 20px #a77cf522; }
.moon-orbit::after { content:''; position:absolute; top:28px; right:29px; width:5px; height:5px; border-radius:50%; background:#f0e3ff; box-shadow:0 0 16px #d1b4ff,0 0 30px #a47aff; }
.night-login .form-box { width:100%; max-width:none; padding:32px 34px 24px; border-radius:24px; border:1px solid #bbcfff24; background:linear-gradient(145deg,#1b2840dc,#101a2deb); box-shadow:0 28px 80px #0005; backdrop-filter:blur(18px); }
.night-login .logo-finale { text-align:left; margin:0 0 25px; padding:0; }
.night-login .logo-finale img { width:82px; height:auto; }
.night-login .text-center h3 { font-size:27px; margin:0 0 10px; text-align:left; }
.night-login .text-center>p { color:#aebbd2!important; font-size:13px; line-height:1.7; text-align:left; }
.night-login .form-group { margin-bottom:15px; }
.night-login label { display:block; font-size:12px; color:#c6d1e6; margin-bottom:7px; }
.night-login .form-control { height:48px; padding:12px 15px; border:1px solid #a4bde32e; border-radius:10px; background:#08122580; color:#f2f6ff; box-shadow:none; }
.night-login .form-control::placeholder { color:#8091ae; }
.night-login .form-control:focus { border-color:#99b5ee; box-shadow:0 0 0 3px #a5bdff17; }
.night-login a { color:#bdcef9; }
.night-login a:hover { color:white; }
.night-login a:focus-visible,.night-login button:focus-visible { outline:2px solid #c7d8ff; outline-offset:4px; }
.night-login .forgot-your-password { display:block; text-align:right; margin:2px 0 19px; }
.night-login .btn-primary { width:100%; height:47px; border:0; border-radius:10px; background:#dce7ff; color:#132342; font-weight:700; box-shadow:0 6px 24px #a0baff16; transition:background .2s,transform .2s; }
.night-login .btn-primary:hover { background:white; transform:translateY(-1px); }
.night-login .more-buttons { display:flex; gap:12px; margin-top:24px; }
.night-login .more-buttons a { flex:1; padding:10px; text-align:center; border:1px solid #abc0ea26; border-radius:9px; font-size:12px; background:transparent; }
.night-login .new-partners { display:flex; justify-content:space-between; align-items:center; gap:18px; opacity:.75; }
.night-login .new-partners img { object-fit:contain; max-width:60px; height:34px; margin:0; }
.night-login .new-partners a { display:flex; }
.night-login .form-box>h4 { color:#9eacc6; font-size:10px; text-transform:uppercase; letter-spacing:3px; margin:0 0 16px; }
.night-login hr { border-color:#a7bde31a; margin:22px 0; }
.night-login .the-captcha { display:flex; justify-content:center; margin-top:15px; }
.night-footer { position:relative; z-index:1; text-align:center; padding:0 20px 24px; color:#6f809f; font-size:11px; letter-spacing:.5px; }
.sky-motion { position:fixed; right:22px; bottom:20px; z-index:2; border:1px solid #9eb5de30; border-radius:30px; background:#111c30; color:#b9c9e5; padding:8px 14px; font:inherit; font-size:11px; cursor:pointer; }
@media(max-width:900px) { .night-login { gap:35px; padding:42px 28px; grid-template-columns:1fr 400px; } .moon-scene { width:190px; height:190px; margin-left:0; } .night-story h1 { font-size:42px; } }
@media(max-width:720px) { .night-login { display:flex; flex-direction:column; gap:24px; padding:28px 18px 50px; } .night-story { padding:0; align-self:stretch; text-align:center; } .moon-scene { width:125px; height:125px; margin:0 auto 10px; } .moon { inset:10px; } .night-story h1 { font-size:28px; letter-spacing:-.5px; margin:12px 0; } .night-story p { display:none; } .night-eyebrow { font-size:9px; letter-spacing:3px; } .night-login .form-box { max-width:440px; padding:26px; } .night-footer { padding-bottom:65px; } }
@media(prefers-reduced-motion:reduce) { .moon-scene,.night-login .btn-primary,.night-sky::before,.night-sky::after { transition:none; animation:none; } }