:root{
  --sma-bg1:#07111f;
  --sma-bg2:#0b1730;
  --sma-card1:rgba(13,24,46,.78);
  --sma-card2:rgba(8,14,28,.9);
  --sma-border:rgba(255,255,255,.12);
  --sma-text:#f8fbff;
  --sma-sub:#bfd1ea;
  --sma-accent1:#7c3aed;
  --sma-accent2:#06b6d4;
  --sma-accent3:#22c55e;
}
.sma-wrap{max-width:860px;margin:28px auto;padding:16px;position:relative;z-index:1}
.sma-card,.sma-lock-card{position:relative;overflow:hidden;background:linear-gradient(145deg,var(--sma-card1),var(--sma-card2));backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid var(--sma-border);border-radius:30px;color:var(--sma-text);box-shadow:0 25px 80px rgba(2,6,23,.45), inset 0 1px 0 rgba(255,255,255,.14), inset 0 -18px 40px rgba(0,0,0,.22)}
.sma-card{padding:24px}
.sma-card.small{max-width:430px;margin:0 auto}
.sma-card::before,.sma-lock-card::before{content:"";position:absolute;inset:-30% auto auto -10%;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,rgba(124,58,237,.30),transparent 65%);pointer-events:none}
.sma-card::after,.sma-lock-card::after{content:"";position:absolute;inset:auto -8% -18% auto;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(6,182,212,.22),transparent 65%);pointer-events:none}
.sma-brand{position:relative;z-index:1;margin-bottom:18px}
.sma-brand h2{margin:0;font-size:30px;font-weight:900;letter-spacing:.2px;text-shadow:0 6px 18px rgba(0,0,0,.25)}
.sma-brand p{margin:8px 0 0;color:var(--sma-sub);font-size:15px}
.sma-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 20px;position:relative;z-index:1}
.sma-tab,.sma-btn{border:none;cursor:pointer;transition:transform .22s ease, box-shadow .22s ease, opacity .22s ease}
.sma-tab{background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.05));border:1px solid rgba(255,255,255,.08);color:#eef7ff;padding:12px 16px;border-radius:16px;font-weight:800;box-shadow:0 10px 25px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.12)}
.sma-tab.active{background:linear-gradient(135deg,var(--sma-accent1),var(--sma-accent2));color:#fff}
.sma-panel{display:none;position:relative;z-index:1}
.sma-panel.active{display:block;animation:smaPop .35s ease}
.sma-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.sma-grid.single{grid-template-columns:1fr}
.sma-grid input,.sma-grid select,.sma-otp-row input,#sma_unlock_mpin,#sma_global_unlock_mpin{width:100%;box-sizing:border-box;padding:15px 16px;border-radius:18px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.04));color:#fff;outline:none;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 22px rgba(2,6,23,.18)}
.sma-grid input:focus,.sma-grid select:focus,.sma-otp-row input:focus,#sma_unlock_mpin:focus,#sma_global_unlock_mpin:focus{border-color:rgba(34,197,94,.55);transform:translateY(-1px);box-shadow:0 0 0 3px rgba(34,197,94,.14), inset 0 1px 0 rgba(255,255,255,.1), 0 16px 28px rgba(2,6,23,.28)}
.sma-grid input::placeholder,.sma-otp-row input::placeholder,#sma_unlock_mpin::placeholder,#sma_global_unlock_mpin::placeholder{color:#9cb4d3}
.sma-otp-row{display:grid;grid-template-columns:1.2fr .95fr 1fr;gap:12px;margin-top:14px}
.sma-btn{padding:14px 18px;border-radius:18px;background:linear-gradient(135deg,var(--sma-accent3),var(--sma-accent2));color:#03131e;font-weight:900;box-shadow:0 14px 30px rgba(6,182,212,.22), inset 0 1px 0 rgba(255,255,255,.26)}
.sma-btn:hover,.sma-tab:hover{transform:translateY(-2px) scale(1.01)}
.sma-btn-outline{background:linear-gradient(180deg,rgba(255,255,255,.15),rgba(255,255,255,.07));color:#fff;box-shadow:0 12px 26px rgba(2,6,23,.2), inset 0 1px 0 rgba(255,255,255,.14)}
.sma-alert{margin:0 0 16px;padding:13px 15px;border-radius:16px;font-weight:800;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.sma-alert.success{background:rgba(5,46,31,.88);color:#bbf7d0;border:1px solid rgba(34,197,94,.28)}
.sma-alert.error{background:rgba(63,17,17,.9);color:#fecaca;border:1px solid rgba(239,68,68,.28)}
.sma-logged-box{position:relative;z-index:1;background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.04));padding:22px;border-radius:24px;border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 20px 45px rgba(2,6,23,.2)}
.sma-logged-box h3{margin-top:0;font-size:24px}
.sma-logged-box p{margin:8px 0;color:#e7f0fb}
.sma-sub{color:var(--sma-sub);margin-bottom:14px}
.sma-unlocked{padding:18px;border-radius:20px;background:rgba(5,46,31,.9);color:#bbf7d0;font-weight:800;border:1px solid rgba(34,197,94,.3)}
.sma-lock-overlay{position:fixed;inset:0;display:none;align-items:center;justify-content:center;padding:18px;z-index:999999}
.sma-lock-overlay.active{display:flex;animation:smaFade .3s ease}
.sma-lock-backdrop{position:absolute;inset:0;background:radial-gradient(circle at top,rgba(124,58,237,.22),transparent 35%),rgba(2,6,23,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.sma-lock-card{width:min(100%,390px);padding:0;transform-style:preserve-3d;animation:smaFloat 4s ease-in-out infinite}
.sma-lock-inner{position:relative;padding:28px 24px 24px;text-align:center;z-index:1}
.sma-lock-icon{width:74px;height:74px;border-radius:24px;margin:0 auto 14px;display:grid;place-items:center;font-size:34px;background:linear-gradient(135deg,rgba(124,58,237,.95),rgba(6,182,212,.95));box-shadow:0 16px 35px rgba(124,58,237,.35), inset 0 1px 0 rgba(255,255,255,.25)}
.sma-lock-inner h3{margin:0 0 8px;font-size:28px;font-weight:900}
.sma-lock-inner p{margin:0 0 16px;color:var(--sma-sub);line-height:1.5}
.sma-lock-inner .sma-btn{width:100%}
.sma-orb{position:absolute;border-radius:50%;filter:blur(2px);opacity:.9;pointer-events:none}
.sma-orb-a{width:86px;height:86px;top:-18px;right:24px;background:radial-gradient(circle,rgba(34,197,94,.72),transparent 68%);animation:smaDrift 4.5s ease-in-out infinite}
.sma-orb-b{width:110px;height:110px;bottom:-14px;left:-18px;background:radial-gradient(circle,rgba(6,182,212,.48),transparent 70%);animation:smaDrift 5.2s ease-in-out infinite reverse}
body.sma-locked{overflow:hidden}
@keyframes smaPop{from{opacity:.0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
@keyframes smaFade{from{opacity:0}to{opacity:1}}
@keyframes smaFloat{0%,100%{transform:translateY(0) rotateX(0deg) rotateY(0deg)}50%{transform:translateY(-6px) rotateX(1.6deg) rotateY(-1.6deg)}}
@keyframes smaDrift{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(8px,-10px) scale(1.08)}}
@media (max-width:640px){
  .sma-grid,.sma-otp-row{grid-template-columns:1fr}
  .sma-card{padding:18px;border-radius:24px}
  .sma-tab,.sma-btn{width:100%}
  .sma-brand h2{font-size:26px}
  .sma-lock-card{width:min(100%,360px)}
}


.sma-video-bg{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none;z-index:0}
.sma-video-bg span{position:absolute;display:block;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.35),rgba(255,255,255,0) 68%);filter:blur(1px);opacity:.55;animation:smaParticle 12s linear infinite}
.sma-video-bg span:nth-child(1){width:180px;height:180px;left:-30px;top:8%;animation-duration:14s}
.sma-video-bg span:nth-child(2){width:240px;height:240px;right:-60px;top:12%;animation-duration:18s;animation-delay:-3s;background:radial-gradient(circle,rgba(34,197,94,.24),rgba(255,255,255,0) 70%)}
.sma-video-bg span:nth-child(3){width:160px;height:160px;left:12%;bottom:-20px;animation-duration:16s;animation-delay:-7s;background:radial-gradient(circle,rgba(6,182,212,.28),rgba(255,255,255,0) 72%)}
.sma-video-bg span:nth-child(4){width:120px;height:120px;right:18%;bottom:8%;animation-duration:11s;animation-delay:-2s}
.sma-video-bg span:nth-child(5){inset:auto -15% 22% -15%;height:120px;width:auto;border-radius:999px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);filter:blur(12px);animation:smaSweep 8s ease-in-out infinite}
.sma-card,.sma-lock-card{overflow:hidden}
.sma-card:before,.sma-lock-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.1),transparent 35%,transparent 65%,rgba(255,255,255,.08));pointer-events:none;z-index:0}
.sma-brand,.sma-tabs,.sma-panel,.sma-logged-box,.sma-lock-inner,.sma-alert{position:relative;z-index:1}
.sma-shine{position:absolute;inset:-30% auto auto -40%;width:52%;height:180%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.16),transparent);filter:blur(8px);animation:smaShine 6.5s ease-in-out infinite;pointer-events:none}
.sma-mini-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;margin-bottom:12px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.12);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#d8efff}
.sma-pin-shell{position:relative}
.sma-pin-shell input{font-size:28px;letter-spacing:10px;text-align:center;padding-left:24px!important;padding-right:24px!important}
.sma-pin-dots{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:180px;margin:12px auto 18px}
.sma-pin-dots span{height:10px;border-radius:999px;background:rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 8px 16px rgba(2,6,23,.18);transition:all .25s ease}
body.sma-has-1 #sma-global-lock .sma-pin-dots span:nth-child(-n+1),
body.sma-has-2 #sma-global-lock .sma-pin-dots span:nth-child(-n+2),
body.sma-has-3 #sma-global-lock .sma-pin-dots span:nth-child(-n+3),
body.sma-has-4 #sma-global-lock .sma-pin-dots span:nth-child(-n+4){background:linear-gradient(135deg,#22c55e,#06b6d4);transform:translateY(-2px);box-shadow:0 10px 20px rgba(6,182,212,.22)}
.sma-incorrect{animation:smaShake .28s linear 1}
@keyframes smaParticle{0%{transform:translate3d(0,0,0) scale(.92)}25%{transform:translate3d(28px,-18px,0) scale(1.02)}50%{transform:translate3d(-10px,-34px,0) scale(1.08)}75%{transform:translate3d(24px,10px,0) scale(1)}100%{transform:translate3d(0,0,0) scale(.92)}}
@keyframes smaSweep{0%,100%{transform:translateX(-8%) scaleX(1)}50%{transform:translateX(8%) scaleX(1.08)}}
@keyframes smaShine{0%{transform:translateX(-12%) rotate(18deg)}50%{transform:translateX(155%) rotate(18deg)}100%{transform:translateX(155%) rotate(18deg)}}
@keyframes smaShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-7px)}40%{transform:translateX(7px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}}

.sma-lock-actions{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.sma-text-link{display:inline-block;font-size:12px;font-weight:800;color:#c7dcff;text-decoration:none;opacity:.92}
.sma-text-link:hover{text-decoration:underline;opacity:1}
.sma-lock-forgot-panel{display:none;margin-top:10px;padding:14px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.08)}
.sma-lock-forgot-panel h4{margin:0 0 6px;font-size:15px}
.sma-lock-forgot-panel p{margin:0 0 12px;color:var(--sma-sub);font-size:13px}
.sma-stack{display:grid;grid-template-columns:1fr;gap:10px}
.sma-note-mini{margin-top:2px;font-size:11px;color:#9cb4d3}

.sma-global-forgot-panel{display:none;margin-top:12px;padding:14px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.08);text-align:left}
.sma-global-forgot-panel h4{margin:0 0 6px;font-size:15px}
.sma-global-forgot-panel p{margin:0 0 12px;color:var(--sma-sub);font-size:13px}
#sma-global-lock .sma-text-link{margin-top:10px;font-size:13px;color:#e6f2ff;text-decoration:underline;font-weight:900}
#sma-global-lock .sma-alert{margin-top:12px}


.sma-bio-box{margin:16px 0;padding:16px;border-radius:20px;background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.09)}
.sma-bio-box h4{margin:0 0 8px}
.sma-bio-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.sma-bio-actions .sma-btn{width:auto;min-width:180px}


.sma-bio-status{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;margin:0 0 14px;border-radius:999px;font-weight:700;font-size:14px;letter-spacing:.3px;background:rgba(16,185,129,.16);border:1px solid rgba(52,211,153,.32);color:#d1fae5;box-shadow:0 10px 30px rgba(16,185,129,.12) inset,0 8px 24px rgba(16,185,129,.08)}
