:root {
    --green: #28a745;
    --blue1: #45c1ff;
    --blue2: #0a2463;
    --blue3: #eef8f7;
    --red: #dc3545;
    --grey1: rgba(107, 107, 107, 0.2);
    --grey2: #f4f4f4;
    --surface-light: #f5faff;
    --surface-muted: #eaeef3;
    --surface-active: #e9e9f5;
    --white: #ffffff;
    --muted-text: #6e7881;
}

.bg-green {
    background-color: var(--green);
}

.bg-blue1 {
    background-color: var(--blue1);
}

.bg-blue2 {
    background-color: var(--blue2);
}

.bg-blue3 {
    background-color: var(--blue3);
}

.bg-red {
    background-color: var(--red);
}

.bg-grey1 {
    background-color: var(--grey1);
}

.bg-grey2 {
    background-color: var(--grey2);
}

.bg-surface-light {
    background-color: var(--surface-light);
}

.bg-surface-muted {
    background-color: var(--surface-muted);
}

.bg-white {
    background-color: var(--white);
}

.has-text-blue1 {
    color: var(--blue1);
}

.has-text-blue2 {
    color: var(--blue2);
}

.has-text-muted-text {
    color: var(--muted-text);
}