/* Player login only; authenticated storefront keeps its existing layout. */
.player-mall-login, .player-mall-login * { box-sizing: border-box; }
.player-mall-login {
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    min-height: 100svh;
    overflow: hidden;
    display: flex;
    align-items: center;
    flex-direction: column;
    padding: clamp(72px, 17.5vh, 144px) 27px 80px;
    color: #f5f6ff;
    background:
        radial-gradient(ellipse at 22% 9%, #303d99a6 0%, transparent 43%),
        radial-gradient(ellipse at 91% 34%, #27888e75 0%, transparent 35%),
        radial-gradient(ellipse at 71% 96%, #6636bb69 0%, transparent 49%), #0b101e;
    font-family: "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}
.player-mall-login::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    background-image: linear-gradient(#ccd8ff03 1px, transparent 1px), linear-gradient(90deg, #ccd8ff03 1px, transparent 1px);
    background-size: 38px 38px;
    mask-image: linear-gradient(transparent, #000 17%, #000 52%, transparent 83%);
    pointer-events: none;
}
.player-mall-heading { text-align: center; width: 100%; }
.player-mall-emblem {
    width: 80px;
    height: 80px;
    display: grid;
    place-items: center;
    margin: 0 auto;
    border-radius: 23px;
    border: 1px solid #c4ccff47;
    background: linear-gradient(135deg, #6380ff, #7540fa);
    box-shadow: 0 12px 35px #5162fd40, inset 0 1px 1px #ffffff30;
}
.player-mall-emblem svg { width: 39px; height: 39px; color: #fff; }
.player-mall-heading h1 { margin: 21px 0 9px; font-size: 27px; font-weight: 650; letter-spacing: 6px; padding-left: 6px; line-height: 1.5; }
.player-mall-heading p { margin: 0; color: #949ab0; font-size: 14px; letter-spacing: 1.5px; line-height: 1.7; }
.player-mall-form {
    width: 100%;
    max-width: 374px;
    margin-top: 38px;
    padding: 27px 23px 22px;
    border: 1px solid #ffffff21;
    border-radius: 25px;
    background: linear-gradient(135deg, #ffffff09, #b2aaff11);
    box-shadow: inset 0 1px 0 #ffffff06, 0 16px 40px #0507111a;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}
.player-mall-field + .player-mall-field { margin-top: 17px; }
.player-mall-field label { display: block; font-size: 13px; line-height: 1.6; color: #b4b6c9; margin: 0 3px 8px; letter-spacing: 1px; }
.player-mall-input { display: flex; align-items: center; height: 50px; border: 1px solid #ffffff17; border-radius: 15px; padding: 0 15px; background: #cdd4f308; box-shadow: inset 0 1px 2px #ffffff04; transition: border-color .18s, box-shadow .18s; }
.player-mall-input:focus-within { border-color: #8d86ff; box-shadow: 0 0 0 3px #8d86ff19; }
.player-mall-input > svg { flex: 0 0 19px; width: 19px; height: 19px; color: #9394ae; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.player-mall-input input { width: 100%; min-width: 0; padding: 12px 0 12px 12px; border: 0; outline: none; background: transparent; color: #f4f3ff; font: inherit; font-size: 16px; line-height: 24px; }
.player-mall-input input::placeholder { color: #9396ad; opacity: .8; letter-spacing: 1px; }
.player-mall-input input:-webkit-autofill { -webkit-text-fill-color: #f4f3ff; box-shadow: 0 0 0 100px #293046 inset; border-radius: 8px; }
.player-mall-eye { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 40px; margin-right: -8px; padding: 6px; border: 0; background: transparent; color: #a6a3ba; cursor: pointer; }
.player-mall-eye svg { width: 20px; height: 20px; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.player-mall-submit { width: 100%; height: 52px; margin-top: 17px; padding: 0 15px; border: 1px solid #beb2ff1c; border-radius: 15px; color: #fff; background: linear-gradient(110deg, #597cfb, #7540f8); font: inherit; font-size: 18px; font-weight: 650; letter-spacing: 6px; cursor: pointer; box-shadow: 0 10px 23px #6b4dfb40; transition: filter .2s; }
.player-mall-submit:hover { filter: brightness(1.09); }
.player-mall-submit:disabled { cursor: wait; opacity: .65; letter-spacing: 1px; }
.player-mall-register { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 5px; margin: 22px 0 0; color: #9998af; font-size: 13px; line-height: 24px; }
.player-mall-register button { background: none; border: 0; padding: 3px 0; color: #b5b7fc; font: inherit; font-weight: 600; cursor: pointer; }
.player-mall-login button:focus-visible { outline: 2px solid #c4bdff; outline-offset: 4px; }
@media (max-width: 360px) {
    .player-mall-login { padding-right: 20px; padding-left: 20px; }
    .player-mall-form { padding-right: 18px; padding-left: 18px; }
}
@media (prefers-reduced-motion: reduce) { .player-mall-login * { transition: none !important; } }