/*
 * CoolCrazyGames edition of the CrazyGamesX template.
 * Palette-only layer: the original layout, features and JavaScript stay intact.
 */
:root {
    color-scheme: dark;
    --ccg-page: #06172a;
    --ccg-page-deep: #030d1b;
    --ccg-panel: #0a2742;
    --ccg-panel-soft: #103553;
    --ccg-line: #245b82;
    --ccg-text: #f4faff;
    --ccg-muted: #a8bfd3;
    --ccg-blue: #2498ff;
    --ccg-cyan: #50dcff;
    --ccg-violet: #9368ff;
    --ccg-pink: #f05fc7;
    --ccg-green: #42e58a;
    --ccg-yellow: #ffd65a;
    --ccg-orange: #ff9b43;
}

html,
body {
    background: var(--ccg-page-deep) !important;
    color: var(--ccg-text) !important;
}

.gx-shell,
.gx-dashboard-shell {
    --gx-bg: var(--ccg-page);
    --gx-panel: var(--ccg-panel);
    --gx-panel-2: var(--ccg-panel-soft);
    --gx-line: var(--ccg-line);
    --gx-cyan: var(--ccg-cyan);
    --gx-pink: var(--ccg-pink);
    --gx-violet: var(--ccg-violet);
    --gx-green: var(--ccg-green);
    --gx-yellow: var(--ccg-yellow);
    --gx-muted: var(--ccg-muted);
    background:
        radial-gradient(circle at 72% 5%, rgba(80, 220, 255, .13), transparent 29%),
        radial-gradient(circle at 16% 24%, rgba(147, 104, 255, .12), transparent 27%),
        linear-gradient(145deg, var(--ccg-page-deep), var(--ccg-page) 48%, #071d34) !important;
}

.gx-header {
    background: rgba(3, 17, 32, .94) !important;
    border-bottom-color: rgba(80, 220, 255, .24) !important;
    box-shadow: 0 10px 30px rgba(0, 8, 20, .28);
}

.gx-search input,
.gx-login-dialog,
.gx-missions-modal,
.gx-profile-menu,
.gx-notification-panel {
    background-color: #09223a !important;
    border-color: var(--ccg-line) !important;
}

.gx-search input:focus {
    border-color: var(--ccg-cyan) !important;
    box-shadow: 0 0 0 3px rgba(80, 220, 255, .16) !important;
}

.gx-account .gx-login,
.gx-menu-button {
    border-color: #3e73a0 !important;
    background: linear-gradient(135deg, rgba(36, 152, 255, .18), rgba(147, 104, 255, .2)) !important;
}

.gx-main-nav a.is-active:after {
    background: linear-gradient(90deg, var(--ccg-blue), var(--ccg-violet), var(--ccg-cyan)) !important;
}

.gx-chip,
.gx-category-block {
    background-color: #09243d !important;
}

.gx-for-you,
.gx-hero-label {
    background: linear-gradient(100deg, var(--ccg-blue), var(--ccg-cyan)) !important;
    border-color: #7ae8ff !important;
    color: #021725 !important;
}

.gx-hero,
.gx-spot,
.gx-card-media {
    background-color: #071c31 !important;
    border-color: #285e87 !important;
}

.gx-hero {
    border-color: #627cea !important;
    box-shadow: inset 0 0 36px rgba(0, 18, 41, .26), 0 18px 44px rgba(0, 10, 27, .26) !important;
}

.gx-hero-shade {
    background: linear-gradient(90deg, rgba(3, 17, 33, .96), rgba(4, 27, 49, .56) 48%, rgba(5, 30, 53, .08) 76%), linear-gradient(0deg, rgba(3, 15, 29, .84), transparent 48%) !important;
}

.gx-hero-copy > b,
.gx-panel-button,
.gx-missions-modal-button {
    background: linear-gradient(105deg, var(--ccg-blue), var(--ccg-violet) 55%, var(--ccg-cyan)) !important;
    box-shadow: 0 0 22px rgba(65, 164, 255, .34) !important;
}

.gx-retention > article,
.gx-rail,
.gx-editors,
.gx-stored-copy,
.gx-right-sidebar > section,
.gx-profile-summary,
.gx-play-panel,
.gx-game-shell,
.gx-comments-panel,
.gx-description-panel {
    border-color: var(--ccg-line) !important;
    background: linear-gradient(145deg, rgba(13, 47, 76, .97), rgba(5, 24, 43, .99)) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, .035), 0 12px 32px rgba(0, 8, 22, .2) !important;
}

.gx-card:hover .gx-card-media,
.gx-card:focus-visible .gx-card-media {
    border-color: var(--ccg-cyan) !important;
    box-shadow: 0 0 16px rgba(80, 220, 255, .34) !important;
}

.gx-footer {
    border-top-color: #1e4d70 !important;
    background: linear-gradient(180deg, rgba(6, 24, 43, .25), rgba(3, 14, 27, .72));
}

/* Left rail stays closed by default. The menu button opens it; it never grows the page. */
.gx-admin-sidebar-menu {
    border-color: #2b638c !important;
    background: linear-gradient(165deg, rgba(10, 42, 70, .99), rgba(4, 20, 38, .995)) !important;
    box-shadow: inset 0 1px rgba(255, 255, 255, .045), 0 14px 34px rgba(0, 9, 24, .32) !important;
}

.gx-dashboard-shell.is-sidebar-open .gx-admin-sidebar-menu {
    box-shadow: inset 0 1px rgba(255, 255, 255, .05), 18px 18px 42px rgba(0, 7, 19, .5) !important;
}

.gx-admin-sidebar-menu > a,
.gx-admin-sidebar-menu > button {
    --gx-menu-accent: var(--ccg-cyan);
    color: #eaf7ff !important;
}

.gx-admin-sidebar-menu > :nth-child(7n + 1) { --gx-menu-accent: #ff596f; }
.gx-admin-sidebar-menu > :nth-child(7n + 2) { --gx-menu-accent: #35cfff; }
.gx-admin-sidebar-menu > :nth-child(7n + 3) { --gx-menu-accent: #ff9d32; }
.gx-admin-sidebar-menu > :nth-child(7n + 4) { --gx-menu-accent: #9a70ff; }
.gx-admin-sidebar-menu > :nth-child(7n + 5) { --gx-menu-accent: #ffd03f; }
.gx-admin-sidebar-menu > :nth-child(7n + 6) { --gx-menu-accent: #35df94; }
.gx-admin-sidebar-menu > :nth-child(7n + 7) { --gx-menu-accent: #ff65c7; }

.gx-admin-sidebar-menu > a:hover,
.gx-admin-sidebar-menu > button:hover,
.gx-admin-sidebar-menu > a:focus-visible,
.gx-admin-sidebar-menu > button:focus-visible,
.gx-admin-sidebar-menu > a.is-active {
    background: linear-gradient(100deg, color-mix(in srgb, var(--gx-menu-accent) 28%, #0a2945), rgba(10, 37, 63, .94)) !important;
    box-shadow: inset 4px 0 0 var(--gx-menu-accent), 0 0 18px color-mix(in srgb, var(--gx-menu-accent) 22%, transparent) !important;
}

.gx-nav-icon {
    filter: saturate(1.28) brightness(1.08) drop-shadow(0 0 5px color-mix(in srgb, var(--gx-menu-accent) 52%, transparent)) !important;
}

.gx-sidebar-separator {
    border-top-color: #28618a !important;
}

.gx-dashboard-shell.is-sidebar-open .gx-menu-button {
    border-color: var(--ccg-violet) !important;
    background: linear-gradient(135deg, #164c78, #463b91) !important;
}

.gx-dashboard-shell.is-sidebar-hidden .gx-menu-button {
    border-color: var(--ccg-cyan) !important;
    background: #0a2c49 !important;
}

/* Legacy/public sidebar icons remain multi-coloured, Y8-style. */
#sidebar-menu {
    background: linear-gradient(180deg, #0b2b48, #061b31) !important;
    border-right-color: #2d638a !important;
}

#sidebar-menu a {
    border-left: 3px solid transparent;
}

#sidebar-menu a:nth-of-type(6n + 1) { --legacy-accent: #ff596f; }
#sidebar-menu a:nth-of-type(6n + 2) { --legacy-accent: #39cfff; }
#sidebar-menu a:nth-of-type(6n + 3) { --legacy-accent: #ff9d32; }
#sidebar-menu a:nth-of-type(6n + 4) { --legacy-accent: #9a70ff; }
#sidebar-menu a:nth-of-type(6n + 5) { --legacy-accent: #ffd03f; }
#sidebar-menu a:nth-of-type(6n + 6) { --legacy-accent: #35df94; }

#sidebar-menu a:hover,
#sidebar-menu a.active {
    border-left-color: var(--legacy-accent, var(--ccg-cyan)) !important;
    background: color-mix(in srgb, var(--legacy-accent, var(--ccg-cyan)) 18%, #0a2945) !important;
}

#sidebar-menu img {
    filter: saturate(1.25) brightness(1.08) !important;
}

@media (max-width: 760px) {
    .gx-main-nav {
        background: #061b30 !important;
        border-bottom-color: #286087 !important;
    }

    .gx-main-nav a {
        background: #0a2945;
        border-color: #285a7e !important;
    }
}

@supports not (color: color-mix(in srgb, #fff 50%, #000)) {
    .gx-admin-sidebar-menu > a:hover,
    .gx-admin-sidebar-menu > button:hover,
    .gx-admin-sidebar-menu > a:focus-visible,
    .gx-admin-sidebar-menu > button:focus-visible,
    .gx-admin-sidebar-menu > a.is-active,
    #sidebar-menu a:hover,
    #sidebar-menu a.active {
        background: #123c60 !important;
    }
}

/* Final CoolCrazyGames identity: original blue gradient + Y8-style icon rail. */
html,
body {
    background: #11172f !important;
}

.gx-shell,
.gx-dashboard-shell {
    --gx-bg: #102b4d;
    --gx-panel: rgba(19, 55, 91, .92);
    --gx-panel-2: #173f68;
    --gx-line: rgba(148, 199, 255, .22);
    --gx-cyan: #67d9ff;
    --gx-violet: #a970ff;
    --gx-muted: #c8d4e5;
    background:
        radial-gradient(circle at 38% 0, rgba(22, 127, 181, .44), transparent 34%),
        radial-gradient(circle at 85% 0, rgba(111, 55, 150, .26), transparent 30%),
        linear-gradient(120deg, #173f68 0, #143353 43%, #171b39 100%) !important;
}

.gx-header {
    background: linear-gradient(100deg, rgba(19, 68, 106, .97), rgba(19, 57, 91, .96) 54%, rgba(27, 31, 65, .97)) !important;
    border-bottom-color: rgba(113, 202, 255, .22) !important;
    box-shadow: 0 6px 24px rgba(5, 13, 31, .22) !important;
}

.gx-search input {
    background: linear-gradient(90deg, #285678, #303563) !important;
    border-color: rgba(103, 217, 255, .45) !important;
    box-shadow: 0 0 18px rgba(77, 211, 255, .14) !important;
}

.gx-live,
.gx-rail,
.gx-editors,
.gx-stored-copy,
.gx-right-sidebar > article,
.gx-right-sidebar > section,
.gx-side-panel,
.gx-profile-summary,
.gx-play-panel,
.gx-game-shell,
.gx-comments-panel,
.gx-description-panel {
    border-color: rgba(126, 199, 255, .2) !important;
    background: linear-gradient(145deg, rgba(20, 60, 94, .9), rgba(27, 31, 70, .94)) !important;
    box-shadow: 0 18px 44px rgba(3, 13, 32, .28), inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

.gx-card-media {
    border-color: rgba(180, 219, 255, .16) !important;
    background: #17233b !important;
}

.gx-footer {
    background: linear-gradient(90deg, rgba(9, 31, 57, .97), rgba(27, 29, 68, .98)) !important;
    border-top-color: rgba(126, 199, 255, .2) !important;
}

/* White 60px rail and clean, individually coloured icons, matching Y8.org.es. */
.gx-admin-sidebar-menu {
    border-color: #e1e5eb !important;
    background: linear-gradient(145deg, rgba(250, 251, 253, .99), rgba(244, 247, 250, .998)) !important;
    box-shadow: 8px 10px 26px rgba(8, 25, 50, .2) !important;
}

.gx-dashboard-shell.is-sidebar-open .gx-admin-sidebar-menu {
    box-shadow: 14px 18px 36px rgba(7, 22, 45, .3) !important;
}

.gx-admin-sidebar-menu > a,
.gx-admin-sidebar-menu > button {
    color: #17243a !important;
}

.gx-admin-sidebar-menu > a:hover,
.gx-admin-sidebar-menu > button:hover,
.gx-admin-sidebar-menu > a:focus-visible,
.gx-admin-sidebar-menu > button:focus-visible,
.gx-admin-sidebar-menu > a.is-active {
    background: linear-gradient(100deg, color-mix(in srgb, var(--gx-menu-accent) 13%, #fff), #f8fbfd) !important;
    box-shadow: inset 3px 0 0 var(--gx-menu-accent), 0 3px 12px rgba(31, 57, 91, .1) !important;
}

.gx-sidebar-separator {
    border-top-color: #dfe4ea !important;
}

.gx-left-sidebar .gx-nav-icon {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    background-position: center !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    filter: none !important;
}

.gx-left-sidebar .gx-nav-home { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23d21620%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m3%2011%209-8%209%208M5%2010v11h5v-7h4v7h5V10%22%2F%3E%3C%2Fsvg%3E") !important; }
.gx-left-sidebar .gx-nav-new { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%230873c4%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m9%203%203-1%203%201%201%203%203%201%202%203-1%203%201%203-2%203-3%201-1%203-3%201-3-1-1-3-3-1-2-3%201-3-1-3%202-3%203-1z%22%20transform%3D%22translate(2%201)%20scale(.83)%22%2F%3E%3Cpath%20d%3D%22M9%2016V8l6%208V8%22%2F%3E%3C%2Fsvg%3E") !important; }
.gx-left-sidebar .gx-nav-updated { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%230873c4%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m9%203%203-1%203%201%201%203%203%201%202%203-1%203%201%203-2%203-3%201-1%203-3%201-3-1-1-3-3-1-2-3%201-3-1-3%202-3%203-1z%22%20transform%3D%22translate(2%201)%20scale(.83)%22%2F%3E%3Cpath%20d%3D%22M9%2016V8l6%208V8%22%2F%3E%3C%2Fsvg%3E") !important; }
.gx-left-sidebar .gx-nav-popular { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23f59b00%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M13%202c1%206-5%207-3%2012%202-1%204-3%204-5%205%204%207%207%204%2011-4%205-13%202-13-4%200-3%202-6%204-8-1%204%201%204%201%204%22%2F%3E%3C%2Fsvg%3E") !important; }
.gx-left-sidebar .gx-nav-liked { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%239570ee%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M8%2021H4V10h4m0%2011h10l3-10h-7l1-6c0-3-3-3-4%200l-3%205z%22%2F%3E%3C%2Fsvg%3E") !important; }
.gx-left-sidebar .gx-nav-featured { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23f5a000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m12%203%203%206%207%201-5%205%201%207-6-3-6%203%201-7-5-5%207-1z%22%2F%3E%3C%2Fsvg%3E") !important; }
.gx-left-sidebar .gx-nav-one-player { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%232489dc%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%227%22%20r%3D%224%22%2F%3E%3Cpath%20d%3D%22M4%2022v-4a8%208%200%200%201%2016%200v4z%22%2F%3E%3C%2Fsvg%3E") !important; }
.gx-left-sidebar .gx-nav-fallback { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23bc9500%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%223%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2214%22%20y%3D%223%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%223%22%20y%3D%2214%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3Crect%20x%3D%2214%22%20y%3D%2214%22%20width%3D%227%22%20height%3D%227%22%20rx%3D%221%22%2F%3E%3C%2Fsvg%3E") !important; }
.gx-left-sidebar .gx-nav-blog { background-image: url('/static/menu-img/blog.svg') !important; }

.gx-left-sidebar .gx-nav-racing,
.gx-left-sidebar .gx-nav-cars,
.gx-left-sidebar .gx-nav-drifting,
.gx-left-sidebar .gx-nav-bmx {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2300a9c4%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m5%209%203-4h8l3%204%203%202v7h-3M5%2018H2v-7l3-2h14M8%2018h8M3%2013h3m12%200h3%22/%3E%3Ccircle%20cx%3D%227%22%20cy%3D%2218%22%20r%3D%222%22/%3E%3Ccircle%20cx%3D%2217%22%20cy%3D%2218%22%20r%3D%222%22/%3E%3C/svg%3E") !important;
}

.gx-left-sidebar .gx-nav-action {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23fa6157%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m4%203%2015%2015M3%203l1%205%203-1%201-3zM16%2016l5%205m-6-1%205-5M20%203%205%2018m-2%203%205-5m-4-1%205%205m10-17%202%201-1%204-3-1-1-3z%22/%3E%3C/svg%3E") !important;
}

.gx-left-sidebar .gx-nav-puzzle {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23ae67ec%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%203H3v6c6-3%206%207%200%204v8h6c-3-6%207-6%204%200h8v-8c-6%203-6-7%200-4V3h-8c3%206-7%206-4%200z%22/%3E%3C/svg%3E") !important;
}

.gx-left-sidebar .gx-nav-shooting,
.gx-left-sidebar .gx-nav-fps,
.gx-left-sidebar .gx-nav-gun {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23bd8c0b%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2213%22%20r%3D%229%22/%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2213%22%20r%3D%225%22/%3E%3Cpath%20d%3D%22m11%2013%2010-10m-1-1v4h4%22/%3E%3C/svg%3E") !important;
}

.gx-left-sidebar .gx-nav-dress-up {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23de57cc%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2013C2%200%2022%200%2020%2013l2%205-5%202M4%2013l-2%205%205%202M6%2010c3%200%205-2%206-5%201%203%203%205%206%205v4a6%206%200%200%201-12%200zM9%2014h.01M15%2014h.01M9%2017q3%202%206%200%22/%3E%3C/svg%3E") !important;
}

.gx-left-sidebar .gx-nav-sports {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2319a785%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%2210%22/%3E%3Cpath%20d%3D%22m12%207%205%204-2%205H9l-2-5zM12%207V2m5%209%205-2m-7%207%203%205m-9-5-3%205m1-10L2%209%22/%3E%3C/svg%3E") !important;
}

.gx-left-sidebar .gx-nav-two-player {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2363a000%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%207h12c5%200%206%2014%202%2014l-5-4H9l-5%204C0%2021%201%207%206%207zM6%2010v5m-2-2h4m8-2h.01m3%203h.01M10%204h4%22/%3E%3C/svg%3E") !important;
}

.gx-left-sidebar .gx-nav-adventure {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23aa6ee3%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%207%202%2011l4%204%203-2%207%204%206-5-4-5-7%202zM9%205l5-2%204%202m-4%2014%204%202%22/%3E%3C/svg%3E") !important;
}

.gx-left-sidebar .gx-nav-skill,
.gx-left-sidebar .gx-nav-tower-defence {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2352aa00%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22m12%202%203%203%204%201v4l3%203-3%203v4l-4-1-3%203-3-3-4%201v-4l-3-3%203-3V6l4-1zM8%2010l3%203%205-5%22/%3E%3C/svg%3E") !important;
}

.gx-left-sidebar .gx-nav-truck,
.gx-left-sidebar .gx-nav-trucks,
.gx-left-sidebar .gx-nav-tanks {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2305a8ba%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M2%205h12v13H2zM14%209h5l3%205v4h-8M18%209v5h4%22/%3E%3Ccircle%20cx%3D%226%22%20cy%3D%2219%22%20r%3D%222%22/%3E%3Ccircle%20cx%3D%2218%22%20cy%3D%2219%22%20r%3D%222%22/%3E%3C/svg%3E") !important;
}

.gx-left-sidebar .gx-nav-escape,
.gx-left-sidebar .gx-nav-dinosaur {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2378a400%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2022h16M7%2021v-7l4-5-3-3%205-4%205%203%202%206-5-1-2%204%204%203v4M12%206h.01%22/%3E%3C/svg%3E") !important;
}

.gx-left-sidebar .gx-nav-horror,
.gx-left-sidebar .gx-nav-zombie {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%238060cb%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%2022V10a8%208%200%200%201%2016%200v12l-4-3-4%203-4-3z%22/%3E%3Ccircle%20cx%3D%229%22%20cy%3D%2210%22%20r%3D%221%22/%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2210%22%20r%3D%221%22/%3E%3Cpath%20d%3D%22M9%2015h6%22/%3E%3C/svg%3E") !important;
}

.gx-left-sidebar .gx-nav-stickman {
    background-image: url('/static/menu-img/played-games.svg') !important;
}

.gx-left-sidebar .gx-nav-pixel {
    background-image: url('/static/menu-img/tag.svg') !important;
}

.gx-left-sidebar .gx-nav-youtube {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23e02b35%22%20stroke-width%3D%221.9%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%222%22%20y%3D%225%22%20width%3D%2220%22%20height%3D%2214%22%20rx%3D%224%22/%3E%3Cpath%20d%3D%22m10%209%206%203-6%203z%22/%3E%3C/svg%3E") !important;
}

/* Site-wide CoolCrazyGames blue skin for list, taxonomy, blog and legal pages. */
html.gx-page-preview,
html.gx-page-preview body {
    background:
        radial-gradient(circle at 38% 0, rgba(22, 127, 181, .38), transparent 34%),
        radial-gradient(circle at 85% 0, rgba(68, 77, 157, .2), transparent 30%),
        linear-gradient(120deg, #173f68 0, #143353 43%, #171f42 100%) fixed !important;
    color: #f4faff !important;
}

html.gx-page-preview :is(
    .footer-description,
    .search-footer-description,
    .search-results-grid,
    #main-content:has(.search-results-grid) .gamemonetize-main > h1,
    .gm-taxonomy-panel,
    .crazy-static-page,
    .crazy-blog-shell,
    .crazy-blog-article .splide-container,
    #main-content .bg-gray-800
) {
    border-color: rgba(116, 190, 242, .34) !important;
    background: linear-gradient(145deg, rgba(20, 60, 94, .97), rgba(17, 30, 67, .985)) !important;
    box-shadow: inset 0 1px 0 rgba(180, 225, 255, .09), 0 16px 38px rgba(3, 13, 32, .24) !important;
}

html.gx-page-preview :is(.footer-description, .search-footer-description, .gm-taxonomy-panel, .crazy-static-page, .crazy-blog-shell) a {
    color: #78ddff !important;
}

html.gx-page-preview :is(.footer-description, .search-footer-description, .crazy-static-page, .crazy-blog-shell) :is(h1, h2, h3, h4) {
    color: #f7fbff !important;
}

html.gx-page-preview :is(.contact-submit-btn, #load-more-tags-btn, .blog-load-more) {
    border-color: #67d9ff !important;
    background: linear-gradient(105deg, #187fc2, #4359b8 58%, #38bfe8) !important;
    box-shadow: 0 8px 22px rgba(16, 94, 154, .28) !important;
    color: #fff !important;
}

html.gx-page-preview :is(.contact-form input:not([type="hidden"]), .contact-form textarea) {
    border-color: #3476a3 !important;
    background: #102b4d !important;
    color: #f7fbff !important;
}

html.gx-page-preview :is(#game-list-container > a, .search-results-grid > a) {
    box-shadow: 0 0 0 1px rgba(103, 182, 235, .34) !important;
}

html.gx-page-preview :is(.category-tags-grid .categories-page-slider-card, #tags-container .tag-page-card, .search-results-grid > .search-related-tag-card) {
    border-color: rgba(103, 182, 235, .38) !important;
    box-shadow: 0 0 0 1px rgba(103, 182, 235, .34) !important;
    background-color: rgba(16, 53, 83, .94) !important;
}

html.gx-page-preview :is(
    #game-list-container > a,
    .search-results-grid > a,
    .categories-page-slider-card,
    #tags-container .tag-page-card,
    .blog-mobile-card
):is(:hover, :focus-visible) {
    border-color: #67d9ff !important;
    outline: 2px solid #67d9ff !important;
    outline-offset: 2px;
}

html.gx-page-preview .blog-mobile-card {
    border-color: rgba(103, 182, 235, .34) !important;
    background: linear-gradient(145deg, #173f68, #111f43) !important;
}

/* Blue menu rail with the individual Y8-style icon colours preserved. */
.gx-admin-sidebar-menu {
    border-color: #3977a3 !important;
    background: linear-gradient(165deg, rgba(22, 68, 105, .995), rgba(10, 37, 67, .998)) !important;
    box-shadow: 9px 12px 28px rgba(3, 14, 34, .34) !important;
}

.gx-dashboard-shell.is-sidebar-open .gx-admin-sidebar-menu {
    box-shadow: 16px 20px 40px rgba(3, 13, 31, .46) !important;
}

.gx-admin-sidebar-menu > a,
.gx-admin-sidebar-menu > button {
    color: #eff8ff !important;
}

.gx-admin-sidebar-menu > a:hover,
.gx-admin-sidebar-menu > button:hover,
.gx-admin-sidebar-menu > a:focus-visible,
.gx-admin-sidebar-menu > button:focus-visible,
.gx-admin-sidebar-menu > a.is-active {
    background: linear-gradient(100deg, color-mix(in srgb, var(--gx-menu-accent) 22%, #16476e), #123a60) !important;
    box-shadow: inset 3px 0 0 var(--gx-menu-accent), 0 4px 16px rgba(2, 18, 41, .25) !important;
}

.gx-sidebar-separator {
    border-top-color: rgba(137, 197, 238, .25) !important;
}

/* Recently Played intentionally keeps its purple identity. */
.gx-live.gx-recent-panel.gx-played-panel {
    border-color: rgba(169, 87, 255, .62) !important;
    background: linear-gradient(135deg, rgba(28, 13, 69, .98), rgba(7, 14, 39, .99)) !important;
    box-shadow: inset 0 1px 0 rgba(213, 127, 255, .16), 0 15px 34px rgba(8, 4, 27, .34) !important;
}

.gx-live.gx-recent-panel.gx-played-panel > header a {
    color: #d05fff !important;
}

/* Compact real-language selector beside Login. */
.gx-header .gx-language-widget {
    position: relative !important;
    inset: auto !important;
    z-index: 260 !important;
    display: block !important;
    flex: 0 0 auto;
    font-family: Inter, Arial, sans-serif;
}

.gx-header .gx-language-toggle {
    display: inline-flex !important;
    min-width: 78px !important;
    height: 38px !important;
    min-height: 38px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 0 11px !important;
    border: 1px solid rgba(103, 217, 255, .48) !important;
    border-radius: 10px !important;
    background: linear-gradient(135deg, #174f78, #343f83) !important;
    color: #fff !important;
    box-shadow: 0 7px 18px rgba(3, 20, 43, .24) !important;
    cursor: pointer;
}

.gx-language-globe { font-size: 17px; line-height: 1; }
.gx-language-code { font-size: 11px; font-weight: 900; }
.gx-language-chevron { font-size: 11px; color: #9ee8ff; }

.gx-header .gx-language-panel {
    position: absolute !important;
    top: calc(100% + 9px) !important;
    right: 0 !important;
    bottom: auto !important;
    width: 270px !important;
    padding: 14px !important;
    border: 1px solid #3977a3 !important;
    border-radius: 14px !important;
    background: linear-gradient(145deg, #173f68, #111f43) !important;
    box-shadow: 0 20px 45px rgba(2, 12, 30, .52) !important;
    color: #fff !important;
}

.gx-header .gx-language-panel[hidden] { display: none !important; }
.gx-header .gm-language-options { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.gx-header .gm-language-options button,
.gx-header .gm-language-options a,
.gx-header .gm-language-reset {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 10px;
    border: 1px solid #3977a3 !important;
    border-radius: 8px !important;
    background: #102b4d !important;
    color: #eef8ff !important;
    font: 800 12px/1 Inter, Arial, sans-serif !important;
    text-decoration: none !important;
}
.gx-header .gm-language-options button:hover,
.gx-header .gm-language-options a:hover,
.gx-header .gm-language-reset:hover {
    border-color: #67d9ff !important;
    background: #174a71 !important;
}

@media (max-width: 760px) {
    .gx-dashboard-shell .gx-language-widget { order: 4; }
    .gx-dashboard-shell .gx-account { order: 5; }
    .gx-header .gx-language-toggle { min-width: 38px !important; width: 38px !important; padding: 0 !important; border-radius: 50% !important; }
    .gx-header .gx-language-code,
    .gx-header .gx-language-chevron { display: none !important; }
    .gx-header .gx-language-panel { position: fixed !important; top: 68px !important; right: 10px !important; width: min(270px, calc(100vw - 20px)) !important; }
}
