:root {
    color-scheme: light dark;
    --grp-bg: #f5f7fa;
    --grp-surface: #ffffff;
    --grp-text: #1f252e;
    --grp-muted: #5d6774;
    --grp-border: #d8dde6;
    --grp-accent: #8bc53e;
    --grp-accent-strong: #6aa12a;
    --grp-radius: 12px;
}

@media (prefers-color-scheme: dark) {
    :root {
        --grp-bg: #10161d;
        --grp-surface: #17202a;
        --grp-text: #e8eef5;
        --grp-muted: #b8c4d1;
        --grp-border: #2f3a47;
        --grp-accent: #9fd44e;
        --grp-accent-strong: #b0df68;
    }
}

html[data-theme="light"] {
    --grp-bg: #f5f7fa;
    --grp-surface: #ffffff;
    --grp-text: #1f252e;
    --grp-muted: #5d6774;
    --grp-border: #d8dde6;
    --grp-accent: #8bc53e;
    --grp-accent-strong: #6aa12a;
}

html[data-theme="dark"] {
    --grp-bg: #10161d;
    --grp-surface: #17202a;
    --grp-text: #e8eef5;
    --grp-muted: #b8c4d1;
    --grp-border: #2f3a47;
    --grp-accent: #9fd44e;
    --grp-accent-strong: #b0df68;
}

body {
    background: var(--grp-bg);
    color: var(--grp-text);
}

a {
    color: var(--grp-accent-strong);
}

img,
video {
    max-width: 100%;
    height: auto;
}

input,
select,
textarea,
button {
    font: inherit;
}

@media screen and (max-width: 768px) {
    .m-rb-container,
    .rb-subscription,
    .rb-form-container {
        width: 100% !important;
        box-sizing: border-box;
    }
}