.premium-landing {
    font-family: var(--font-ui);
    letter-spacing: -0.012em;
}

.premium-landing .px-display,
.premium-landing .px-h2,
.premium-landing .px-login-head h2,
.premium-landing .px-news-featured h3,
.premium-landing .px-news-item h3,
.premium-landing .px-bento-item h3,
.premium-landing .px-brand-text strong {
    font-family: var(--font-display);
    letter-spacing: -0.015em;
}

.premium-landing .px-login {
    padding: 30px;
    border-color: rgba(125, 151, 202, .22);
    background:
        radial-gradient(circle at 92% 12%, rgba(62, 207, 239, .13), transparent 27%),
        linear-gradient(155deg, rgba(21, 31, 49, .97), rgba(8, 13, 24, .96));
}

.premium-landing .px-login-head h2 {
    font-size: 1.7rem;
    line-height: .95;
}

.premium-landing .px-login-head p {
    margin-top: 5px;
    font-size: .78rem;
}

.px-login-identity {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 94px;
    gap: 14px;
    align-items: start;
}

.px-login-identity:has(.px-login-avatar[hidden]) {
    grid-template-columns: minmax(0, 1fr);
}

.px-user-field { min-width: 0; }
.px-user-input-wrap { position: relative; }
.px-user-prefix {
    position: absolute;
    left: 15px;
    top: 50%;
    z-index: 2;
    transform: translateY(-50%);
    color: var(--brand-cyan);
    font-family: var(--font-mono);
    font-size: .86rem;
    font-weight: 700;
    pointer-events: none;
}

.px-user-input-wrap #login-username { padding-left: 37px; }

.px-user-status {
    min-height: 18px;
    margin: 7px 2px 0;
    color: var(--text-muted);
    font-size: .68rem;
    line-height: 1.35;
    transition: color .18s ease;
}

.px-user-status.is-found { color: var(--success); }

.px-login-avatar[hidden] { display: none !important; }
.px-login-avatar {
    min-width: 0;
    animation: px-avatar-arrive .28s var(--ease-out) both;
}

.px-login-avatar-stage {
    position: relative;
    height: 84px;
    overflow: hidden;
    border: 1px solid rgba(126, 229, 255, .46);
    border-radius: 17px;
    background:
        linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px),
        radial-gradient(circle at 50% 42%, rgba(62,207,239,.24), transparent 48%),
        #111c2e;
    background-size: 14px 14px, 14px 14px, auto, auto;
    box-shadow: 0 12px 25px rgba(0, 0, 0, .32), inset 0 1px rgba(255,255,255,.08);
}

.px-login-avatar-stage::after {
    content: "";
    position: absolute;
    inset: auto 9px 6px;
    height: 10px;
    border-radius: 50%;
    background: rgba(0,0,0,.28);
    filter: blur(5px);
}

.px-login-avatar-stage img {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 106px;
    object-fit: contain;
    object-position: center 4px;
    filter: drop-shadow(0 7px 9px rgba(0,0,0,.3));
}

.px-login-avatar > strong {
    display: block;
    margin-top: 6px;
    overflow: hidden;
    color: #dffaff;
    font-family: var(--font-display);
    font-size: .86rem;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.premium-landing .px-field label {
    font-size: .69rem;
    letter-spacing: .11em;
}

.premium-landing .px-field input[type="text"],
.premium-landing .px-field input[type="password"] {
    font-family: var(--font-ui);
    font-size: .91rem;
    font-weight: 600;
}

.premium-landing .px-login .px-btn {
    font-family: var(--font-display);
    font-size: 1.17rem;
    letter-spacing: .025em;
}

@keyframes px-avatar-arrive {
    from { opacity: 0; transform: translateX(10px) scale(.94); }
    to { opacity: 1; transform: translateX(0) scale(1); }
}

@media (max-width: 420px) {
    .premium-landing .px-login { padding: 23px; }
    .px-login-identity { grid-template-columns: minmax(0, 1fr) 78px; gap: 10px; }
    .px-login-avatar-stage { height: 78px; }
}