.elementor-37 .elementor-element.elementor-element-ce5ba89{--display:flex;}/* Start custom CSS for html, class: .elementor-element-cdcc383 */.betkaka-ew {
    padding-top: 48px;
    /* ── Design Tokens ── */
    --glass-primary: #000c24;
    --glass-neutral: #0d182e;
    --glass-accent: #d80d83;
    --glass-accent-soft: rgba(216, 13, 131, .15);
    --glass-accent-glow: rgba(216, 13, 131, .35);
    --glass-white: #ffffff;
    --glass-text: rgba(255, 255, 255, .95);
    --glass-text-secondary: rgba(255, 255, 255, .55);
    --glass-text-tertiary: rgba(255, 255, 255, .35);
    --glass-border: rgba(255, 255, 255, .08);
    --glass-border-light: rgba(255, 255, 255, .12);
    --glass-border-active: rgba(216, 13, 131, .4);
    --glass-surface-1: rgba(255, 255, 255, .04);
    --glass-surface-2: rgba(255, 255, 255, .06);
    --glass-surface-3: rgba(255, 255, 255, .08);
    --glass-surface-elevated: rgba(13, 24, 46, .65);
    --glass-blur-sm: blur(12px);
    --glass-blur-md: blur(24px);
    --glass-blur-lg: blur(40px);
    --glass-blur-xl: blur(60px);
    --glass-radius-xs: 10px;
    --glass-radius-sm: 14px;
    --glass-radius-md: 18px;
    --glass-radius-lg: 24px;
    --glass-radius-full: 999px;
    --glass-shadow-card: 0 8px 32px -8px rgba(0, 0, 0, .6), 0 2px 8px -2px rgba(0, 0, 0, .3);
    --glass-shadow-elevated: 0 16px 48px -12px rgba(0, 0, 0, .7), 0 4px 12px -4px rgba(0, 0, 0, .4);
    --glass-shadow-glow: 0 0 40px -8px rgba(216, 13, 131, .2);
    --glass-spring: cubic-bezier(.22, 1, .36, 1);
    --glass-smooth: cubic-bezier(.25, .8, .25, 1);
    --glass-ease: cubic-bezier(.4, 0, .2, 1);
    --glass-duration-fast: .18s;
    --glass-duration-normal: .3s;
    --glass-duration-slow: .45s;

    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: var(--glass-text);
    background:
      radial-gradient(ellipse 900px 350px at 50% -5%, rgba(216, 13, 131, .08), transparent 60%),
      radial-gradient(ellipse 600px 300px at 80% 10%, rgba(13, 24, 46, .5), transparent 55%),
      var(--glass-primary);
    border-radius: var(--glass-radius-lg);
    overflow: hidden;
    position: relative;
    isolation: isolate;
  }

  .betkaka-ew *, .betkaka-ew *::before, .betkaka-ew *::after { box-sizing: border-box; }

  /* ── Header ── */
  .page-games-header { width: 100%; margin: 0; position: relative; overflow: hidden; }
  .page-games-header__img-wrap {
    width: 100%;
    aspect-ratio: 21 / 6;
    min-height: 190px;
    background: linear-gradient(135deg, var(--glass-primary), var(--glass-neutral) 50%, #0a0f20 100%);
    border-bottom: 1px solid var(--glass-border);
  }
  .page-games-header__img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    filter: saturate(1.05) contrast(1.02);
  }
  .page-games-header__title-overlay {
    position: absolute;
    inset: auto 0 0;
    padding: 48px 24px 44px;
    background: linear-gradient(to top, rgba(0, 12, 36, .95), rgba(0, 12, 36, .55) 50%, transparent);
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .page-games-header__title {
    font-size: clamp(1.4rem, 3.8vw, 2.4rem);
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--glass-white);
    text-shadow:
      0 0 30px rgba(216, 13, 131, .3),
      0 0 8px rgba(216, 13, 131, .15),
      0 2px 4px rgba(0, 0, 0, .5);
  }

  /* ── Nav Bar ── */
  .page-games-nav {
    width: 100%;
    margin: 0 0 28px;
    padding: 14px 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    background: var(--glass-surface-1);
    border-bottom: 1px solid var(--glass-border);
    -webkit-backdrop-filter: var(--glass-blur-md) saturate(180%);
    backdrop-filter: var(--glass-blur-md) saturate(180%);
  }

  /* ── Category Pills ── */
  .page-games-categories { display: flex; align-items: center; gap: 6px; flex: 1; min-width: 0; flex-wrap: wrap; }

  .page-games-cat {
    appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid var(--glass-border-light);
    color: var(--glass-text-secondary);
    background: var(--glass-surface-1);
    border-radius: var(--glass-radius-full);
    cursor: pointer;
    font-family: inherit;
    font-size: .8rem;
    font-weight: 500;
    letter-spacing: .02em;
    padding: 9px 16px;
    white-space: nowrap;
    -webkit-backdrop-filter: var(--glass-blur-sm) saturate(140%);
    backdrop-filter: var(--glass-blur-sm) saturate(140%);
    transition:
      transform var(--glass-duration-fast) var(--glass-spring),
      background var(--glass-duration-normal) var(--glass-ease),
      border-color var(--glass-duration-normal) var(--glass-ease),
      color var(--glass-duration-normal) var(--glass-ease),
      box-shadow var(--glass-duration-normal) var(--glass-ease);
  }
  .page-games-cat:hover {
    transform: translateY(-1px);
    color: var(--glass-text);
    background: var(--glass-surface-2);
    border-color: rgba(255, 255, 255, .18);
  }
  .page-games-cat:active { transform: scale(.97); }
  .page-games-cat svg {
    width: 15px;
    height: 15px;
    flex-shrink: 0;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .page-games-cat.is-active {
    background: var(--glass-accent-soft);
    border-color: var(--glass-border-active);
    color: var(--glass-white);
    box-shadow: 0 0 0 1px rgba(216, 13, 131, .12) inset, var(--glass-shadow-glow);
  }

  /* ── Drawer Toggle ── */
  #page-games-drawer-toggle { display: none; }
  .page-games-more {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 14px;
    appearance: none;
    border: 1px solid var(--glass-border-light);
    color: var(--glass-text-secondary);
    background: var(--glass-surface-1);
    border-radius: var(--glass-radius-full);
    cursor: pointer;
    font-family: inherit;
    font-size: .8rem;
    font-weight: 500;
    letter-spacing: .02em;
    -webkit-backdrop-filter: var(--glass-blur-sm) saturate(140%);
    backdrop-filter: var(--glass-blur-sm) saturate(140%);
    transition:
      transform var(--glass-duration-fast) var(--glass-spring),
      background var(--glass-duration-normal) var(--glass-ease),
      border-color var(--glass-duration-normal) var(--glass-ease),
      color var(--glass-duration-normal) var(--glass-ease);
  }
  .page-games-more:hover {
    transform: translateY(-1px);
    color: var(--glass-text);
    background: var(--glass-surface-2);
    border-color: rgba(255, 255, 255, .18);
  }
  .page-games-more:active { transform: scale(.97); }
  .page-games-more svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
  }
  .page-games-categories-drawer { display: none; }
  .page-games-drawer-overlay { display: none; }

  /* ── Search ── */
  .page-games-search-wrap { flex-shrink: 0; min-width: 200px; max-width: 320px; }
  .page-games-search {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    height: 42px;
    padding: 0 14px 0 15px;
    border: 1px solid var(--glass-border-light);
    border-radius: var(--glass-radius-full);
    background: var(--glass-surface-1);
    -webkit-backdrop-filter: var(--glass-blur-md) saturate(160%);
    backdrop-filter: var(--glass-blur-md) saturate(160%);
    transition:
      border-color var(--glass-duration-normal) var(--glass-ease),
      box-shadow var(--glass-duration-normal) var(--glass-ease),
      background var(--glass-duration-normal) var(--glass-ease);
  }
  .page-games-search:focus-within {
    border-color: var(--glass-border-active);
    box-shadow: 0 0 0 3px rgba(216, 13, 131, .1), var(--glass-shadow-glow);
    background: var(--glass-surface-2);
  }
  .page-games-search__icon {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--glass-text-tertiary);
    transition: color var(--glass-duration-normal) var(--glass-ease);
  }
  .page-games-search:focus-within .page-games-search__icon { color: var(--glass-accent); }
  .page-games-search__icon svg { width: 18px; height: 18px; fill: currentColor; }
  .page-games-search input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
    color: var(--glass-text);
    font-size: .85rem;
    font-weight: 400;
    letter-spacing: .01em;
    outline: none;
  }
  .page-games-search input::placeholder { color: var(--glass-text-tertiary); }

  /* ── Rules Help (Notification on Hover) ── */
  .page-games-rules-wrap {
    position: relative;
    flex-shrink: 0;
  }
  .page-games-rules-btn {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: var(--glass-radius-full);
    background: var(--glass-surface-1);
    color: var(--glass-text-secondary);
    cursor: pointer;
    -webkit-backdrop-filter: var(--glass-blur-md) saturate(160%);
    backdrop-filter: var(--glass-blur-md) saturate(160%);
    transition: transform var(--glass-duration-fast) var(--glass-spring), background var(--glass-duration-normal) var(--glass-ease), color var(--glass-duration-normal) var(--glass-ease);
  }
  .page-games-rules-wrap:hover .page-games-rules-btn {
    transform: translateY(-1px);
    color: var(--glass-accent);
    background: var(--glass-surface-2);
  }
  .page-games-rules-btn:active { transform: scale(.97); }
  .page-games-rules-btn svg { width: 32px; height: 32px; }

  .page-games-rules-popover {
    position: fixed;
    z-index: 999999;
    min-width: 280px;
    max-width: min(540px, 90vw);
    padding: 0;
    border-radius: 22px;
    border: none;
    background: transparent;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px) scale(0.97);
    transition:
      opacity .25s var(--glass-ease),
      visibility .25s var(--glass-ease),
      transform .35s var(--glass-spring);
    transition-delay: .12s;
    pointer-events: none;
  }
  .page-games-rules-popover.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
  }
  @media (max-width: 768px) {
    .page-games-rules-popover {
      left: 50% !important;
      top: 50% !important;
      transform: translate(-50%, -50%) scale(0.97);
    }
    .page-games-rules-popover.is-visible {
      transform: translate(-50%, -50%) scale(1);
    }
  }
  .page-games-rules-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 999998;
    background: rgba(0, 0, 0, .5);
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
  }
  .page-games-rules-overlay.is-visible {
    display: block;
    opacity: 1;
  }
  .page-games-rules-overlay.is-visible.is-touch {
    pointer-events: auto;
  }
  .page-games-rules-popover img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 20px;
    max-height: 70vh;
    object-fit: contain;
  }

  /* ── Section ── */
  .page-games-section { width: 100%; margin: 0; padding: 0 20px 48px; }
  .page-games-section__title { margin-bottom: 20px; }
  .betkaka-main-h2 {
    text-align: center;
    font-size: clamp(.85rem, 2vw, 1.1rem);
    font-weight: 600;
    margin: 0 0 24px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--glass-text-secondary);
  }

  /* ── Grid ── */
  .page-games-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 16px;
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
  }

  /* ── Card ── */
  .page-games-card {
    display: block;
    text-decoration: none;
    color: inherit;
    overflow: hidden;
    position: relative;
    border-radius: var(--glass-radius-lg);
    border: 1px solid var(--glass-border);
    background:
      linear-gradient(168deg, var(--glass-surface-3), var(--glass-surface-1) 50%, rgba(216, 13, 131, .03)),
      var(--glass-surface-elevated);
    -webkit-backdrop-filter: var(--glass-blur-md) saturate(170%);
    backdrop-filter: var(--glass-blur-md) saturate(170%);
    box-shadow: var(--glass-shadow-card);
    transition:
      transform var(--glass-duration-slow) var(--glass-spring),
      border-color var(--glass-duration-normal) var(--glass-ease),
      box-shadow var(--glass-duration-slow) var(--glass-smooth);
    will-change: transform;
    isolation: isolate;
  }

  .page-games-card::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    border-radius: inherit;
    background: linear-gradient(135deg, transparent 30%, rgba(255, 255, 255, .08) 50%, transparent 70%);
    transform: translateX(-150%);
    transition: transform .8s var(--glass-spring);
    pointer-events: none;
  }

  .page-games-card::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .12) 30%, rgba(255, 255, 255, .12) 70%, transparent);
    z-index: 2;
    border-radius: inherit;
    pointer-events: none;
  }

  .page-games-card:hover {
    transform: translateY(-6px) scale(1.015);
    border-color: rgba(216, 13, 131, .25);
    box-shadow:
      var(--glass-shadow-elevated),
      0 0 0 1px rgba(216, 13, 131, .08) inset,
      var(--glass-shadow-glow);
  }
  .page-games-card:hover::before { transform: translateX(150%); }
  .page-games-card:active { transform: translateY(-2px) scale(1.005); }

  /* ── Golden Featured Card ── */
  .page-games-card--golden {
    border: 1px solid rgba(212, 175, 55, .55);
    background:
      linear-gradient(168deg, rgba(255, 223, 80, .18), rgba(212, 175, 55, .1) 45%, rgba(184, 134, 11, .06)),
      linear-gradient(180deg, rgba(28, 24, 10, .92), rgba(18, 15, 6, .96));
    box-shadow:
      0 10px 36px -10px rgba(0, 0, 0, .65),
      0 0 0 1px rgba(255, 215, 0, .2) inset,
      0 0 48px -16px rgba(255, 215, 0, .3),
      inset 0 1px 0 rgba(255, 255, 255, .1);
  }
  .page-games-card--golden::before {
    background: linear-gradient(115deg, transparent 25%, rgba(255, 223, 80, .3) 45%, transparent 65%);
  }
  .page-games-card--golden::after {
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(255, 215, 0, .5) 20%, rgba(255, 223, 80, .7) 50%, rgba(255, 215, 0, .5) 80%, transparent);
  }
  .page-games-card--golden:hover {
    border-color: rgba(255, 223, 80, .7);
    box-shadow:
      0 18px 48px -14px rgba(0, 0, 0, .75),
      0 0 0 1px rgba(255, 215, 0, .3) inset,
      0 0 64px -12px rgba(255, 215, 0, .4),
      inset 0 1px 0 rgba(255, 255, 255, .14);
  }
  .page-games-card--golden .page-games-card__thumb::after {
    background: linear-gradient(to top, rgba(18, 15, 6, .85), transparent);
  }
  .page-games-card--golden .page-games-card__info {
    background: linear-gradient(to bottom, rgba(255, 215, 0, .045), rgba(212, 175, 55, .03));
    border-top-color: rgba(255, 215, 0, .25);
  }
  .page-games-card--golden .page-games-card__icon {
    background: linear-gradient(145deg, rgba(255, 223, 80, .25), rgba(184, 134, 11, .15));
    border-color: rgba(255, 215, 0, .4);
    color: #ffd700;
    box-shadow: 0 4px 20px -6px rgba(255, 215, 0, .45);
  }
  .page-games-card--golden .page-games-card__name {
    color: #fff5b0;
    text-shadow: 0 0 24px rgba(255, 215, 0, .35);
  }
  .page-games-card--golden .page-games-card__badge {
    background: linear-gradient(135deg, #ffd700, #f0c040, #daa520);
    border-color: rgba(255, 255, 255, .45);
    color: #1a1608;
    font-weight: 800;
    box-shadow: 0 4px 20px -4px rgba(255, 215, 0, .65), 0 0 0 1px rgba(255, 255, 255, .2) inset;
  }
  /* ── Card Thumb ── */
  .page-games-card__thumb {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 0;
    padding-bottom: 54%;
    overflow: hidden;
    background: rgba(0, 0, 0, .2);
  }
  .page-games-card__thumb::after {
    content: '';
    position: absolute;
    inset: auto 0 0;
    height: 60%;
    background: linear-gradient(to top, var(--glass-surface-elevated), transparent);
    z-index: 1;
    pointer-events: none;
  }
  .page-games-card__thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    transition:
      transform var(--glass-duration-slow) var(--glass-spring),
      filter var(--glass-duration-normal) var(--glass-ease);
  }
  .page-games-card:hover .page-games-card__thumb img {
    transform: scale(1.04);
    filter: brightness(1.05) saturate(1.08);
  }

  /* ── Card Badge ── */
  .page-games-card__badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 2;
    padding: 4px 10px;
    border-radius: var(--glass-radius-full);
    font-size: .6rem;
    font-weight: 700;
    letter-spacing: .08em;
    color: var(--glass-white);
    background: var(--glass-accent);
    border: 1px solid rgba(255, 255, 255, .2);
    box-shadow: 0 4px 16px -4px rgba(216, 13, 131, .5);
  }

  /* ── Card Info ── */
  .page-games-card__info {
    position: relative;
    z-index: 1;
    padding: 14px 16px 16px;
    display: grid;
    grid-template-columns: 32px 1fr;
    grid-template-rows: auto auto;
    gap: 5px 10px;
    align-items: center;
    background: linear-gradient(to bottom, rgba(255, 255, 255, .02), rgba(255, 255, 255, .04));
    border-top: 1px solid var(--glass-border);
  }
  .page-games-card__icon {
    grid-column: 1;
    grid-row: 1;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    border-radius: var(--glass-radius-xs);
    background: var(--glass-surface-2);
    border: 1px solid var(--glass-border-light);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--glass-text-secondary);
    box-shadow: 0 2px 8px -4px rgba(0, 0, 0, .4);
    transition: color var(--glass-duration-normal) var(--glass-ease);
  }
  .page-games-card:hover .page-games-card__icon { color: var(--glass-accent); }
  .page-games-card__icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .page-games-card__name {
    font-size: .84rem;
    font-weight: 600;
    letter-spacing: .02em;
    color: var(--glass-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
  }
  .page-games-card__meta {
    font-size: .72rem;
    font-weight: 400;
    letter-spacing: .01em;
    line-height: 1.45;
    color: var(--glass-text-tertiary);
    grid-column: 1 / -1;
    grid-row: 2;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* ── Responsive: Tablet ── */
  @media (max-width: 1024px) {
    .page-games-grid { grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
  }

  /* ── Responsive: Mobile ── */
  @media (max-width: 768px) {
    .betkaka-ew { padding-top: 36px; }
    .page-games-nav {
      flex-direction: row;
      flex-wrap: wrap;
      align-items: center;
      padding: 10px 12px;
      gap: 8px;
      position: relative;
    }
    #page-games-drawer-toggle { display: flex; }
    .page-games-categories { display: none; }
    .page-games-search-wrap { flex: 1; min-width: 0; order: 1; max-width: none; }
    .page-games-search { max-width: none; height: 40px; }
    .page-games-more {
      order: 2;
      flex-shrink: 0;
      padding: 9px 12px;
      min-width: 40px;
      min-height: 40px;
      justify-content: center;
    }
    .page-games-more .page-games-more__label { display: none; }
    .page-games-section { padding: 0 12px 32px; }
    .page-games-header { margin-bottom: 0; }
    .page-games-header__img-wrap {
      aspect-ratio: 16 / 6;
      min-height: 130px;
      margin-bottom: 0;
      border-radius: 0;
    }
    .page-games-header__img-wrap img { object-fit: cover; }
    .page-games-nav { margin-top: 0; padding-top: 10px; border-top: none; }
    .page-games-header__title-overlay { display: none; }
    .page-games-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
      align-items: stretch;
    }
    .page-games-grid > li { display: flex; min-height: 0; }
    .page-games-grid .page-games-card {
      flex: 1;
      min-width: 0;
      height: 100%;
      display: flex;
      flex-direction: column;
      border-radius: var(--glass-radius-md);
    }
    .page-games-card__info {
      flex: 1;
      min-height: 64px;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      justify-content: center;
      gap: 4px;
      padding: 10px 8px 12px;
    }
    .page-games-card__name {
      white-space: normal;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis;
      line-clamp: 2;
      order: 1;
      font-size: .78rem;
    }
    .page-games-card__meta { order: 2; padding-right: 0; -webkit-line-clamp: 2; font-size: .65rem; }
    .page-games-card__icon {
      order: 3;
      width: 26px;
      height: 26px;
      margin-top: 4px;
      border-radius: 8px;
    }
    .page-games-card__icon svg { width: 14px; height: 14px; }

    /* Drawer */
    .page-games-categories-drawer {
      display: block;
      position: fixed;
      inset: 0;
      z-index: 9999;
      pointer-events: none;
      opacity: 0;
      transition: opacity var(--glass-duration-normal) var(--glass-ease);
    }
    .page-games-categories-drawer.is-open { pointer-events: auto; opacity: 1; }
    .page-games-drawer-overlay {
      display: block;
      position: fixed;
      inset: 0;
      background: rgba(0, 8, 20, .55);
      -webkit-backdrop-filter: var(--glass-blur-sm) saturate(120%);
      backdrop-filter: var(--glass-blur-sm) saturate(120%);
      cursor: pointer;
    }
    .page-games-drawer-panel {
      position: fixed;
      bottom: 0;
      left: 0;
      right: 0;
      max-height: 70vh;
      overflow-y: auto;
      background:
        linear-gradient(180deg, rgba(13, 24, 46, .92), rgba(0, 12, 36, .96));
      -webkit-backdrop-filter: var(--glass-blur-xl) saturate(180%);
      backdrop-filter: var(--glass-blur-xl) saturate(180%);
      border-top-left-radius: var(--glass-radius-lg);
      border-top-right-radius: var(--glass-radius-lg);
      border: 1px solid var(--glass-border-light);
      border-bottom: none;
      padding: 20px 16px 32px;
      transform: translateY(100%);
      transition: transform var(--glass-duration-slow) var(--glass-spring);
      box-shadow: 0 -16px 48px rgba(0, 0, 0, .4);
    }
    .page-games-drawer-panel::before {
      content: '';
      display: block;
      width: 36px;
      height: 4px;
      border-radius: 2px;
      background: rgba(255, 255, 255, .15);
      margin: 0 auto 16px;
    }
    .page-games-categories-drawer.is-open .page-games-drawer-panel { transform: translateY(0); }
    .page-games-categories-drawer.is-open { overflow-y: auto; -webkit-overflow-scrolling: touch; }
    .page-games-drawer-title {
      margin: 0 0 14px;
      font-size: .7rem;
      font-weight: 600;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--glass-text-tertiary);
    }
    .page-games-drawer-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 8px;
    }
    .page-games-drawer-grid .page-games-cat {
      width: 100%;
      justify-content: center;
      padding: 11px 14px;
      font-size: .8rem;
      display: flex;
    }
  }

  @media (min-width: 769px) {
    #page-games-drawer-toggle { display: none; }
    .page-games-categories { order: 1; }
    .page-games-search-wrap { order: 2; }
  }

  @media (max-width: 480px) {
    .page-games-grid { gap: 8px; }
    .page-games-card { border-radius: var(--glass-radius-sm); }
    .page-games-card__badge { top: 8px; left: 8px; font-size: .55rem; padding: 3px 8px; }
  }/* End custom CSS */