/* LEBSATI — account pop-up · katana motion */
html.ap-lock{overflow:hidden}
#lebsati-auth{--ap-ink:#14253f;--ap-steel:#30383e;--ap-muted:#5f6672;--ap-line:#d8dce3;--ap-soft:#f3f4f6;--ap-accent:#c27a45;--ap-err:#a8241a;
  position:fixed;inset:0;box-sizing:border-box;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:16px;border:0;background:transparent;
  display:grid;place-items:center;overflow:hidden;color:var(--ap-ink);font-family:Alexandria,"Open Sans",Tahoma,sans-serif;text-align:start;outline:0}
#lebsati-auth:not([open]){display:none}
#lebsati-auth::backdrop{background:rgba(10,18,32,.46);backdrop-filter:blur(14px) saturate(115%);-webkit-backdrop-filter:blur(14px) saturate(115%);animation:ap-fade .38s ease backwards}
#lebsati-auth.is-closing::backdrop{animation:ap-fade-out .34s ease .12s forwards}
#lebsati-auth *,#lebsati-auth *::before,#lebsati-auth *::after{box-sizing:border-box}
#lebsati-auth svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* blades */
#lebsati-auth .ap-blade{position:fixed;left:50%;top:50%;width:170vmax;height:2px;margin:-1px 0 0 -85vmax;pointer-events:none;z-index:3;opacity:0;transform-origin:50% 50%;
  background:linear-gradient(90deg,transparent 0,rgba(255,255,255,.15) 20%,#fff 48%,#fff 52%,rgba(255,255,255,.15) 80%,transparent 100%);
  box-shadow:0 0 14px 2px rgba(255,255,255,.85),0 0 46px 6px rgba(194,122,69,.45)}
#lebsati-auth .ap-blade-2{height:1px;box-shadow:0 0 10px 1px rgba(255,255,255,.7),0 0 30px 4px rgba(20,37,63,.35)}

/* card */
#lebsati-auth .ap-card{position:relative;z-index:2;width:min(440px,100%);max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;padding:28px 28px 24px;
  border-radius:16px;background:#fff;box-shadow:0 34px 100px rgba(8,15,28,.38),0 0 0 1px rgba(20,37,63,.06);scrollbar-width:thin}
#lebsati-auth .ap-mark{position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(118deg,transparent 71%,rgba(194,122,69,.10) 71.15%,rgba(194,122,69,.02) 72.5%,transparent 72.6%),linear-gradient(118deg,transparent 74.2%,rgba(20,37,63,.05) 74.3%,transparent 74.9%)}
[dir=rtl] #lebsati-auth .ap-mark{transform:scaleX(-1)}
#lebsati-auth .ap-cut{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:inherit;z-index:3}
#lebsati-auth .ap-cut i{position:absolute;left:-20%;top:50%;width:140%;height:2px;opacity:0;background:linear-gradient(90deg,transparent,var(--ap-accent) 30%,#fff 50%,var(--ap-accent) 70%,transparent);box-shadow:0 0 12px rgba(194,122,69,.7)}
#lebsati-auth .ap-close{position:absolute;top:14px;inset-inline-end:14px;z-index:4;display:grid;place-items:center;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:var(--ap-soft);color:var(--ap-ink);cursor:pointer;transition:transform .35s cubic-bezier(.75,0,.15,1),background .2s}
#lebsati-auth .ap-close:hover{transform:rotate(90deg);background:#e7e9ed}
#lebsati-auth .ap-brand{display:inline-flex;align-items:center;gap:4px;margin:4px 0 20px;font-size:12px;font-weight:600;letter-spacing:.3em;color:var(--ap-ink)}
#lebsati-auth .ap-brand span{width:5px;height:5px;border-radius:50%;background:var(--ap-accent)}
#lebsati-auth .ap-stage{position:relative}

/* typography */
#lebsati-auth h2{margin:0 0 6px;font-size:22px;font-weight:600;line-height:1.45;letter-spacing:0;color:var(--ap-ink)}
#lebsati-auth .ap-note{margin:0 0 18px;font-size:13px;line-height:1.9;color:var(--ap-muted)}
#lebsati-auth .ap-strong{color:var(--ap-ink);font-weight:600;word-break:break-all}
#lebsati-auth .ap-eyebrow{margin:0 0 2px;font-size:11px;letter-spacing:.16em;color:var(--ap-accent)}

/* tabs */
#lebsati-auth .ap-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:0 0 22px;padding:4px;border-radius:11px;background:var(--ap-soft)}
#lebsati-auth .ap-tabs button{position:relative;padding:10px 8px;border:0;border-radius:8px;background:transparent;color:var(--ap-muted);font:inherit;font-size:13px;cursor:pointer;transition:color .2s,background .2s}
#lebsati-auth .ap-tabs button[aria-selected=true]{background:#fff;color:var(--ap-ink);font-weight:600;box-shadow:0 1px 3px rgba(20,37,63,.14)}
#lebsati-auth .ap-tabs button[aria-selected=true]::after{content:"";position:absolute;inset-inline:22%;bottom:5px;height:2px;border-radius:2px;background:var(--ap-accent);transform-origin:var(--ap-o,0 50%);animation:ap-ink .45s cubic-bezier(.75,0,.15,1) both}
[dir=rtl] #lebsati-auth .ap-tabs button[aria-selected=true]::after{--ap-o:100% 50%}

/* fields */
#lebsati-auth .ap-field{display:block;margin:0 0 12px}
#lebsati-auth .ap-field>span{display:block;margin:0 0 6px;font-size:12px;color:var(--ap-steel)}
#lebsati-auth .ap-field input{display:block;width:100%;height:50px;margin:0;padding:12px 14px;border:1px solid var(--ap-line);border-radius:9px;background:#fff;color:var(--ap-ink);font:inherit;font-size:16px;box-shadow:none;transition:border-color .2s,box-shadow .2s}
#lebsati-auth .ap-field input[dir=ltr]{text-align:left}
#lebsati-auth .ap-field input::placeholder{color:#a3a9b3}
#lebsati-auth .ap-field input:focus{outline:0;border-color:var(--ap-ink);box-shadow:0 0 0 3px rgba(20,37,63,.10)}
#lebsati-auth input[aria-invalid=true]{border-color:var(--ap-err)!important;box-shadow:0 0 0 3px rgba(168,36,26,.10)!important}

/* buttons */
#lebsati-auth .ap-primary{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:50px;margin:6px 0 0;padding:12px 18px;overflow:hidden;border:0;border-radius:9px;background:var(--ap-ink);color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s,transform .15s}
#lebsati-auth .ap-primary:hover{background:#0b1729}
#lebsati-auth .ap-primary:active{transform:scale(.99)}
#lebsati-auth .ap-primary:disabled{cursor:default}
#lebsati-auth .ap-gleam{position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.32) 50%,transparent 62%);transform:translateX(-130%)}
#lebsati-auth .ap-primary:hover .ap-gleam{animation:ap-gleam .75s cubic-bezier(.75,0,.15,1)}
#lebsati-auth .ap-primary[aria-busy=true]>span,#lebsati-auth .ap-primary[aria-busy=true]>svg{opacity:0}
#lebsati-auth .ap-primary[aria-busy=true]::after{content:"";position:absolute;inset:0;margin:auto;width:24px;height:2px;border-radius:2px;background:#fff;box-shadow:0 0 8px rgba(255,255,255,.8);animation:ap-spin .65s cubic-bezier(.6,0,.3,1) infinite}
#lebsati-auth .ap-ghost{display:block;width:100%;min-height:46px;margin:10px 0 0;border:1px solid var(--ap-line);border-radius:9px;background:#fff;color:var(--ap-steel);font:inherit;font-size:13px;cursor:pointer;transition:border-color .2s,color .2s}
#lebsati-auth .ap-ghost:hover{border-color:var(--ap-err);color:var(--ap-err)}
#lebsati-auth .ap-ghost[aria-busy=true]{opacity:.55}
#lebsati-auth .ap-link{display:inline-block;margin:14px 0 0;padding:4px 0;border:0;background:none;color:var(--ap-steel);font:inherit;font-size:12.5px;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(48,56,62,.35);cursor:pointer}
#lebsati-auth .ap-link:hover{color:var(--ap-ink);text-decoration-color:var(--ap-accent)}
#lebsati-auth .ap-link:disabled{color:#9aa0a9;text-decoration:none;cursor:default}
#lebsati-auth .ap-back{display:inline-flex;align-items:center;gap:6px;margin:0 0 12px;padding:6px 0;border:0;background:none;color:var(--ap-muted);font:inherit;font-size:12.5px;cursor:pointer}
#lebsati-auth .ap-back svg{transform:scaleX(-1)}
#lebsati-auth .ap-back:hover{color:var(--ap-ink)}
#lebsati-auth .ap-row{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
#lebsati-auth .ap-feedback{margin:4px 0 8px;padding:10px 12px;border-radius:9px;background:#fdf0ee;color:var(--ap-err);font-size:12.5px;line-height:1.75}
#lebsati-auth .ap-feedback.is-ok{background:#edf7f0;color:#1c6a37}
#lebsati-auth .ap-fine{margin:16px 0 0;font-size:11px;line-height:1.8;color:#8a919b}
#lebsati-auth .ap-fine a{color:inherit;text-decoration:underline;text-underline-offset:3px}
#lebsati-auth .ap-perk{display:flex;align-items:center;gap:12px;margin:16px 0 0;padding:12px 14px;border-radius:11px;background:#fbf5ef;font-size:12px;line-height:1.75;color:var(--ap-steel)}
#lebsati-auth .ap-perk b{flex:none;font-size:17px;color:var(--ap-accent)}

/* code */
#lebsati-auth .ap-otp{position:relative;margin:2px 0 10px;direction:ltr}
#lebsati-auth .ap-otp input{position:absolute;inset:0;z-index:2;width:100%;height:100%;margin:0;padding:0;border:0;opacity:0;font-size:16px;color:transparent;caret-color:transparent;cursor:text}
#lebsati-auth .ap-cells{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
#lebsati-auth .ap-cells span{display:grid;place-items:center;height:58px;border:1px solid var(--ap-line);border-radius:10px;background:#fff;font-size:23px;font-weight:600;color:var(--ap-ink);font-variant-numeric:tabular-nums;transition:border-color .15s,box-shadow .15s}
#lebsati-auth .ap-otp.is-focus .ap-cells span.is-active{border-color:var(--ap-ink);box-shadow:0 0 0 3px rgba(20,37,63,.10)}
#lebsati-auth .ap-otp.is-focus .ap-cells span.is-active:empty::after{content:"";width:2px;height:24px;background:var(--ap-ink);animation:ap-caret 1s steps(1) infinite}
#lebsati-auth .ap-cells span.is-filled{animation:ap-pop .2s ease}

/* account */
#lebsati-auth .ap-me{display:flex;align-items:center;gap:14px;margin:0 0 18px}
#lebsati-auth .ap-me h2{margin:0;font-size:20px}
#lebsati-auth .ap-avatar{display:grid;place-items:center;flex:none;width:56px;height:56px;border-radius:50%;background:var(--ap-ink);color:#fff;font-size:21px;font-weight:600;box-shadow:0 0 0 4px #fff,0 0 0 5px rgba(194,122,69,.5)}
#lebsati-auth .ap-mail{display:block;font-size:12.5px;color:var(--ap-muted);word-break:break-all}
#lebsati-auth .ap-menu{display:grid;gap:8px;margin:16px 0 12px}
#lebsati-auth .ap-menu a,#lebsati-auth .ap-menu button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:14px 16px;border:1px solid var(--ap-line);border-radius:11px;background:#fff;color:var(--ap-ink);font:inherit;font-size:14px;text-decoration:none;cursor:pointer;transition:border-color .2s,transform .2s}
#lebsati-auth .ap-menu a:hover,#lebsati-auth .ap-menu button:hover{border-color:var(--ap-ink);transform:translateX(3px)}
[dir=rtl] #lebsati-auth .ap-menu a:hover,[dir=rtl] #lebsati-auth .ap-menu button:hover{transform:translateX(-3px)}

/* help */
#lebsati-auth .ap-help{display:grid;gap:9px;margin:0 0 18px;padding:0;list-style:none}
#lebsati-auth .ap-help li{padding:12px 14px;border-radius:11px;background:#f6f7f9;border-inline-start:3px solid var(--ap-accent);font-size:12.5px;line-height:1.8;color:var(--ap-muted)}
#lebsati-auth .ap-help b{display:block;font-size:13px;color:var(--ap-ink)}

/* done */
#lebsati-auth .ap-done{padding:12px 0 6px;text-align:center}
#lebsati-auth .ap-done svg{width:118px;height:118px;margin:0 auto 10px;display:block;stroke-width:2.2}
#lebsati-auth .ap-done .s1,#lebsati-auth .ap-done .s2{stroke:var(--ap-accent);stroke-width:2;stroke-dasharray:110;stroke-dashoffset:110;animation:ap-draw .32s cubic-bezier(.75,0,.15,1) forwards,ap-vanish .4s ease .55s forwards}
#lebsati-auth .ap-done .s2{animation-delay:.16s,.6s}
#lebsati-auth .ap-done .ring{stroke:var(--ap-ink);stroke-dasharray:214;stroke-dashoffset:214;animation:ap-draw .55s cubic-bezier(.75,0,.15,1) .45s forwards}
#lebsati-auth .ap-done .tick{stroke:var(--ap-ink);stroke-width:3;stroke-dasharray:50;stroke-dashoffset:50;animation:ap-draw .35s ease .85s forwards}
#lebsati-auth .ap-done .ap-note{margin:0}

/* loading */
#lebsati-auth .ap-loading{display:grid;place-items:center;min-height:200px}
#lebsati-auth .ap-loading i{width:46px;height:2px;border-radius:2px;background:var(--ap-ink);box-shadow:0 0 10px rgba(194,122,69,.6);animation:ap-spin .7s cubic-bezier(.6,0,.3,1) infinite}

/* content entrance */
#lebsati-auth .ap-enter>*{animation:ap-rise .5s cubic-bezier(.2,.75,.2,1) backwards}
#lebsati-auth .ap-enter>*:nth-child(2){animation-delay:.04s}#lebsati-auth .ap-enter>*:nth-child(3){animation-delay:.08s}
#lebsati-auth .ap-enter>*:nth-child(4){animation-delay:.12s}#lebsati-auth .ap-enter>*:nth-child(5){animation-delay:.16s}
#lebsati-auth .ap-enter>*:nth-child(n+6){animation-delay:.2s}

#lebsati-auth :focus-visible{outline:2px solid var(--ap-ink);outline-offset:3px}
#lebsati-auth [hidden]{display:none!important}

@keyframes ap-fade{from{opacity:0}to{opacity:1}}
@keyframes ap-fade-out{from{opacity:1}to{opacity:0}}
@keyframes ap-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes ap-ink{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes ap-gleam{to{transform:translateX(130%)}}
@keyframes ap-spin{0%{transform:rotate(0) scaleX(.5)}50%{transform:rotate(180deg) scaleX(1)}100%{transform:rotate(360deg) scaleX(.5)}}
@keyframes ap-pop{50%{transform:scale(1.08)}}
@keyframes ap-caret{50%{opacity:0}}
@keyframes ap-draw{to{stroke-dashoffset:0}}
@keyframes ap-vanish{to{opacity:0}}

@media (max-width:520px){
  #lebsati-auth{padding:12px}
  #lebsati-auth .ap-card{padding:24px 18px 20px;border-radius:16px;max-height:calc(100dvh - 24px)}
  #lebsati-auth h2{font-size:20px}
  #lebsati-auth .ap-cells{gap:6px}
  #lebsati-auth .ap-cells span{height:52px;font-size:21px}
}
@media (prefers-reduced-motion:reduce){
  #lebsati-auth *,#lebsati-auth::backdrop{animation:none!important;transition:none!important}
  #lebsati-auth .ap-done .s1,#lebsati-auth .ap-done .s2{display:none}
  #lebsati-auth .ap-done .ring,#lebsati-auth .ap-done .tick{stroke-dashoffset:0}
}