:root {
    --people-sky-1: #eaf8ff;
    --people-sky-2: #c9edff;
    --people-sky-3: #78cbfa;
    --people-blue: #168fe0;
    --people-blue-deep: #0870bc;
    --people-ink: #163047;
}

html,
body,
#root {
    min-height: 100%;
}

body {
    color: var(--people-ink);
    background:
        radial-gradient(circle at 16% 16%, rgba(255, 255, 255, .96) 0 5.5rem, transparent 5.7rem),
        radial-gradient(circle at 85% 22%, rgba(255, 255, 255, .78) 0 7rem, transparent 7.2rem),
        linear-gradient(155deg, var(--people-sky-1) 0%, var(--people-sky-2) 48%, #f7fcff 100%) !important;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Microsoft YaHei", sans-serif !important;
}

body::before,
body::after {
    content: "";
    position: fixed;
    z-index: 0;
    pointer-events: none;
    border-radius: 999px;
    background: rgba(255, 255, 255, .86);
    filter: blur(.2px);
    box-shadow: 4.5rem 1rem 0 -1.2rem rgba(255,255,255,.8), 9rem -.2rem 0 -2rem rgba(255,255,255,.72);
}

body::before {
    width: 10rem;
    height: 3.4rem;
    left: 5vw;
    bottom: 10vh;
}

body::after {
    width: 12rem;
    height: 4rem;
    right: 8vw;
    top: 9vh;
    opacity: .68;
}

#root {
    position: relative;
    z-index: 1;
}

button,
[role="button"],
input,
textarea {
    font: inherit !important;
}

button,
[role="button"] {
    border-radius: 12px !important;
}

input,
textarea {
    border-radius: 12px !important;
}

.people-cloud-desktop-logo {
    display: block;
    width: 58px !important;
    height: 58px !important;
    margin: 0 auto 12px;
    border: 1px solid rgba(255, 255, 255, .84);
    border-radius: 18px;
    object-fit: cover;
    box-shadow: 0 10px 30px rgba(8, 112, 188, .22);
}

.people-cloud-login-heading {
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    margin-bottom: 10px;
}

button[class*="primary"],
[class*="primary"] button,
[class*="submit"],
[class*="login"] button {
    border-color: transparent !important;
    color: #fff !important;
    background: linear-gradient(135deg, var(--people-sky-3), var(--people-blue)) !important;
    box-shadow: 0 10px 28px rgba(16, 133, 207, .24) !important;
}

[class*="login"],
[class*="Login"] {
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

[class*="login"] > div,
[class*="Login"] > div {
    border-color: rgba(255, 255, 255, .68) !important;
}

* {
    scrollbar-color: rgba(22, 143, 224, .36) transparent;
}

*::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

*::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background: rgba(22, 143, 224, .36);
    background-clip: padding-box;
}