/* CashMee login screen (public/js/login.js) */
.loginx{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:20px 16px;overflow:auto;
  background:radial-gradient(circle at 15% 10%,#B9F0FF 0,transparent 45%),radial-gradient(circle at 90% 90%,#D7F9B5 0,transparent 45%),linear-gradient(160deg,#E6F8FF,#F3FFE9)}
[data-theme=dark] .loginx{background:radial-gradient(circle at 15% 10%,#12415A 0,transparent 50%),radial-gradient(circle at 90% 90%,#244515 0,transparent 50%),#0F1C24}
.loginx[hidden]{display:none}
html.login-open #app > :not(#login){visibility:hidden}
.lx-sky img{position:fixed;width:54px;opacity:.85;animation:lxFloat 7s ease-in-out infinite;pointer-events:none}
.lx-sky img:nth-child(1){left:8%;top:12%}
.lx-sky img:nth-child(2){right:10%;top:20%;width:46px;animation-delay:-2s}
.lx-sky img:nth-child(3){left:14%;bottom:16%;width:40px;animation-delay:-4s}
.lx-sky img:nth-child(4){right:12%;bottom:10%;width:58px;animation-delay:-1s}
@keyframes lxFloat{50%{transform:translateY(-14px) rotate(8deg)}}
@keyframes lxBob{50%{transform:translateY(-6px) rotate(-5deg)}}
.lx-card{position:relative;width:100%;max-width:380px;background:#fff;border:2px solid #D5ECF5;border-radius:28px;box-shadow:0 6px 0 #D5ECF5,0 20px 40px rgba(28,120,170,.12);
  padding:28px 22px 20px;text-align:center;color:#22313F;transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
[data-theme=dark] .lx-card{background:#172833;border-color:#23394A;box-shadow:0 6px 0 #0A141A;color:#E8F4FA}
.lx-card.ok{transform:scale(1.03)}
.lx-mascot{width:96px;height:96px;margin:-70px auto 6px;animation:lxBob 3s ease-in-out infinite}
.lx-mascot img{width:100%;height:100%;filter:drop-shadow(0 6px 8px rgba(0,0,0,.15))}
.lx-card h1{font-family:Mitr,Anuphan,sans-serif;font-weight:600;font-size:34px;margin:0;color:#1287C4}
[data-theme=dark] .lx-card h1{color:#49C0F8}
.lx-hi{margin:2px 0 22px;color:#5A7283;font-size:16px}
[data-theme=dark] .lx-hi,[data-theme=dark] .lx-foot{color:#9DB6C5}
.lx-btn{width:100%;min-height:56px;border-radius:18px;border:2px solid #D5ECF5;background:#fff;color:inherit;font:inherit;font-size:17px;font-weight:700;
  display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;margin-top:10px;box-shadow:0 4px 0 #D5ECF5;transition:transform 120ms,box-shadow 120ms}
.lx-btn img{width:28px;height:28px}
.lx-btn.primary{background:#43A000;border-color:#3B8A00;color:#fff;box-shadow:0 4px 0 #2F7300}
.lx-btn:active{transform:translateY(4px);box-shadow:none}
.lx-btn:disabled{opacity:.7;cursor:progress}
.lx-btn:focus-visible,.lx-link:focus-visible{outline:3px solid #1CB0F6;outline-offset:2px}
[data-theme=dark] .lx-btn:not(.primary){background:#10202A;border-color:#23394A;box-shadow:0 4px 0 #0A141A}
#lxCode label{display:block;font-size:15px;margin-bottom:8px}
#lxCodeIn{width:100%;height:64px;border-radius:18px;border:2px solid #D5ECF5;background:#F0FBFF;color:inherit;text-align:center;font-family:Prompt,monospace;font-size:32px;letter-spacing:.4em;outline:none}
[data-theme=dark] #lxCodeIn{background:#10202A;border-color:#23394A}
#lxCodeIn:focus{border-color:#1CB0F6;box-shadow:0 0 0 3px rgba(28,176,246,.25)}
.lx-link{border:0;background:none;color:#0F7FB5;font:inherit;font-size:15px;margin-top:12px;cursor:pointer;min-height:44px}
[data-theme=dark] .lx-link{color:#49C0F8}
.lx-err{min-height:22px;margin:12px 0 0;font-size:14px;color:#D93B3B}
[data-theme=dark] .lx-err{color:#FF7B7B}
.lx-foot{margin:10px 0 0;font-size:12px;color:#5A7283}
@media (prefers-reduced-motion:reduce){.lx-sky img,.lx-mascot{animation:none}}
