/* Desktop navigation. Existing mobile navigation remains in the header. */
.cz-desktop-layout .footer_links { min-inline-size: 0; max-inline-size: 100%; }
.cz-desktop-layout .footer_links ul { flex-wrap: wrap; }
/* Reserve the sidebar column without relational selectors (older Steam CEF). */
@media (min-width: 1025px) {
  .global-container.cz-desktop-layout {
    --cz-sidebar-size: clamp(232px, 18vw, 280px);
    margin-inline-start: var(--cz-sidebar-size);
  }
}
@supports not selector(:has(*)) {
  @media (min-width: 1025px) {
    .cz-desktop-layout .cz-site-header {
      --cz-header-text-size: 12px;
      --cz-header-value-size: 18px;
      --cz-header-avatar-size: 40px;
      --cz-header-control-size: 32px;
      --cz-header-topup-size: 32px;
      --cz-header-gap: 8px;
    }
    .cz-desktop-layout .cz-shell > .cz-site-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: nowrap;
      inline-size: auto;
      block-size: 80px;
      min-block-size: 80px;
      margin-block: 0 24px;
      margin-inline: calc(var(--cz-header-inset) - var(--cz-shell-inset));
      padding: 0;
      gap: 12px;
    }
    .cz-desktop-layout .navbar_menu_left > :is(.logo-text,.header_burger,.nav_header_menu,.online),
    .cz-desktop-layout .drpdwn_menu > .dropdown { display: none; }
    .cz-desktop-layout .drpdwn_menu { display: contents; }
    .cz-desktop-layout .navbar_menu_left { margin-inline-end: auto; }
    .cz-desktop-layout .navbar_usermenu { flex: none; margin-inline-start: auto; }
    .cz-desktop-layout.cz-wallet-present .navbar_usermenu > .pay_button { display: none; }
    .cz-desktop-layout.cz-account-present .navbar_usermenu > button:not(.pay_button) {
      inline-size: var(--cz-header-control-size);
      block-size: 44px;
      padding: 0;
      border: 0;
      background: transparent;
      box-shadow: none;
    }
    .cz-desktop-layout.cz-wallet-present .cz-header-account__meta { grid-template-columns: minmax(0,auto) var(--cz-header-topup-size); }
    .cz-desktop-layout .cz-header-online__label { font-size: 11px; }
    .cz-desktop-layout .cz-header-account__name { max-inline-size: 10ch; }
    .cz-desktop-layout .cz-header-account__arrow { display: none; }
    .cz-desktop-layout .cz-header-shortcuts { display: none; }
  }
}
@supports not (font-size: 1cqi) {
  .cz-desktop-layout .cz-menu-page { --page-pad: 22px; }
  .cz-desktop-layout .cz-page-heading h1 { font-size: 28px; }
}
.cz-desktop-sidebar { display: none; }
.cz-header-online { display: none; }
.cz-header-shortcuts, .cz-header-account__meta, .cz-header-account__arrow { display: none; }
.cz-header-account { display: flex; align-items: center; }
.cz-site-header > :is(.navbar_menu_left,.navbar_usermenu) { padding: 5px; }
.navbar_usermenu :is(.cz-header-account__name,.cz-header-account__balance) { inline-size: auto; block-size: auto; min-inline-size: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; text-align: start; }
.navbar_usermenu .cz-header-account__avatar { display: flex; align-items: center; justify-content: center; padding: 0; inline-size: auto; block-size: auto; min-inline-size: 0; border: 0; background: transparent; box-shadow: none; }
@media (min-width: 1025px) {
  body:has(.cz-desktop-sidebar) { --cz-sidebar-size: clamp(232px, 18vw, 280px); }
  body:has(.cz-desktop-sidebar) .global-container { margin-inline-start: var(--cz-sidebar-size); }
  .cz-desktop-sidebar {
    position: fixed;
    inset-block: 0;
    inset-inline-start: 0;
    z-index: 110;
    display: flex;
    flex-direction: column;
    inline-size: var(--cz-sidebar-size);
    padding: 20px 16px 20px;
    background: linear-gradient(180deg, color-mix(in oklch, var(--card) 78%, var(--bg)), var(--bg));
    border-inline-end: 1px solid color-mix(in oklch, var(--span) 14%, transparent);
    color: var(--text-default);
  }
  .cz-desktop-sidebar__brand {
    display: flex;
    flex-direction: column;
    flex: none;
    align-items: flex-start;
    justify-content: center;
    min-block-size: 80px;
    gap: 8px;
    margin-block-end: 20px;
    padding: 8px 14px;
    color: var(--text-default);
    text-decoration: none;
  }
  .cz-desktop-sidebar__wordmark { font-family: var(--font-family-1); font-size: clamp(18px, 1.45vw, 22px); font-weight: 750; letter-spacing: -0.055em; color: var(--text-default); }
  .cz-desktop-sidebar__logo { display: block; inline-size: min(100%, clamp(164px, 13vw, 184px)); }
  .cz-desktop-sidebar__logo > svg { inline-size: 100%; max-block-size: 56px; }
  .cz-desktop-sidebar__caption { color: var(--text-custom); font-size: 9px; font-weight: 600; letter-spacing: 0.2em; }
  .cz-desktop-sidebar__nav {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    min-block-size: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    padding: 3px;
    margin-inline: -3px;
  }
  .cz-desktop-sidebar__link {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: none;
    min-block-size: 48px;
    padding: 12px 16px;
    border-radius: 16px;
    color: var(--text-default);
    text-decoration: none;
    font-size: 15px;
    font-weight: 550;
    line-height: 1.3;
  }
  .cz-desktop-sidebar__link > span:last-child { min-inline-size: 0; overflow-wrap: anywhere; color: inherit; }
  .cz-desktop-sidebar__icon { display: inline-flex; flex: none; color: var(--text-custom); }
  .cz-desktop-sidebar__icon, .cz-desktop-sidebar__link > svg { inline-size: 24px; block-size: 24px; }
  .cz-desktop-sidebar__icon > :is(svg,img) { display: block; inline-size: 100%; block-size: 100%; object-fit: contain; fill: currentColor; }
  .cz-desktop-sidebar__link > svg { flex: none; fill: var(--span); }
  .cz-desktop-sidebar__link.is-current { background: color-mix(in oklch, var(--span) 18%, var(--card)); color: var(--text-default); box-shadow: inset 3px 0 0 var(--span); }
  .cz-desktop-sidebar__link.is-current .cz-desktop-sidebar__icon { color: var(--span); }
  .cz-desktop-sidebar__gamepad { fill: none !important; color: var(--span); }
  .cz-desktop-sidebar__footer { display: grid; gap: 16px; flex: none; padding-block-start: 20px; color: var(--text-custom); }
  .cz-desktop-sidebar__help { display: grid; gap: 6px; padding: 14px 16px; border: 1px solid color-mix(in oklch, var(--span) 18%, transparent); border-radius: 14px; background: color-mix(in oklch, var(--card) 70%, transparent); color: var(--text-custom); font-size: 11px; }
  .cz-desktop-sidebar__help strong { display: flex; justify-content: space-between; gap: 8px; color: var(--text-default); font-size: 12px; font-weight: 550; }
  .cz-desktop-sidebar__community { display: flex; flex-wrap: wrap; gap: 8px; padding-inline: 8px; }
  .cz-desktop-sidebar__community a { display: grid; place-items: center; inline-size: 40px; block-size: 38px; border-radius: 10px; color: var(--text-custom); }
  .cz-desktop-sidebar__community svg { inline-size: 21px; block-size: 21px; fill: currentColor; }
  .cz-desktop-sidebar :is(a,button):focus-visible { outline: 2px solid var(--span); outline-offset: 2px; }
  .cz-desktop-sidebar__link:active { background: color-mix(in oklch, var(--span) 26%, var(--card)); }
  .cz-desktop-sidebar__brand:active { opacity: 0.75; }

  /* Keep account controls in their existing header and preserve their handlers. */
  body:has(.cz-desktop-sidebar) .navbar { margin: 0 8px 24px; min-block-size: 80px; height: auto; justify-content: flex-end; gap: 16px; flex-wrap: nowrap; }
  body:has(.cz-desktop-sidebar) .navbar_menu_left { margin-inline-end: auto; }
  .cz-header-online { display: flex; align-items: center; gap: var(--cz-header-gap); flex: none; padding-inline-start: 12px; color: var(--span); font-size: var(--cz-header-value-size); }
  .cz-header-online__icon { display: block; flex: none; inline-size: 1.3em; block-size: 1.3em; fill: none; color: var(--span); }
  .cz-header-online__text { display: grid; gap: 4px; }
  .cz-header-online__label { color: var(--text-custom); font-size: clamp(11px, 1.5cqi, 12px); font-weight: 500; line-height: 1.3; white-space: nowrap; }
  .cz-header-online__value { color: var(--green); font-family: var(--font-family-1); font-size: inherit; font-weight: 650; font-variant-numeric: tabular-nums; line-height: 1.2; }
  body:has(.cz-desktop-sidebar) .navbar_menu_left > .online { display: none; }
  body:has(.cz-desktop-sidebar) .navbar_menu_left > :is(.logo-text,.header_burger,.nav_header_menu) { display: none; }
  body:has(.cz-desktop-sidebar) .drpdwn_menu { display: contents; }
  body:has(.cz-desktop-sidebar) .drpdwn_menu > .dropdown { display: none; }
  body:has(.cz-desktop-sidebar) .navbar_usermenu { flex: none; margin-inline-start: auto; }
  body:has(.cz-desktop-sidebar) .navbar {
    container-type: inline-size;
    --cz-header-text-size: clamp(12px, 1.7cqi, 14px);
    --cz-header-value-size: clamp(18px, 2.7cqi, 22px);
    --cz-header-avatar-size: clamp(40px, 5.7cqi, 44px);
    --cz-header-control-size: clamp(36px, 5.5cqi, 44px);
    --cz-header-topup-size: clamp(32px, 4.5cqi, 36px);
    --cz-header-gap: clamp(8px, 1.7cqi, 14px);
  }
  /* Keep a steady gap from the sidebar, including when the chat is folded. */
  body:has(.cz-desktop-sidebar):has(#rowModsServers) { --cz-home-content-size: none; --cz-home-content-gutter: 64px; }
  body:has(.cz-desktop-sidebar):has(#rowModsServers) .container-fluid { inline-size: 100%; max-inline-size: none; }
  body:has(.cz-desktop-sidebar) :is(#rowModsServers,#modInfoBlock,#rowServers) {
    inline-size: calc(100% - var(--cz-home-content-gutter));
    max-inline-size: var(--cz-home-content-size);
    margin-inline: auto;
  }
  body:has(.cz-desktop-sidebar) #rowModsServers > .col-md-13 > .modes-header:not(.purchases-header) { margin-block-start: 8px; }
  body:has(.cz-desktop-sidebar) #rowModsServers .mods__wrapper--tall,
  body:has(.cz-desktop-sidebar):has(#cchat:not(.cchat-collapsed)) #rowModsServers .mods__wrapper--tall {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, max(240px, calc((100% - 32px) / 3))), 1fr));
  }
  body:has(.cz-desktop-sidebar) #rowModsServers .mods__card { inline-size: 100%; min-inline-size: 0; block-size: auto; min-block-size: 250px; aspect-ratio: 1.53; }
  body:has(.cz-desktop-sidebar) .navbar_usermenu:has(.cz-header-account) { gap: 6px; margin-inline-end: 6px; }
  body:has(.cz-desktop-sidebar) .navbar_usermenu:has(.cz-header-account) > .pay_button { display: none; }
  body:has(.cz-desktop-sidebar) .navbar_usermenu:has(.cz-header-account) > button:not(.pay_button) { inline-size: var(--cz-header-control-size); block-size: 44px; padding: 0; border: 0; border-radius: 10px; background: transparent; box-shadow: none; color: var(--text-custom); font-size: var(--cz-header-text-size); }
  body:has(.cz-desktop-sidebar) .navbar_usermenu:has(.cz-header-account) > button:not(.pay_button) svg { inline-size: 1.55em; block-size: 1.55em; fill: currentColor; }
  /* Match the lower account row: half the nickname line plus half the row gap. */
  body:has(.cz-desktop-sidebar) .navbar_usermenu:has(.cz-header-account__wallet) > :is(#open_button_search,#notifyOpen,.cz-header-shortcuts) { position: relative; inset-block-start: calc(var(--cz-header-text-size) * .65 + 2px); }
  /* Restore only the gift, matching the search and notification controls. */
  .cz-header-shortcuts { display: flex; align-items: center; gap: 2px; }
  .cz-header-shortcuts:not(:has(.cz-header-shortcut--gift)) { display: none; }
  .cz-header-shortcuts a { display: inline-flex; align-items: center; justify-content: center; flex: none; inline-size: var(--cz-header-control-size); block-size: 44px; border-radius: 10px; color: var(--text-custom); font-size: var(--cz-header-text-size); }
  .cz-header-shortcuts svg { flex: none; inline-size: 1.55em; block-size: 1.55em; fill: none; }
  .cz-header-shortcuts svg:has(use) { fill: currentColor; }
  .cz-header-shortcuts .cz-header-shortcut--gift { color: var(--text-custom); }
  .cz-header-shortcuts .cz-header-shortcut--daily { display: none; }
  .cz-header-account { gap: var(--cz-header-gap); margin-inline-start: 8px; }
  .cz-header-account .user__avatar { inline-size: var(--cz-header-avatar-size); block-size: var(--cz-header-avatar-size); border: 1px solid color-mix(in oklch, var(--span) 22%, transparent); border-radius: 50%; overflow: clip; }
  .cz-header-account .user__avatar img { inline-size: 100%; block-size: 100%; object-fit: cover; border-radius: inherit; }
  .cz-header-account__meta { display: grid; gap: 4px var(--cz-header-gap); min-inline-size: 0; align-items: center; }
  .cz-header-account__meta:has(.cz-header-account__wallet) { grid-template-columns: minmax(0, auto) var(--cz-header-topup-size); }
  .navbar_usermenu .cz-header-account__name { display: block; max-inline-size: 18ch; overflow: clip; text-overflow: ellipsis; white-space: nowrap; font-size: var(--cz-header-text-size); font-weight: 500; line-height: 1.3; color: var(--text-custom); grid-column: 1; grid-row: 1; }
  .cz-header-account__wallet { display: contents; }
  .navbar_usermenu .cz-header-account__balance { display: inline-flex; align-items: baseline; color: var(--text-default); font-family: var(--font-family-1); font-size: var(--cz-header-value-size); font-weight: 650; font-variant-numeric: tabular-nums; line-height: 1.2; grid-column: 1; grid-row: 2; }
  .cz-header-account__balance > span { color: inherit; font: inherit; margin-inline-start: .22em; }
  .navbar_usermenu .cz-header-account__topup { display: inline-flex; align-items: center; justify-content: center; position: relative; flex: none; inline-size: var(--cz-header-topup-size); block-size: var(--cz-header-topup-size); grid-column: 2; grid-row: 2; font-size: var(--cz-header-text-size); min-inline-size: 0; padding: 0; border: 0; border-radius: 50%; color: oklch(0.98 0.01 230); background: oklch(0.64 0.23 25); box-shadow: none; }
  .cz-header-account__topup::after { content: ""; position: absolute; inset: min(0px, (100% - 44px) / 2); }
  .navbar_usermenu .cz-header-account__topup svg { inline-size: 1.4em; block-size: 1.4em; fill: currentColor; }
  .navbar_usermenu .cz-header-account__arrow { display: inline-flex; align-items: center; justify-content: center; inline-size: 28px; block-size: 44px; font-size: var(--cz-header-text-size); min-inline-size: 0; padding: 0; border: 0; background: transparent; box-shadow: none; color: var(--text-custom); }
  .navbar_usermenu .cz-header-account__arrow svg { inline-size: 1em; block-size: 1em; fill: none; }
  .navbar_usermenu:has(.cz-header-account) #main_notifications_badge { background: oklch(0.64 0.23 10); box-shadow: none; }
  .cz-header-account button:focus-visible, .cz-header-shortcuts a:focus-visible { outline: 2px solid var(--span); outline-offset: 3px; }
  .cz-header-account button:active, .cz-header-shortcuts a:active { opacity: 0.7; }
  .navbar_usermenu:has(.cz-header-account) > button:not(.pay_button):active { opacity: 0.7; }

  /* The Play page ends with live project figures and the existing legal links. */
  body:has(.cz-desktop-sidebar) #rowModsServers .statistics_grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr));
    margin-block-start: 30px;
    padding-block: 28px 12px;
    padding-inline: 0;
    gap: 18px;
    border: 0;
    border-block-start: 1px solid color-mix(in oklch, var(--span) 16%, transparent);
    border-radius: 0;
    background: transparent;
    overflow: visible;
  }
  body:has(.cz-desktop-sidebar) #rowModsServers .statistics_container { justify-content: flex-start; align-items: center; gap: 12px; padding: 0; border: 0; }
  body:has(.cz-desktop-sidebar) #rowModsServers .statistics_icon { width: 26px; opacity: 1; }
  body:has(.cz-desktop-sidebar) #rowModsServers .statistics_icon svg { fill: var(--span); }
  body:has(.cz-desktop-sidebar) #rowModsServers .statistics_name { color: var(--text-custom); font-size: 11px; line-height: 1.4; white-space: normal; margin-block-end: 7px; }
  body:has(.cz-desktop-sidebar) #rowModsServers .statistics_number { color: var(--text-default); font-size: clamp(23px, 2.2vw, 34px); font-weight: 750; line-height: 1.15; letter-spacing: -0.035em; }
  body:has(.cz-desktop-sidebar):has(#rowModsServers) .footer_global { width: calc(100% - 48px); max-width: 1180px; margin: 24px auto 16px; padding: 24px 0 8px; border-block-start: 1px solid color-mix(in oklch, var(--span) 12%, transparent); border-radius: 0; gap: 18px; }
  body:has(.cz-desktop-sidebar):has(#rowModsServers) .footer-top { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 20px; align-items: center; }
  body:has(.cz-desktop-sidebar):has(#rowModsServers) .footer-top .left_footer { grid-column: 1; grid-row: 1; margin: 0; }
  body:has(.cz-desktop-sidebar):has(#rowModsServers) .footer_sitename { font-size: 16px; letter-spacing: -0.04em; }
  body:has(.cz-desktop-sidebar):has(#rowModsServers) .footer_links { grid-column: 2; grid-row: 1; min-width: 0; }
  body:has(.cz-desktop-sidebar):has(#rowModsServers) .footer_links ul { justify-content: flex-end; gap: 10px 18px; }
  body:has(.cz-desktop-sidebar):has(#rowModsServers) .footer_links a { font-size: 11px; }
  body:has(.cz-desktop-sidebar):has(#rowModsServers) .footer-top .social_buttons { display: none; }
  body:has(.cz-desktop-sidebar):has(#rowModsServers) .footer_global > hr { display: none; }
  body:has(.cz-desktop-sidebar):has(#rowModsServers) .footer-description { text-align: start; color: var(--text-custom); font-size: 11px; line-height: 1.7; max-width: 880px; white-space: normal; }
}
@container (max-width: 620px) {
  .cz-header-shortcuts { display: none; }
  .navbar_usermenu .cz-header-account__name { max-inline-size: 12ch; }
  .cz-header-account { gap: 8px; margin-inline-start: 4px; }
}
@container (max-width: 540px) {
  .navbar_usermenu .cz-header-account__arrow { display: none; }
}
@media (min-width: 1025px) and (hover: hover) and (pointer: fine) {
  .cz-header-shortcuts a:hover { color: var(--span); background: color-mix(in oklch, currentColor 10%, transparent); }
  .cz-header-account__avatar:hover, .cz-header-account__arrow:hover { opacity: 0.8; }
  .navbar_usermenu .cz-header-account__topup:hover { background: oklch(0.7 0.2 25); }
  body:has(.cz-desktop-sidebar) .navbar_usermenu:has(.cz-header-account) > button:not(.pay_button):hover { color: var(--span); }
  .cz-desktop-sidebar__link:hover { background: color-mix(in oklch, var(--span) 10%, var(--card)); color: var(--text-default); }
  .cz-desktop-sidebar__link:hover .cz-desktop-sidebar__icon { color: var(--span); }
  .cz-desktop-sidebar__brand:hover { color: var(--span); }
  .cz-desktop-sidebar__community a:hover, .cz-desktop-sidebar__help:hover { background: color-mix(in oklch, var(--span) 12%, var(--card)); color: var(--span); }
}

/* Search stays in its own dialog, clear of the page heading and mode cards. */
#open_search .popup_modal_content { inline-size: min(560px, calc(100% - 32px)); max-block-size: calc(100dvh - 48px); padding: clamp(18px, 4vw, 28px); border: 1px solid color-mix(in oklch, var(--span) 22%, transparent); border-radius: 22px; background: var(--card); overflow-y: auto; overscroll-behavior: contain; }
#open_search .popup_modal_head { padding: 0; font-size: clamp(20px, 3vw, 24px); color: var(--text-default); }
#open_search .popup_modal_close { display: grid; place-items: center; flex: none; inline-size: 44px; block-size: 44px; padding: 12px; border: 0; border-radius: 12px; color: var(--text-custom); background: color-mix(in oklch, var(--span) 9%, transparent); }
#open_search .popup_modal_close svg { inline-size: 20px; block-size: 20px; fill: currentColor; }
#open_search .cz-player-search__hint { margin-block: 4px 20px; color: var(--text-custom); font-size: 14px; line-height: 1.5; }
#open_search .modal-searchcontent { overflow: visible; flex: none; }
#open_search input[type=search] { inline-size: 100%; min-inline-size: 0; block-size: 52px; padding-inline: 16px; border: 1px solid color-mix(in oklch, var(--span) 22%, transparent); border-radius: 12px; background: var(--navbar); color: var(--text-default); font-size: 16px; }
#open_search .modal_users_container { display: none; position: static; margin: 12px 0 0; transform: none; opacity: 1; visibility: visible; }
#open_search:is(.users_found,.users_notfound) .modal_users_container { display: block; }
#open_search .modal_blocks_content { max-block-size: min(392px, 45dvh); padding: 6px; gap: 6px; overflow-y: auto; background: transparent; }
#open_search .modal_users_header { padding: 8px 4px 12px; font-size: 14px; text-align: center; flex-wrap: wrap; }
#open_search .modal_blocks_content a { flex: none; padding: 12px 38px 12px 12px; border-radius: 12px; background: var(--navbar); }
#open_search .modal_user_content { min-inline-size: 0; }
#open_search .modal_blocks_content a h3 { max-inline-size: 100%; font-size: 15px; }
#open_search .modal_blocks_content a p { font-size: 12px; opacity: .75; }
#open_search :is(input,button,a):focus-visible { outline: 2px solid var(--span); outline-offset: 3px; }
#open_search :is(button,a):active { opacity: .7; }
@media (hover: hover) and (pointer: fine) {
  #open_search :is(.popup_modal_close,.modal_blocks_content a):hover { background: color-mix(in oklch, var(--span) 16%, var(--navbar)); }
}

.cz-mobile-search { inline-size: 100%; padding: 12px 16px; border: 1px solid color-mix(in oklch, var(--span) 20%, transparent); border-radius: 12px; color: var(--text-default); background: var(--card); text-align: start; font: inherit; }
@media (min-width: 1025px) { .navbar_usermenu .button-search { display: inline-flex; align-items: center; justify-content: center; } }