/* Boys: blue spectrum */
body.theme_boys {
    --wood: #4a7ab8;
    --wood_dark: #1e3a5f;
    --paper: #eef4fc;
    --paper_dark: #d9e8f7;
    --ink: #1a2e44;
    --accent: #2b6cb0;
    --accent_soft: #90cdf4;
    --green: #3182ce;
    --shadow: rgba(30, 58, 95, 0.18);
    --header_bg: #1e3a5f;
    --title_fallback: #1e3a5f;
}

/* Girls: pink spectrum */
body.theme_girls {
    --wood: #c45d8a;
    --wood_dark: #7b2d5c;
    --paper: #fff5f9;
    --paper_dark: #fce8f0;
    --ink: #4a2038;
    --accent: #d64f8b;
    --accent_soft: #f8b4d9;
    --green: #c45d8a;
    --shadow: rgba(123, 45, 92, 0.18);
    --header_bg: #7b2d5c;
    --title_fallback: #7b2d5c;
}

body.theme_boys .site_header,
body.theme_girls .site_header {
    background: var(--header_bg);
}

body.theme_boys.title_page,
body.theme_girls.title_page {
    background-color: var(--title_fallback);
}

body.theme_boys .title_open_btn,
body.theme_girls .title_open_btn {
    background: color-mix(in srgb, var(--accent) 90%, transparent);
    border-color: rgba(255, 255, 255, 0.7);
}

body.theme_boys .title_open_btn:hover,
body.theme_girls .title_open_btn:hover {
    background: var(--accent);
}

body.theme_boys .shuffle_link:hover,
body.theme_boys .riddle_tool_link:hover,
body.theme_boys .giggle_tool_link:hover,
body.theme_girls .shuffle_link:hover,
body.theme_girls .riddle_tool_link:hover,
body.theme_girls .giggle_tool_link:hover {
    background: var(--header_bg);
    border-color: var(--header_bg);
    color: #fff;
}