/* Onboarding + redesigned login (MaalTrack) */
.ob{--t:#059a8c;--td:#06565a;--ink:#0b1b3a;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;background:linear-gradient(180deg,#e8f8fb 0%,#f6fcfd 55%,#fff 100%);position:relative;overflow:hidden;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}
.ob-blob{position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}
.ob-blob.a{width:380px;height:380px;left:-150px;top:-60px;background:radial-gradient(circle at 40% 40%,#5eead4,#0d9488 70%);opacity:.55}
.ob-blob.b{width:300px;height:300px;right:-120px;top:120px;background:#bff3ee;opacity:.6}
.ob-top{width:100%;max-width:440px;display:flex;justify-content:space-between;align-items:center;padding:18px 24px 0;position:relative;z-index:2;min-height:52px}
.ob-brand{display:flex;align-items:center;gap:10px;font-weight:800;color:var(--ink);font-size:18px}
.ob-brand img{width:36px;height:36px;border-radius:11px}
.ob-skip{color:var(--t);font-weight:700;font-size:15px;padding:8px 4px}
.ob-track{width:100%;max-width:440px;flex:1;overflow:hidden;position:relative;z-index:2}
.ob-slides{display:flex;height:100%;transition:transform .45s cubic-bezier(.22,.9,.3,1)}
.ob-slide{min-width:100%;padding:8px 28px 0;display:flex;flex-direction:column;align-items:center;text-align:center}
.ob-art{width:100%;max-width:340px;aspect-ratio:1/0.92;animation:obf 5s ease-in-out infinite}
@keyframes obf{50%{transform:translateY(-6px)}}
.ob-slide h2{font-family:inherit;font-weight:800;font-size:29px;line-height:1.15;color:var(--ink);margin-top:14px;letter-spacing:-.02em}
.ob-slide h2 em{font-style:normal;color:var(--t)}
.ob-slide p{margin-top:10px;color:#52607a;font-size:15.5px;line-height:1.5;max-width:300px}
.ob-dots{display:flex;gap:8px;justify-content:center;margin:14px 0 18px;position:relative;z-index:2}
.ob-dots i{width:9px;height:9px;border-radius:99px;background:#cfe0ea;transition:.3s}
.ob-dots i.on{width:26px;background:var(--t)}
.ob-actions{width:100%;max-width:440px;display:flex;gap:12px;padding:0 24px 26px;position:relative;z-index:2}
.ob-btn{flex:1;height:54px;border-radius:99px;font-weight:700;font-size:16px;display:flex;align-items:center;justify-content:center;gap:8px;transition:.2s;border:1.5px solid #c9d6e6;color:#5b6b86;background:#fff}
.ob-btn.p{background:linear-gradient(135deg,#0bb5a4,#059a8c);color:#fff;border:0;box-shadow:0 10px 22px -8px rgba(5,154,140,.6);flex:1.5}
.ob-btn:active{transform:scale(.97)}
/* login */

.ob button{font-family:inherit;cursor:pointer}.ob .ob-btn{background:#fff;border:1.5px solid #c9d6e6}.ob .ob-btn.p{background:linear-gradient(135deg,#0bb5a4,#059a8c);border:0}
.ob .ob-skip{background:none;border:0}

.mtl,.mtl *{box-sizing:border-box}
.mtl{min-height:100vh;min-height:100dvh;background:#06565a}
.pl{max-width:460px;margin:0 auto;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:#06565a}
.pl-hero{position:relative;overflow:hidden;color:#fff;padding:calc(env(safe-area-inset-top) + 34px) 26px 64px;background:radial-gradient(120% 90% at 85% 0%,#14b8a6 0%,#0a7f80 45%,#06565a 100%);flex:none}
.pl-o{position:absolute;border-radius:50%;pointer-events:none;animation:plf 9s ease-in-out infinite}
.pl-o.a{width:260px;height:260px;right:-90px;top:-80px;background:rgba(255,255,255,.1)}
.pl-o.b{width:170px;height:170px;left:-60px;bottom:-40px;background:rgba(250,194,77,.16);animation-delay:-3s}
.pl-o.c{width:90px;height:90px;right:40px;bottom:30px;background:rgba(94,234,212,.2);animation-delay:-6s}
@keyframes plf{50%{transform:translate(8px,-12px) scale(1.05)}}
.pl-brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:800;position:relative}
.pl-brand img{width:46px;height:46px;border-radius:15px;box-shadow:0 8px 20px rgba(0,0,0,.25);border:1.5px solid rgba(255,255,255,.35)}
.pl-brand b{color:#fcd34d;font-weight:800}
.pl-hero h1{font-size:34px;line-height:1.1;font-weight:800;letter-spacing:-.02em;margin-top:30px;position:relative}
.pl-hero h1 em{font-style:normal;color:#fcd34d}
.pl-hero p{margin-top:12px;color:rgba(255,255,255,.78);font-size:15.5px;line-height:1.5;max-width:300px;position:relative}
.pl-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;position:relative}
.pl-chip{display:flex;align-items:center;gap:8px;padding:7px 12px 7px 7px;border-radius:99px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:13px;font-weight:600;animation:plf 7s ease-in-out infinite}
.pl-chip.c2{animation-delay:-2s}.pl-chip.c3{animation-delay:-4s}
.pl-chip span{width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.9);color:#0d9488;display:flex;align-items:center;justify-content:center}
.pl-chip svg{width:14px;height:14px}
.pl-sheet{flex:1;background:#fff;border-radius:32px 32px 0 0;margin-top:-34px;padding:28px 22px calc(env(safe-area-inset-bottom) + 22px);position:relative;box-shadow:0 -16px 40px -20px rgba(0,0,0,.35)}
.pl-sheet h2{font-size:25px;font-weight:800;color:#0b1b3a;letter-spacing:-.01em}
.pl-s{color:#64748b;font-size:14.5px;margin:4px 0 22px}
.mtl .pl-g{width:100%;height:58px;border-radius:18px;background:#fff;border:1.5px solid #dbe5ee;color:#0b1b3a;font-weight:700;font-size:16.5px;display:flex;align-items:center;justify-content:center;gap:12px;box-shadow:0 10px 24px -14px rgba(8,60,80,.45);transition:.2s;font-family:inherit;cursor:pointer}
.pl-g svg{width:24px;height:24px}
.pl-g:active,.pl-guest:active{transform:scale(.98)}.pl-g:disabled{opacity:.6}
.pl-or{display:flex;align-items:center;gap:14px;color:#94a3b8;font-size:13px;margin:16px 0}
.pl-or:before,.pl-or:after{content:"";flex:1;height:1px;background:#e2e8f0}
.mtl .pl-guest{width:100%;height:58px;border-radius:18px;background:linear-gradient(135deg,#0bb5a4,#059a8c);color:#fff;font-weight:700;font-size:16.5px;display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;box-shadow:0 14px 26px -12px rgba(5,154,140,.7);transition:.2s}
.pl-note{text-align:center;color:#7a8aa3;font-size:12.5px;line-height:1.45;margin:14px 10px 0}
.pl-foot{display:flex;align-items:center;justify-content:center;gap:6px;color:#0d9488;font-size:12.5px;font-weight:600;margin-top:18px}
@media(min-width:520px){.pl{margin-top:4vh;min-height:auto;border-radius:32px;overflow:hidden;box-shadow:0 30px 70px -30px rgba(0,0,0,.5)}.mtl{background:#e8f4f5;padding-bottom:4vh}}
.av-badge{position:absolute;right:-3px;bottom:-3px;width:18px;height:18px;border-radius:50%;background:#fff;color:#0d9488;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.25)}
.av-badge svg{width:10px;height:10px}
.st-avatar{overflow:hidden}
