/* Shared flow dimensions. The mobile overrides match the reference's page
   sequence while keeping JJ's own colour, cards, and typography. */
.topbar .search{flex:1;max-width:260px;margin:0}
.category-heading{display:flex;align-items:center;gap:16px;min-height:86px}
.category-heading a{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#edf3ff;color:#2f52ac;font-size:22px}
.category-heading h1{font:800 30px/1.1 Outfit,sans-serif;letter-spacing:-.04em;margin:0}
.ad-space--top{width:100%;max-width:400px;margin:14px auto;min-height:294px;padding:0;gap:5px;justify-content:flex-start}
.ad-space--top ins{display:block;width:100%;max-width:100%}
.ad-space[hidden]{display:none!important}

@media(max-width:700px){
  .catalog-page[data-page="home"] .topbar__inner{min-height:62px;height:62px;padding:7px 12px;gap:10px}
  .catalog-page[data-page="home"] .brand>span:last-child{display:none}
  .catalog-page[data-page="home"] .brand__mark{width:38px;height:38px}
  .catalog-page[data-page="home"] .topbar nav{display:none}
  .catalog-page[data-page="home"] .topbar .search{height:44px;max-width:none;min-width:0;margin:0}
  .catalog-page .site-main__inner{padding:0 12px 40px}
  .catalog-page[data-page="home"] .ad-space--top{margin:0 -12px 10px;width:calc(100% + 24px);max-width:none;min-height:294px;padding:0;gap:5px}
  .catalog-page[data-page="home"] .ad-space--top>span{height:9px;line-height:9px}
  .catalog-page[data-page="home"] .points{min-height:0;border-radius:15px;padding:14px 16px;gap:8px}
  .catalog-page[data-page="home"] .points strong{font-size:27px;margin:0}
  .catalog-page[data-page="home"] .points p{font-size:11px}
  .catalog-page[data-page="home"] .points .primary-button{min-height:48px}
  .catalog-page[data-page="home"] .section-title{margin:9px 0 7px}
  .catalog-page[data-page="home"] .section-title h2{font-size:21px;margin:0}
  .catalog-page[data-page="home"] .categories{gap:8px}
  .catalog-page[data-page="home"] .category-chip{min-height:46px}
  .catalog-page[data-page="home"] .section-title--games{margin:12px 0 8px}
  .catalog-page:not([data-page="home"]) .topbar{display:none}
  .catalog-page:not([data-page="home"]) .category-heading{height:86px;min-height:86px}
  .catalog-page:not([data-page="home"]) .category-heading h1{font-size:30px}
  .catalog-page:not([data-page="home"]) .ad-space--top{margin:0 -12px 12px;width:calc(100% + 24px);max-width:none;min-height:294px;padding:0;gap:5px}
  .catalog-page:not([data-page="home"]) .ad-space--top>span{height:9px;line-height:9px}
  .catalog-page:not([data-page="home"]) .game-list{margin-top:0}
}

@media(max-width:340px){
  .catalog-page .site-main__inner{padding-left:10px;padding-right:10px}
  .catalog-page .ad-space--top{margin-left:-10px!important;margin-right:-10px!important;width:calc(100% + 20px)!important;max-width:none!important}
  .category-heading h1{font-size:26px!important}
}

/* Keep the reward choice clear and the category step visually grouped. */
.catalog-page[data-page="home"] .category-panel{margin:12px 0 10px;padding:14px;border:1px solid #e2e9f4;border-radius:18px;background:#fff;box-shadow:0 4px 16px #1b2c560a}
.category-panel .section-title{margin:0 0 12px}
.category-panel .section-title h2{font-size:20px;line-height:1.2}
.catalog-page[data-page="home"] .category-chip{position:relative;display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:9px;min-height:58px;padding:10px 12px;text-align:left;color:#1e2b45;border-width:1px;border-style:solid;box-shadow:0 5px 0 #dce4f1,0 9px 18px #22345c12;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease}
.catalog-page[data-page="home"] .category-chip__icon{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:#eef2f8;color:#40516d;font-size:17px;line-height:1}
.catalog-page[data-page="home"] .category-chip__arrow{color:#71809a;font-size:23px;line-height:1;transition:transform .16s ease}
.catalog-page[data-page="home"] .category-chip:nth-child(2){border-color:#b9d1ff;background:linear-gradient(145deg,#f8fbff,#eaf2ff);box-shadow:0 5px 0 #b7cdf5,0 10px 20px #2f6fd51c}
.catalog-page[data-page="home"] .category-chip:nth-child(2) .category-chip__icon{background:#dce9ff;color:#215fc8}
.catalog-page[data-page="home"] .category-chip:nth-child(3){border-color:#d7c4ff;background:linear-gradient(145deg,#fcfaff,#f1ebff);box-shadow:0 5px 0 #cab7ef,0 10px 20px #744cc81a}
.catalog-page[data-page="home"] .category-chip:nth-child(3) .category-chip__icon{background:#e9dfff;color:#6740b4}
.catalog-page[data-page="home"] .category-chip:hover{transform:translateY(-2px);box-shadow:0 7px 0 #c6d4e9,0 13px 24px #22345c1c}
.catalog-page[data-page="home"] .category-chip:nth-child(2):hover{box-shadow:0 7px 0 #a9c3ef,0 13px 25px #2f6fd526}
.catalog-page[data-page="home"] .category-chip:nth-child(3):hover{box-shadow:0 7px 0 #bca6e5,0 13px 25px #744cc824}
.catalog-page[data-page="home"] .category-chip:hover .category-chip__arrow{transform:translateX(2px)}
.catalog-page[data-page="home"] .category-chip:active{transform:translateY(3px);box-shadow:0 2px 0 #c6d4e9,0 4px 10px #22345c12}
.catalog-page[data-page="home"] .category-chip:focus-visible{outline:3px solid #86aef8;outline-offset:3px}
.catalog-page[data-page="home"] .points .primary-button,.gate .primary-button{background:linear-gradient(135deg,#2464d5,#3683ef);color:#fff;box-shadow:0 4px 0 #1b54bf,0 8px 16px #2464d526;font-size:14px;letter-spacing:.01em}
.catalog-page[data-page="home"] .points .primary-button:hover,.gate .primary-button:hover{box-shadow:0 6px 0 #1b54bf,0 10px 20px #2464d526}
.catalog-page[data-page="home"] .points p{line-height:1.4}
.gate{max-height:calc(100dvh - 32px);overflow:auto;padding:25px 24px}
.gate[open]{overscroll-behavior:contain}
body:has(.gate[open]){overflow:hidden}
.gate__icon{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 8px;border-radius:15px;background:#edf3ff;color:#2d6cdf;font-size:27px}
.gate h2{font-size:28px}
.gate .primary-button{min-height:52px}
.gate .quiet-button{min-height:44px;padding:10px 16px;font-size:13px}
.gate .gate__status:empty{min-height:0;margin:0}

@media(max-width:700px){
  .catalog-page[data-page="home"] .points{min-height:0;padding:14px 16px;gap:8px}
  .catalog-page[data-page="home"] .points .primary-button{min-height:48px;width:100%;font-size:14px}
  .catalog-page[data-page="home"] .section-title--games{margin-top:17px}
  .catalog-page[data-page="home"] .categories .category-chip:first-child{display:none}
  .catalog-page[data-page="home"] .category-chip{grid-template-columns:34px minmax(0,1fr) auto;min-height:58px;padding:9px 10px;font-size:13px}
  .catalog-page[data-page="home"] .category-chip__icon{width:32px;height:32px;border-radius:10px;font-size:16px}
  .game-card__end small{font-size:10px}
  .game-card__end small b{font-size:12px}
}
@media(prefers-reduced-motion:reduce){
  .catalog-page[data-page="home"] .category-chip,.catalog-page[data-page="home"] .category-chip__arrow{transition:none}
}
@media(max-width:340px){
  .catalog-page[data-page="home"] .category-panel{padding:13px}
  .catalog-page[data-page="home"] .points .primary-button{font-size:13px}
}