.ssf-auth-wrap,
.ssf-auth-wrap *,
.ssf-auth-wrap *::before,
.ssf-auth-wrap *::after {
    box-sizing: border-box;
}

.ssf-auth-wrap {
    --ssf-accent: #05c6c1;
    --ssf-accent-dark: #049a97;
    --ssf-bg: #eef6f6;
    --ssf-card: #ffffff;
    --ssf-text: #0f172a;
    --ssf-soft: #64748b;
    --ssf-border: rgba(15, 23, 42, 0.08);
    font-family: "DM Sans", sans-serif;
    background:
        radial-gradient(circle at top right, rgba(5, 198, 193, 0.12), transparent 32%),
        linear-gradient(180deg, #f7fbfb 0%, var(--ssf-bg) 100%);
    padding: clamp(24px, 4vw, 56px) 16px;
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.ssf-auth-wrap::before,
.ssf-auth-wrap::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
    z-index: -1;
}

.ssf-auth-wrap::before {
    width: 420px;
    height: 420px;
    top: -180px;
    left: -120px;
    background: radial-gradient(circle, rgba(88, 200, 255, 0.22) 0%, rgba(88, 200, 255, 0) 72%);
}

.ssf-auth-wrap::after {
    width: 520px;
    height: 520px;
    right: -220px;
    bottom: -260px;
    background: radial-gradient(circle, rgba(22, 88, 209, 0.16) 0%, rgba(22, 88, 209, 0) 74%);
}