:root {
    --cbmg-theme-primary: #1C3440;
    --cbmg-theme-secondary: #A65A3A;
    --cbmg-theme-secondary-hover: #8E4C31;
    --cbmg-theme-accent: #5A6F63;
    --cbmg-theme-text: #2B2B2B;
    --cbmg-theme-muted: #6B6B6B;
    --cbmg-theme-bg: #F4F2EE;
    --cbmg-theme-surface: #FAFAF8;
    --cbmg-theme-border: #E2DFD8;
    --cbmg-theme-night-bg: #11181C;
    --cbmg-theme-night-surface: #172126;
    --cbmg-theme-night-text: #F4F2EE;
    --cbmg-theme-night-muted: #D8D4CC;
    --cbmg-theme-radius: 8px;
    --cbmg-theme-container: 1320px;
    --cbmg-theme-shadow: 0 8px 20px rgba(0,0,0,.08);
    --cbmg-theme-shadow-hover: 0 12px 28px rgba(0,0,0,.10);
    --cbmg-theme-transition: 200ms ease;
}

html[data-cbmg-mode="night"],
body.cbmg-night-mode {
    --cbmg-theme-text: var(--cbmg-theme-night-text);
    --cbmg-theme-muted: var(--cbmg-theme-night-muted);
    --cbmg-theme-bg: var(--cbmg-theme-night-bg);
    --cbmg-theme-surface: var(--cbmg-theme-night-surface);
    --cbmg-theme-border: rgba(244, 242, 238, .18);
}

body {
    background: var(--cbmg-theme-bg);
    color: var(--cbmg-theme-text);
    transition: background-color .2s ease, color .2s ease;
}

body.cbmg-theme a {
    color: var(--cbmg-theme-secondary);
    transition: color var(--cbmg-theme-transition), transform var(--cbmg-theme-transition), box-shadow var(--cbmg-theme-transition);
}

body.cbmg-theme a:hover,
body.cbmg-theme a:focus {
    color: var(--cbmg-theme-primary);
}

html[data-cbmg-mode="night"] body.cbmg-theme a,
body.cbmg-theme.cbmg-night-mode a {
    color: var(--cbmg-theme-bg);
}

html[data-cbmg-mode="night"] body.cbmg-theme a:hover,
html[data-cbmg-mode="night"] body.cbmg-theme a:focus,
body.cbmg-theme.cbmg-night-mode a:hover,
body.cbmg-theme.cbmg-night-mode a:focus {
    color: #FFFFFF;
}

body.cbmg-theme h1,
body.cbmg-theme h2,
body.cbmg-theme h3,
body.cbmg-theme h4,
body.cbmg-theme h5,
body.cbmg-theme h6 {
    color: var(--cbmg-theme-primary);
    font-weight: 600;
    transition: color .2s ease;
}
body.cbmg-theme h1:hover,
body.cbmg-theme h2:hover,
body.cbmg-theme h3:hover,
body.cbmg-theme h4:hover,
body.cbmg-theme h5:hover,
body.cbmg-theme h6:hover {
    color: var(--cbmg-theme-secondary);
}

html[data-cbmg-mode="night"] body.cbmg-theme h1,
html[data-cbmg-mode="night"] body.cbmg-theme h2,
html[data-cbmg-mode="night"] body.cbmg-theme h3,
html[data-cbmg-mode="night"] body.cbmg-theme h4,
html[data-cbmg-mode="night"] body.cbmg-theme h5,
html[data-cbmg-mode="night"] body.cbmg-theme h6,
body.cbmg-theme.cbmg-night-mode h1,
body.cbmg-theme.cbmg-night-mode h2,
body.cbmg-theme.cbmg-night-mode h3,
body.cbmg-theme.cbmg-night-mode h4,
body.cbmg-theme.cbmg-night-mode h5,
body.cbmg-theme.cbmg-night-mode h6 {
    color: var(--cbmg-theme-bg);
}

.cbmg-theme-skip-link { position: absolute; left: -999px; top: auto; }
.cbmg-theme-skip-link:focus { left: 16px; top: 16px; z-index: 9999; background: var(--cbmg-theme-primary); color: #fff; padding: 10px 14px; border-radius: var(--cbmg-theme-radius); }
.cbmg-theme-container { width: min(100% - 32px, var(--cbmg-theme-container)); margin-inline: auto; }
.cbmg-theme-main { padding-block: 32px; }
.cbmg-theme-ad-slot:empty,
.cbmg-theme-header-slot:empty { display: none; }
