body.pp-auth-body {
    min-height: 100vh;
    min-height: 100svh;
    padding: 0;
    background: #0c0e13;
    color: #f4f5f7;
}

.pp-auth-screen {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 390px;
    min-height: 100vh;
    min-height: 100svh;
    margin: 0 auto;
    background: #13151c;
    border-inline: 1px solid rgba(255, 255, 255, .04);
}

.pp-auth-top {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: 44px 1fr 44px;
    align-items: center;
    height: 57px;
    padding: 0 8px;
    border-bottom: 1px solid rgba(255, 255, 255, .055);
}

.pp-auth-back {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    color: #e6e8ed;
}

.pp-auth-back svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.pp-auth-home { text-align: center; font-size: 16px; font-weight: 750; color: #fa4d87; }
.pp-auth-content { width: 100%; padding: 42px 26px 28px; }
.pp-auth-brand { display: flex; align-items: center; gap: 9px; color: #70d9d2; font-size: 11px; font-weight: 800; letter-spacing: 1px; }
.pp-auth-brand svg { width: 40px; height: 32px; fill: #fa4d87; }
.pp-auth-brand svg circle + circle { fill: #70d9d2; }
.pp-auth-content h1 { font-size: 26px; margin: 22px 0 5px; }
.pp-auth-subtitle { margin: 0 0 27px; color: #9298a8; font-size: 13px; }
.pp-auth-form { display: flex; flex-direction: column; gap: 9px; }
.pp-auth-form label { margin-top: 6px; color: #c9cbd3; font-size: 13px; }

.pp-auth-form input {
    height: 48px;
    width: 100%;
    min-width: 0;
    padding: 0 12px;
    border: 1px solid #343844;
    border-radius: 6px;
    background: #1b1e27;
    color: #f4f5f7;
    font: inherit;
    font-size: 16px;
    outline: none;
}

.pp-auth-form input:focus { border-color: #70d9d2; box-shadow: 0 0 0 2px rgba(112, 217, 210, .12); }
.pp-auth-form input::placeholder { color: #727887; }

.pp-auth-submit {
    height: 48px;
    margin-top: 7px;
    border: 0;
    border-radius: 6px;
    background: #fa4d87;
    color: #fff;
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}

.pp-auth-submit:disabled { opacity: .65; cursor: wait; }
.pp-auth-links { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 17px; color: #9ba1af; font-size: 13px; }
.pp-auth-links a { display: inline-flex; align-items: center; min-height: 44px; color: #70d9d2; }
.pp-auth-links-center { justify-content: center; gap: 6px; }
.pp-auth-message { min-height: 20px; margin: 2px 0 0; color: #ff8aaa; font-size: 12px; overflow-wrap: anywhere; }
.pp-auth-captcha, .pp-auth-code { display: flex; align-items: center; gap: 8px; }
.pp-auth-captcha input, .pp-auth-code input { flex: 1; }
.pp-auth-captcha-button { flex: 0 0 106px; width: 106px; height: 48px; padding: 0; border: 0; border-radius: 4px; overflow: hidden; background: #252936; cursor: pointer; }
.pp-auth-captcha img { width: 100%; height: 100%; object-fit: cover; }
.pp-auth-code button { flex: 0 0 108px; width: 108px; height: 48px; padding: 0 4px; border: 0; background: none; color: #70d9d2; font: inherit; font-size: 12px; white-space: nowrap; cursor: pointer; }
.pp-auth-code button:disabled { color: #727887; cursor: default; }
.pp-auth-foot { margin-top: auto; padding: 20px 10px calc(20px + env(safe-area-inset-bottom)); text-align: center; color: #646a78; font-size: 11px; }
.pp-auth-screen a:focus-visible, .pp-auth-screen button:focus-visible { outline: 2px solid #70d9d2; outline-offset: 3px; }
.pp-auth-recovery-links { display: grid; gap: 4px; margin-top: 12px; }
.pp-auth-recovery-links a { display: flex; min-height: 42px; align-items: center; color: #70d9d2; font-size: 13px; }
.pp-auth-hidden { display: none !important; }
