/* v8: never flash stale server-rendered cards before live API catalog arrives */
.catalog-section#games > .game-grid{display:none!important}
.sgr-catalog-loading-grid{min-height:420px}
.sgr-catalog-skeleton{border:1px solid #6c4a5530;border-radius:22px;padding:14px;background:#fff9f6;min-height:390px;overflow:hidden}
.sgr-skeleton-cover,.sgr-skeleton-line,.sgr-skeleton-pill{background:linear-gradient(90deg,#eadfe0 25%,#f7eff0 37%,#eadfe0 63%);background-size:400% 100%;animation:sgr-skeleton 1.25s ease-in-out infinite}
.sgr-skeleton-cover{aspect-ratio:16/9;border-radius:14px;margin-bottom:16px}
.sgr-skeleton-line{height:19px;border-radius:9px;margin:10px 2px}
.sgr-skeleton-line.short{width:62%}
.sgr-skeleton-line.tiny{width:42%;height:14px}
.sgr-skeleton-pills{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:20px}
.sgr-skeleton-pill{height:42px;border-radius:12px}
.sgr-catalog-error{grid-column:1/-1;color:#755f67;border:1px dashed #6c4a5538;border-radius:18px;padding:32px;text-align:center;background:#fff9f6}
@keyframes sgr-skeleton{0%{background-position:100% 0}100%{background-position:0 0}}
/* Secret Game Room catalog v6 — cards aligned with the desktop app reference */
.sgr-original-grid-hidden{display:none!important}
.sgr-game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.sgr-game-card{--card:#0b2b20;--card-border:#315e4e;--accent:#3f9d73;--accent2:#62c295;color:#f7f7f2;background:var(--card);border:1px solid var(--card-border);border-radius:22px;min-width:0;overflow:hidden;box-shadow:0 18px 44px #43172518;transition:transform .22s ease,box-shadow .22s ease}
.sgr-card-theme-1{--card:#2c2024;--card-border:#634850;--accent:#ef82aa;--accent2:#ffabd0}
.sgr-card-theme-2{--card:#16182b;--card-border:#444d78;--accent:#7762b2;--accent2:#a38ee1}
.sgr-game-card:hover{transform:translateY(-4px);box-shadow:0 25px 55px #3410182b}
.sgr-card-main{appearance:none;text-align:left;color:inherit;background:transparent;border:0;width:100%;padding:0;display:block;cursor:pointer;font:inherit}
.sgr-card-cover{aspect-ratio:16/9;border-radius:16px;margin:12px 12px 0;overflow:hidden;background:#09110e;position:relative}
.sgr-card-cover img{width:100%;height:100%;display:block;object-fit:cover}
.sgr-game-type-badge{position:absolute;z-index:2;top:11px;left:11px;display:inline-flex;align-items:center;max-width:calc(100% - 22px);min-height:29px;padding:6px 10px;border:1px solid #ffffff38;border-radius:999px;color:#fff;background:#07100dcc;box-shadow:0 5px 18px #0004;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);font-size:11px;font-weight:850;line-height:1;letter-spacing:.035em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sgr-game-type-badge--detail{top:13px;left:13px;min-height:31px;padding:7px 11px;font-size:12px}
.sgr-card-cover-placeholder{width:100%;height:100%;display:grid;place-items:center;font-size:42px;font-weight:850;color:#fff4}
.sgr-card-copy{padding:20px 20px 14px}
.sgr-game-card h3{color:#fff;letter-spacing:-.045em;margin:0;font-size:clamp(23px,2vw,30px);line-height:1.08;min-height:2.16em}
.sgr-game-card .sgr-card-copy>p{color:#b5c6bf;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:3.2em;margin:18px 0 20px;font-size:16px;line-height:1.55}
.sgr-card-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;border-top:1px solid #ffffff17;padding-top:16px}
.sgr-card-facts>div{min-width:0;text-align:center}
.sgr-card-facts small{color:#aebcb6;display:block;margin-bottom:7px;font-size:12px;font-weight:750;line-height:1.15}
.sgr-card-facts strong{color:#f8f8f3;font-size:15px;font-weight:820;line-height:1.15;white-space:nowrap}
.sgr-card-facts .sgr-difficulty{display:inline-flex;justify-content:center;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.sgr-card-bottom{border-top:1px solid #ffffff17;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:12px 16px;padding:15px 20px 19px}
.sgr-card-author{min-width:0;color:#f7f7f2;font-size:14px;font-weight:400;line-height:1.25}
.sgr-author-inline{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:inherit;font:inherit}
.sgr-author-inline a{color:inherit;font:inherit;text-decoration:none}
.sgr-author-inline a:hover{text-decoration:underline;text-underline-offset:3px}
.sgr-creator-empty{color:#91a098;font-size:14px;font-weight:760}
.sgr-card-price{font-size:21px;line-height:1.1;white-space:nowrap}
.sgr-card-more{grid-column:1/-1;color:#fff;background:var(--accent);border:1px solid var(--accent2);border-radius:13px;display:flex;align-items:center;justify-content:center;gap:9px;width:100%;height:48px;font-size:16px;font-weight:820;cursor:pointer;transition:filter .18s,transform .18s}
.sgr-card-more:hover{filter:brightness(1.08)}.sgr-card-more:active{transform:translateY(1px)}
.sgr-catalog-empty{grid-column:1/-1;color:#755f67;border:1px dashed #6c4a5538;border-radius:18px;padding:32px;text-align:center}

.sgr-modal-open{overflow:hidden}
.sgr-detail-overlay[hidden]{display:none}.sgr-detail-overlay{position:fixed;z-index:9999;inset:0;display:grid;place-items:center;padding:28px}
.sgr-detail-backdrop{position:absolute;inset:0;background:#050708d9;backdrop-filter:blur(10px)}
.sgr-detail-shell{position:relative;color:#f5fbf7;background:linear-gradient(135deg,#061812,#0c2f23 78%);border:1px solid #7e6938aa;border-radius:20px;width:min(1440px,96vw);max-height:92vh;overflow:auto;padding:24px;box-shadow:0 45px 110px #0009}
.sgr-detail-close{position:sticky;z-index:3;top:0;float:right;color:#fff;background:#0b0b0bd9;border:1px solid #ffffff30;border-radius:999px;width:42px;height:42px;padding:0;display:grid;place-items:center;cursor:pointer}.sgr-detail-close svg{display:block;width:19px;height:19px;overflow:visible}.sgr-detail-close path{fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round}
.sgr-detail-title{clear:both;color:#fff;letter-spacing:-.045em;margin:0 54px 24px 0;font-size:clamp(38px,4vw,62px);line-height:1}
.sgr-detail-panel{background:transparent;border:0;border-radius:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(480px,.98fr);gap:22px;padding:0}
.sgr-detail-left,.sgr-detail-right{min-width:0}
.sgr-detail-cover{position:relative;aspect-ratio:16/9;border:1px solid #8a724f7d;border-radius:16px;overflow:hidden;background:#07110d}
.sgr-detail-cover img{width:100%;height:100%;display:block;object-fit:cover}
.sgr-detail-description h3,.sgr-rounds h3{color:#f5faf6;letter-spacing:-.035em;margin:20px 0 9px;font-size:27px}
.sgr-detail-description h3{color:#3f9d73;font-size:20px}
.sgr-detail-description p{color:#eef4f0;margin:0;font-size:18px;font-weight:650;line-height:1.5}
.sgr-detail-commerce{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:16px;border-top:1px solid #ffffff19;margin-top:20px;padding-top:13px}.sgr-detail-author{display:flex;align-items:baseline;gap:6px;min-width:0;color:#fff;font-size:16px;font-weight:400;line-height:1.3}.sgr-detail-author-prefix{color:#9db0a7;font-weight:400;white-space:nowrap}.sgr-detail-author-name{min-width:0;font:inherit;font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sgr-detail-author a,.sgr-detail-author-name>span{color:inherit;font:inherit;font-weight:400}.sgr-detail-author a{text-decoration:none}.sgr-detail-author a:hover{text-decoration:underline;text-underline-offset:3px}.sgr-detail-price{display:grid;gap:4px;text-align:right}.sgr-detail-price small{color:#9db0a7;font-size:12px;font-weight:720}.sgr-detail-price strong{font-size:28px}
.sgr-purchase-options{margin-top:12px;padding-top:13px;border-top:1px solid color-mix(in srgb,var(--theme-outline,#315347) 58%,transparent)}.sgr-purchase-options.is-open{animation:sgr-purchase-reveal .22s ease-out both}.sgr-purchase-prompt{display:grid;gap:3px;margin:0 0 13px;color:var(--theme-text,#fff);font-size:14px;line-height:1.45}.sgr-purchase-prompt strong{font-size:15px}.sgr-detail-consents{display:grid;gap:12px;margin-top:0}.sgr-detail-consent{color:#bac8c1;display:flex;align-items:flex-start;gap:12px;margin:0;font-size:15px;line-height:1.5}.sgr-detail-consent input{accent-color:#3f9d73;width:22px;height:22px;margin:1px 0 0;flex:0 0 22px;cursor:pointer}.sgr-detail-consent span{min-width:0}.sgr-detail-consent a{color:#fff;text-decoration:underline;text-underline-offset:2px}.sgr-detail-consent--optional{color:#aebdb6}.sgr-required-star{color:#ff5b67;font:inherit;font-weight:850;margin-left:2px}
.sgr-buy-button{color:#fff;background:#2f865f;border:1px solid #60bc91;border-radius:14px;width:100%;height:58px;margin-top:13px;font-size:20px;font-weight:850;cursor:pointer}.sgr-buy-button:disabled{opacity:.55;cursor:wait}.sgr-buy-status{color:#ffacb9;min-height:0;margin:8px 0 0;font-size:12px;line-height:1.45}
.sgr-detail-facts{border:1px solid #315347;border-radius:14px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding:12px}
.sgr-detail-facts>div{text-align:center;min-width:0;padding:4px 5px}.sgr-detail-facts small{color:#d1ddd7;display:block;margin-bottom:9px;font-size:12px;font-weight:760}.sgr-detail-facts strong{color:#fff;font-size:18px;font-weight:850;white-space:nowrap}.sgr-difficulty-pill{color:#7f2028!important;background:#ffd0d4;border-radius:999px;display:inline-block;padding:7px 13px;font-size:14px!important}
.sgr-rounds h3{margin-top:22px}.sgr-round-row{border:1px solid #315347;border-radius:11px;display:grid;grid-template-columns:125px minmax(0,1fr) 120px;align-items:center;gap:14px;margin-top:9px;padding:10px 13px;font-size:15px}.sgr-round-row strong{font-size:17px}.sgr-round-row span{font-weight:720}.sgr-round-row b{color:#c9d7d0;text-align:right;font-size:14px;white-space:nowrap}.sgr-no-rounds{color:#9fb1a8;border:1px dashed #315347;border-radius:12px;padding:18px}
.sgr-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.sgr-tags span{color:#b7c5be;background:#0a241b;border-radius:999px;padding:7px 11px;font-size:12px;font-weight:720}
.sgr-detail-loading{min-height:380px;display:grid;place-items:center;color:#b7c6bf;font-size:17px}

@media(max-width:1080px){.sgr-game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sgr-detail-panel{grid-template-columns:1fr}.sgr-detail-facts{grid-template-columns:repeat(5,minmax(90px,1fr));overflow-x:auto}}
@media(max-width:720px){.sgr-game-grid{grid-template-columns:1fr}.sgr-game-card h3{min-height:auto}.sgr-detail-overlay{padding:8px}.sgr-detail-shell{width:100%;max-height:96vh;border-radius:16px;padding:14px}.sgr-detail-panel{gap:16px;padding:0}.sgr-detail-title{font-size:34px}.sgr-detail-facts{grid-template-columns:repeat(2,1fr);overflow:visible}.sgr-round-row{grid-template-columns:90px 1fr}.sgr-round-row b{grid-column:2;text-align:left}.sgr-card-facts small{font-size:11px}.sgr-card-facts strong{font-size:14px}}
@media(max-width:430px){.sgr-detail-commerce{grid-template-columns:1fr;gap:12px}.sgr-detail-price{text-align:left}}

/* v9: first six cards come from static Yandex-hosted catalog preview; the rest load on demand */
.sgr-catalog-controls{display:flex;justify-content:center;margin:28px 0 2px}
.sgr-catalog-controls[hidden]{display:none}
.sgr-load-more{appearance:none;border:1px solid #7e4f5f;background:#fff7f4;color:#5f263d;border-radius:999px;min-width:210px;height:52px;padding:0 28px;font:inherit;font-size:16px;font-weight:820;cursor:pointer;box-shadow:0 10px 28px #5d173116;transition:transform .18s ease,background .18s ease,box-shadow .18s ease}
.sgr-load-more:hover{background:#fff0ee;transform:translateY(-1px);box-shadow:0 14px 32px #5d173123}
.sgr-load-more:disabled{opacity:.58;cursor:wait;transform:none}

.sgr-detail-hero{overflow:hidden;margin:0 0 18px;border-radius:20px;background:#111}.sgr-detail-hero img{display:block;width:100%;max-height:360px;object-fit:cover}

/* v18.4: landing catalogue is a single horizontal rail */
#games[data-sgr-layout="strip"] .sgr-game-grid{
  display:flex;
  grid-template-columns:none;
  gap:22px;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x proximity;
  scroll-behavior:smooth;
  overscroll-behavior-inline:contain;
  padding:4px 2px 18px;
  scrollbar-width:thin;
  scrollbar-color:#9a6879 transparent;
}
#games[data-sgr-layout="strip"] .sgr-game-grid::-webkit-scrollbar{height:8px}
#games[data-sgr-layout="strip"] .sgr-game-grid::-webkit-scrollbar-track{background:transparent}
#games[data-sgr-layout="strip"] .sgr-game-grid::-webkit-scrollbar-thumb{background:#9a6879;border-radius:999px}
#games[data-sgr-layout="strip"] .sgr-game-card,
#games[data-sgr-layout="strip"] .sgr-catalog-skeleton{
  flex:0 0 clamp(330px,33vw,430px);
  width:clamp(330px,33vw,430px);
  scroll-snap-align:start;
}
#games[data-sgr-layout="strip"] .sgr-catalog-empty{flex:1 0 100%}

/* v18.5: compact one-line full catalogue toolbar */
.sgr-catalog-toolbar{display:grid;gap:10px;margin:0 0 28px}
.sgr-filter-bar{display:grid;grid-template-columns:minmax(220px,1.55fr) minmax(138px,.82fr) minmax(126px,.72fr) minmax(126px,.72fr) minmax(168px,.95fr) minmax(184px,1fr) 88px;gap:8px;align-items:center}
.sgr-search-wrap,.sgr-sort-wrap{position:relative;display:flex;align-items:center;min-width:0}
.sgr-search-wrap>svg{position:absolute;left:13px;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;color:#8e7a82;pointer-events:none}
.sgr-filter-search,.sgr-filter-bar select,.sgr-filter-reset{width:100%;min-width:0;height:46px;border:1px solid #604450;border-radius:13px;background-color:#1b1216;color:#eadfe3;font:inherit;font-size:13px;font-weight:720;outline:none}
.sgr-filter-search{padding:0 13px 0 40px;font-weight:650}
.sgr-filter-search::placeholder{color:#8e7a82}
.sgr-filter-search:focus,.sgr-filter-bar select:focus{border-color:#ef82aa;box-shadow:0 0 0 3px #ef82aa17}
.sgr-filter-bar select{appearance:none;-webkit-appearance:none;padding:0 38px 0 13px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239e8992' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;background-size:16px}
.sgr-sort-wrap .sgr-sort-icon{position:absolute;left:12px;width:18px;height:18px;fill:none;stroke:#efb1c9;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;z-index:1}
.sgr-sort-wrap select{padding-left:38px;background-color:#24151c;border-color:#795062}
.sgr-filter-reset{cursor:pointer;background:#2a1a21;color:#efb1c9;padding:0 12px}
.sgr-filter-reset:hover{background:#342029}
.sgr-result-count{margin:0;color:#9e8992;font-size:13px;font-weight:700}
@media(max-width:1120px){.sgr-filter-bar{grid-template-columns:minmax(230px,1.4fr) repeat(3,minmax(135px,1fr));}.sgr-filter-players,.sgr-sort-wrap,.sgr-filter-reset{grid-row:2}.sgr-filter-players{grid-column:1/2}.sgr-sort-wrap{grid-column:2/4}.sgr-filter-reset{grid-column:4/5}}
@media(max-width:720px){
  #games[data-sgr-layout="strip"] .sgr-game-card,#games[data-sgr-layout="strip"] .sgr-catalog-skeleton{flex-basis:86vw;width:86vw;max-width:390px}
  .sgr-filter-bar{display:flex;overflow-x:auto;padding:0 0 6px;scrollbar-width:none;align-items:center}
  .sgr-filter-bar::-webkit-scrollbar{display:none}
  .sgr-search-wrap{flex:0 0 205px}
  .sgr-filter-bar>select{flex:0 0 158px}
  .sgr-filter-players{min-width:188px}
  .sgr-sort-wrap{flex:0 0 186px}
  .sgr-filter-reset{flex:0 0 88px}
}


/* v18.6: native game theme palettes + clearer sort amount icon */
.sgr-game-card{color:var(--card-text,#f7f7f2);background:var(--card,#0b2b20);border-color:var(--card-border,#315e4e)}
.sgr-game-card h3,.sgr-card-facts strong,.sgr-card-author,.sgr-card-price{color:var(--card-text,#f7f7f2)}
.sgr-game-card .sgr-card-copy>p,.sgr-card-facts small,.sgr-creator-empty{color:var(--card-muted,#b5c6bf)}
.sgr-card-cover{background:var(--card-surface-high,#09110e)}
.sgr-card-more{color:var(--card-text,#fff);background:var(--accent,#3f9d73);border-color:var(--accent2,#62c295)}

.sgr-detail-shell{color:var(--theme-text,#f5fbf7);background:linear-gradient(135deg,var(--theme-bg,#061812),var(--theme-bg-alt,#0c2f23) 78%);border-color:var(--theme-outline,#7e6938)}
.sgr-detail-title,.sgr-detail-description p,.sgr-detail-author,.sgr-detail-price strong,.sgr-detail-facts strong,.sgr-rounds h3{color:var(--theme-text,#fff)}
.sgr-detail-panel{background:transparent;border-color:transparent}
.sgr-detail-cover{background:var(--theme-surface-low,#07110d);border-color:var(--theme-outline,#8a724f)}
.sgr-detail-description h3{color:var(--theme-primary,#3f9d73)}
.sgr-detail-author-prefix,.sgr-detail-price small,.sgr-detail-facts small,.sgr-round-row b,.sgr-no-rounds,.sgr-detail-consent{color:var(--theme-muted,#b7c6bf)}
.sgr-detail-consent input{accent-color:var(--theme-primary,#3f9d73)}
.sgr-detail-consent a{color:var(--theme-text,#fff)}
.sgr-buy-button{color:var(--theme-text,#fff);background:var(--theme-cta,#2f865f);border-color:var(--theme-primary,#60bc91)}
.sgr-detail-facts,.sgr-round-row{border-color:var(--theme-outline,#315347)}
.sgr-difficulty-pill{color:var(--theme-on-primary,#32101f)!important;background:var(--theme-primary-container,var(--theme-primary,#ffd0d4))}
.sgr-tags span{color:var(--theme-text,#b7c5be);background:var(--theme-surface-high,#0a241b)}
.sgr-sort-wrap .sgr-sort-icon{top:50%;transform:translateY(-50%)}
.sgr-sort-wrap .sgr-sort-icon path{stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* v18.7: main sort icon = classic up/down arrows; ordering icons live inside menu rows */
.sgr-sort-wrap .sgr-filter-sort[hidden]{display:none!important}
.sgr-sort-button{width:100%;min-width:0;height:46px;border:1px solid #795062;border-radius:13px;background:#24151c;color:#eadfe3;font:inherit;font-size:13px;font-weight:720;outline:none;cursor:pointer;padding:0 38px 0 38px;text-align:left;display:flex;align-items:center}
.sgr-sort-button:focus{border-color:#ef82aa;box-shadow:0 0 0 3px #ef82aa17}
.sgr-sort-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sgr-sort-chevron{position:absolute;right:13px;width:16px;height:16px;fill:none;stroke:#9e8992;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.sgr-sort-menu{position:fixed;z-index:10000;padding:6px;background:#1b1216;border:1px solid #604450;border-radius:13px;box-shadow:0 18px 50px #0008;max-height:min(360px,70vh);overflow:auto}
.sgr-sort-menu[hidden]{display:none}
.sgr-sort-option{width:100%;min-height:40px;border:0;border-radius:9px;background:transparent;color:#eadfe3;font:inherit;font-size:13px;font-weight:700;padding:8px 10px;display:flex;align-items:center;justify-content:space-between;gap:16px;text-align:left;cursor:pointer}
.sgr-sort-option:hover,.sgr-sort-option.is-selected{background:#342029}
.sgr-sort-option.is-selected{color:#f19abb}
.sgr-bars-sort{width:22px;height:22px;flex:0 0 22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}


/* v18.8: compact borderless sort control first in toolbar + fully scrollable menu */
.sgr-filter-bar{grid-template-columns:170px minmax(220px,1.45fr) minmax(136px,.78fr) minmax(126px,.7fr) minmax(126px,.7fr) minmax(166px,.92fr) 88px}
.sgr-sort-wrap{width:170px;min-width:170px}
.sgr-sort-button{position:relative;width:170px;height:46px;border:0;border-radius:10px;background:transparent;padding:0 30px 0 30px;color:#eadfe3;gap:7px}
.sgr-sort-button:hover{background:#ffffff0a}
.sgr-sort-button:focus{border:0;box-shadow:0 0 0 3px #ef82aa17;background:#ffffff0a}
.sgr-sort-current-icon{position:absolute;left:4px;top:50%;transform:translateY(-50%);width:20px;height:20px;display:grid;place-items:center;color:#efb1c9}
.sgr-sort-current-icon>svg,.sgr-sort-current-icon .sgr-bars-sort{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sgr-sort-label{display:block;max-width:104px;white-space:nowrap;overflow:visible;text-overflow:clip}
.sgr-sort-chevron{right:4px}
.sgr-sort-menu{padding:7px;max-height:min(500px,calc(100vh - 24px));overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;background:#1b1216;border-color:#604450}
.sgr-sort-option{justify-content:flex-start;gap:9px;min-height:41px;padding:8px 10px;white-space:nowrap}
.sgr-sort-option-icon{width:22px;height:22px;flex:0 0 22px;display:grid;place-items:center;color:#bfa7b1}
.sgr-sort-option-icon>svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.sgr-sort-option.is-selected .sgr-sort-option-icon{color:#f19abb}
@media(max-width:1120px){.sgr-filter-bar{grid-template-columns:170px minmax(230px,1.4fr) repeat(2,minmax(135px,1fr));}.sgr-sort-wrap{grid-row:1;grid-column:1}.sgr-search-wrap{grid-row:1;grid-column:2}.sgr-filter-difficulty{grid-row:1;grid-column:3}.sgr-filter-age{grid-row:1;grid-column:4}.sgr-filter-time{grid-row:2;grid-column:1}.sgr-filter-players{grid-row:2;grid-column:2/4}.sgr-filter-reset{grid-row:2;grid-column:4}}
@media(max-width:760px){.sgr-sort-wrap{flex:0 0 170px}.sgr-sort-button{width:170px}.sgr-search-wrap{flex:0 0 205px}}


/* v19 — one canonical public game-card size everywhere.
   The landing-page rail remains the sizing reference. */
:root{--sgr-game-card-width:clamp(330px,33vw,430px)}
.sgr-game-grid{display:flex;flex-wrap:wrap;align-items:stretch;gap:22px}
.sgr-game-card,.sgr-catalog-skeleton{flex:0 0 var(--sgr-game-card-width);width:var(--sgr-game-card-width);max-width:100%}
#games[data-sgr-layout="strip"] .sgr-game-grid{flex-wrap:nowrap;justify-content:flex-start}
#games[data-sgr-layout="strip"] .sgr-game-card,
#games[data-sgr-layout="strip"] .sgr-catalog-skeleton{flex:0 0 var(--sgr-game-card-width);width:var(--sgr-game-card-width);max-width:none}
@media(max-width:720px){
  .sgr-game-grid{justify-content:center}
  .sgr-game-card,.sgr-catalog-skeleton{flex:0 0 min(86vw,390px);width:min(86vw,390px);max-width:390px}
  #games[data-sgr-layout="strip"] .sgr-game-grid{justify-content:flex-start}
  #games[data-sgr-layout="strip"] .sgr-game-card,
  #games[data-sgr-layout="strip"] .sgr-catalog-skeleton{flex-basis:min(86vw,390px);width:min(86vw,390px);max-width:390px}
}

/* v20 — landing catalogue is permanently one horizontal swipe rail.
   It never wraps into extra rows on desktop or mobile. */
#games[data-sgr-layout="strip"]{
  min-width:0;
  overflow:hidden;
}
#games[data-sgr-layout="strip"] .sgr-game-grid{
  display:flex !important;
  flex-flow:row nowrap !important;
  align-items:stretch;
  justify-content:flex-start;
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  overscroll-behavior-inline:contain;
  touch-action:pan-x pan-y;
  scrollbar-width:none;
  padding-bottom:4px;
}
#games[data-sgr-layout="strip"] .sgr-game-grid::-webkit-scrollbar{
  display:none;
  width:0;
  height:0;
}
#games[data-sgr-layout="strip"] .sgr-game-card,
#games[data-sgr-layout="strip"] .sgr-catalog-skeleton{
  flex-shrink:0 !important;
  scroll-snap-align:start;
  scroll-snap-stop:normal;
}
@media(max-width:720px){
  #games[data-sgr-layout="strip"] .sgr-game-grid{
    gap:16px;
    width:100%;
    max-width:100%;
    padding-right:0;
  }
}

/* v21 — hard guarantee: homepage catalogue is exactly one horizontal rail.
   Deliberately does not depend on data-sgr-layout, so it survives stale/static markup.
   The full /games/ catalogue is excluded by data-sgr-catalog-page. */
#games:not([data-sgr-catalog-page]){
  min-width:0;
  overflow:hidden;
}
#games:not([data-sgr-catalog-page]) > .sgr-game-grid{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  grid-template-columns:none !important;
  grid-auto-flow:unset !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:22px;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x mandatory;
  scroll-padding-inline:2px;
  overscroll-behavior-x:contain;
  touch-action:pan-x pan-y;
  scrollbar-width:none;
  padding:4px 2px 4px;
}
#games:not([data-sgr-catalog-page]) > .sgr-game-grid::-webkit-scrollbar{
  display:none;
  width:0;
  height:0;
}
#games:not([data-sgr-catalog-page]) > .sgr-game-grid > .sgr-game-card,
#games:not([data-sgr-catalog-page]) > .sgr-game-grid > .sgr-catalog-skeleton{
  flex:0 0 var(--sgr-game-card-width) !important;
  width:var(--sgr-game-card-width) !important;
  max-width:none !important;
  min-width:0;
  scroll-snap-align:start;
}
@media(max-width:720px){
  #games:not([data-sgr-catalog-page]) > .sgr-game-grid{
    gap:16px;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-game-grid > .sgr-game-card,
  #games:not([data-sgr-catalog-page]) > .sgr-game-grid > .sgr-catalog-skeleton{
    flex-basis:min(86vw,390px) !important;
    width:min(86vw,390px) !important;
    max-width:390px !important;
  }
}


/* v22 — slimmer cards everywhere + three-card landing rail + soft edge reveal. */
:root{--sgr-game-card-width:clamp(300px,30vw,380px)}
.sgr-game-card,.sgr-catalog-skeleton{
  flex-basis:var(--sgr-game-card-width);
  width:var(--sgr-game-card-width);
}
.sgr-card-cover{margin:10px 10px 0;border-radius:15px}
.sgr-card-copy{padding:17px 17px 12px}
.sgr-game-card h3{font-size:clamp(21px,1.75vw,27px)}
.sgr-game-card .sgr-card-copy>p{margin:14px 0 16px;font-size:15px}
.sgr-card-facts{padding-top:14px;gap:6px}
.sgr-card-facts small{font-size:11px;margin-bottom:6px}
.sgr-card-facts strong{font-size:14px}
.sgr-card-bottom{gap:10px 14px;padding:13px 17px 16px}
.sgr-card-author,.sgr-creator-empty{font-size:13px}
.sgr-card-price{font-size:19px}
.sgr-card-more{height:44px;font-size:15px}

#games:not([data-sgr-catalog-page]){overflow:hidden}
#games:not([data-sgr-catalog-page]) .sgr-rail-shell{
  --sgr-rail-fade:92px;
  position:relative;
  min-width:0;
  isolation:isolate;
}
#games:not([data-sgr-catalog-page]) .sgr-rail-shell > .sgr-game-grid{
  position:relative;
  z-index:1;
  transition:-webkit-mask-image .2s ease,mask-image .2s ease;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 var(--sgr-rail-fade),#000 calc(100% - var(--sgr-rail-fade)),transparent 100%);
  mask-image:linear-gradient(to right,transparent 0,#000 var(--sgr-rail-fade),#000 calc(100% - var(--sgr-rail-fade)),transparent 100%);
}
#games:not([data-sgr-catalog-page]) .sgr-rail-shell.is-at-start:not(.is-at-end) > .sgr-game-grid{
  -webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - var(--sgr-rail-fade)),transparent 100%);
  mask-image:linear-gradient(to right,#000 0,#000 calc(100% - var(--sgr-rail-fade)),transparent 100%);
}
#games:not([data-sgr-catalog-page]) .sgr-rail-shell.is-at-end:not(.is-at-start) > .sgr-game-grid{
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 var(--sgr-rail-fade),#000 100%);
  mask-image:linear-gradient(to right,transparent 0,#000 var(--sgr-rail-fade),#000 100%);
}
#games:not([data-sgr-catalog-page]) .sgr-rail-shell.is-at-start.is-at-end > .sgr-game-grid{
  -webkit-mask-image:none;
  mask-image:none;
}
#games:not([data-sgr-catalog-page]) .sgr-rail-shell::before,
#games:not([data-sgr-catalog-page]) .sgr-rail-shell::after{
  content:"";
  position:absolute;
  z-index:3;
  top:0;
  bottom:0;
  width:var(--sgr-rail-fade);
  pointer-events:none;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  transition:opacity .2s ease;
}
#games:not([data-sgr-catalog-page]) .sgr-rail-shell::before{
  left:0;
  background:linear-gradient(to right,rgba(243,217,133,.72),rgba(243,217,133,0));
  -webkit-mask-image:linear-gradient(to right,#000,transparent);
  mask-image:linear-gradient(to right,#000,transparent);
}
#games:not([data-sgr-catalog-page]) .sgr-rail-shell::after{
  right:0;
  background:linear-gradient(to left,rgba(243,217,133,.72),rgba(243,217,133,0));
  -webkit-mask-image:linear-gradient(to left,#000,transparent);
  mask-image:linear-gradient(to left,#000,transparent);
}
#games:not([data-sgr-catalog-page]) .sgr-rail-shell.is-at-start::before,
#games:not([data-sgr-catalog-page]) .sgr-rail-shell.is-at-end::after{opacity:0}
.sgr-rail-arrow{
  position:absolute;
  z-index:6;
  top:50%;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.3);
  border-radius:999px;
  color:#fff;
  background:rgba(35,21,26,.86);
  box-shadow:0 12px 30px rgba(42,14,24,.25);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  cursor:pointer;
  transform:translateY(-50%);
  transition:opacity .18s ease,transform .18s ease,background .18s ease;
}
.sgr-rail-arrow:hover{background:rgba(82,34,50,.94);transform:translateY(-50%) scale(1.04)}
.sgr-rail-arrow:active{transform:translateY(-50%) scale(.97)}
.sgr-rail-arrow svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.sgr-rail-arrow--prev{left:12px}
.sgr-rail-arrow--next{right:12px}
.sgr-rail-arrow:disabled{opacity:0;pointer-events:none}

@media(min-width:1024px){
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-game-card,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-catalog-skeleton{
    flex:0 0 calc((100% - 44px)/3) !important;
    width:calc((100% - 44px)/3) !important;
  }
}
@media(max-width:720px){
  .sgr-game-card,.sgr-catalog-skeleton{flex-basis:min(82vw,350px);width:min(82vw,350px);max-width:350px}
  #games:not([data-sgr-catalog-page]) .sgr-rail-shell{--sgr-rail-fade:54px}
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-game-card,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-catalog-skeleton{
    flex:0 0 min(82vw,350px) !important;
    width:min(82vw,350px) !important;
    max-width:350px !important;
  }
  .sgr-rail-arrow{width:40px;height:40px}
  .sgr-rail-arrow--prev{left:6px}.sgr-rail-arrow--next{right:6px}
  .sgr-rail-arrow svg{width:19px;height:19px}
}
@media(prefers-reduced-motion:reduce){.sgr-rail-arrow{transition:none}}

@keyframes sgr-purchase-reveal{from{opacity:0;transform:translateY(-7px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.sgr-purchase-options.is-open{animation:none}}

/* v28: the same detail card is reused in the personal account. */
.sgr-open-app-button{display:flex;align-items:center;justify-content:center}


/* v33.2 — account/public card visual parity + game type badge on the card's top-left edge. */
.sgr-game-card{position:relative}
.sgr-game-type-badge{
  top:10px;left:22px;z-index:4;
  max-width:calc(100% - 44px);
  min-height:29px;padding:6px 11px;
  color:var(--card-text,#fff);
  background:var(--accent,#3f9d73);
  border:1px solid var(--accent2,#62c295);
  box-shadow:0 6px 16px rgba(0,0,0,.20);
  backdrop-filter:none;-webkit-backdrop-filter:none;
}
/* Detail modal keeps its badge inside the cover. */
.sgr-detail-cover{position:relative}
.sgr-detail-cover .sgr-game-type-badge--detail{
  top:13px;left:13px;
  color:var(--theme-text,#fff);
  background:var(--theme-cta,#3f9d73);
  border-color:var(--theme-primary,#62c295);
}

/* v33.3 — homepage rail fix.
   enhanceLandingRail() wraps the live grid in .sgr-rail-shell. Keep that wrapped
   grid as one non-wrapping horizontal flex row; /games/ remains unchanged. */
#games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  grid-template-columns:none !important;
  grid-auto-flow:unset !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:22px !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x mandatory;
  scroll-padding-inline:2px;
  overscroll-behavior-x:contain;
  touch-action:pan-x pan-y;
  scrollbar-width:none;
  padding:4px 2px 4px !important;
}
#games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid::-webkit-scrollbar{
  display:none;
  width:0;
  height:0;
}
#games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-game-card,
#games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-catalog-skeleton{
  flex-shrink:0 !important;
  scroll-snap-align:start;
}

/* v33.4 — landing rail composition.
   Desktop shows 3 complete cards plus the beginning of the next card.
   Edge controls live on the fully opaque page-color part of the fade, not on
   the transition itself. The /games/ catalog remains unaffected. */
@media (min-width:1024px){
  #games:not([data-sgr-catalog-page]) .sgr-rail-shell{
    --sgr-rail-peek:128px;
    --sgr-rail-edge:128px;
    --sgr-rail-bg:rgb(243,217,133);
  }

  /* Do not double-fade the cards: v33.4 uses edge overlays below. */
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-start:not(.is-at-end) > .sgr-game-grid,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-end:not(.is-at-start) > .sgr-game-grid,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-start.is-at-end > .sgr-game-grid{
    -webkit-mask-image:none !important;
    mask-image:none !important;
  }

  /* Reserve enough visible width for three whole cards and a fourth-card peek. */
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-game-card,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-catalog-skeleton{
    flex:0 0 calc((100% - 44px - var(--sgr-rail-peek))/3) !important;
    width:calc((100% - 44px - var(--sgr-rail-peek))/3) !important;
  }

  /* Fade only the beginning/end of the overflow card. The final ~58px are
     fully opaque page background, so the arrow never sits on the transition. */
  #games:not([data-sgr-catalog-page]) .sgr-rail-shell::before,
  #games:not([data-sgr-catalog-page]) .sgr-rail-shell::after{
    width:var(--sgr-rail-edge) !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
    -webkit-mask-image:none !important;
    mask-image:none !important;
  }
  #games:not([data-sgr-catalog-page]) .sgr-rail-shell::before{
    background:linear-gradient(to right,
      var(--sgr-rail-bg) 0,
      var(--sgr-rail-bg) 45%,
      rgba(243,217,133,.82) 58%,
      rgba(243,217,133,.38) 78%,
      rgba(243,217,133,0) 100%) !important;
  }
  #games:not([data-sgr-catalog-page]) .sgr-rail-shell::after{
    background:linear-gradient(to left,
      var(--sgr-rail-bg) 0,
      var(--sgr-rail-bg) 45%,
      rgba(243,217,133,.82) 58%,
      rgba(243,217,133,.38) 78%,
      rgba(243,217,133,0) 100%) !important;
  }

  .sgr-rail-arrow--prev{left:5px !important}
  .sgr-rail-arrow--next{right:5px !important}
}

@media (min-width:1024px) and (max-width:1180px){
  #games:not([data-sgr-catalog-page]) .sgr-rail-shell{
    --sgr-rail-peek:108px;
    --sgr-rail-edge:112px;
  }
}

/* v33.5 — landing rail follows the fixed top navigation boundaries.
   Three cards retain the canonical catalog width inside the header guide.
   Overflow cards live only in the outer page fields and fade there; arrows
   sit farther out on the fully opaque page background. */
@media (min-width:1024px){
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell{
    --sgr-rail-guide-width:min(1180px,calc(100vw - 64px));
    --sgr-rail-guide-shift:0px;
    --sgr-rail-field-left:max(32px,calc(50vw - 590px));
    --sgr-rail-field-right:max(32px,calc(50vw - 590px));
    --sgr-rail-gap:20px;
    --sgr-rail-bg:rgb(243,217,133);
    width:var(--sgr-rail-guide-width) !important;
    max-width:none !important;
    margin-left:var(--sgr-rail-guide-shift) !important;
    overflow:visible !important;
  }

  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid{
    box-sizing:border-box !important;
    width:calc(var(--sgr-rail-guide-width) + var(--sgr-rail-field-left) + var(--sgr-rail-field-right)) !important;
    max-width:none !important;
    margin-left:calc(-1 * var(--sgr-rail-field-left)) !important;
    padding:4px var(--sgr-rail-field-right) 4px var(--sgr-rail-field-left) !important;
    gap:var(--sgr-rail-gap) !important;
    scroll-padding-left:var(--sgr-rail-field-left) !important;
    scroll-padding-right:var(--sgr-rail-field-right) !important;
    -webkit-mask-image:none !important;
    mask-image:none !important;
  }

  /* Keep exactly the same card width as the full catalog. No rail shrinking. */
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-game-card,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-catalog-skeleton{
    flex:0 0 var(--sgr-game-card-width) !important;
    width:var(--sgr-game-card-width) !important;
    max-width:none !important;
  }

  /* Fade is entirely outside the navigation/content guide. */
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell::before,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell::after{
    top:0 !important;
    bottom:0 !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
    -webkit-mask-image:none !important;
    mask-image:none !important;
    pointer-events:none !important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell::before{
    left:auto !important;
    right:100% !important;
    width:var(--sgr-rail-field-left) !important;
    background:linear-gradient(to right,
      var(--sgr-rail-bg) 0%,
      var(--sgr-rail-bg) 18%,
      rgba(243,217,133,.96) 28%,
      rgba(243,217,133,.80) 45%,
      rgba(243,217,133,.56) 62%,
      rgba(243,217,133,.30) 78%,
      rgba(243,217,133,.10) 91%,
      rgba(243,217,133,0) 100%) !important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell::after{
    right:auto !important;
    left:100% !important;
    width:var(--sgr-rail-field-right) !important;
    background:linear-gradient(to right,
      rgba(243,217,133,0) 0%,
      rgba(243,217,133,.10) 9%,
      rgba(243,217,133,.30) 22%,
      rgba(243,217,133,.56) 38%,
      rgba(243,217,133,.80) 55%,
      rgba(243,217,133,.96) 72%,
      var(--sgr-rail-bg) 82%,
      var(--sgr-rail-bg) 100%) !important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-start::before,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-end::after{
    opacity:0 !important;
  }

  /* Controls are in the outer solid-color field, beyond the fade transition. */
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-rail-arrow--prev{
    left:calc(-1 * var(--sgr-rail-field-left) + 24px) !important;
    right:auto !important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-rail-arrow--next{
    right:calc(-1 * var(--sgr-rail-field-right) + 24px) !important;
    left:auto !important;
  }
}


/* v33.6 — backend game.theme cards + edge-mounted game type badge. */
.sgr-game-card{
  background:var(--card,#0b2b20);
  border-color:var(--card-border,#315e4e);
  color:var(--card-text,#f7f7f2);
}
.sgr-game-card > .sgr-game-type-badge{
  top:-1px;
  left:-1px;
  width:max-content;
  max-width:calc(100% - 28px);
  min-height:34px;
  padding:7px 14px;
  border:1px solid var(--accent2,#62c295);
  border-radius:22px 0 22px 0;
  color:var(--card-text,#fff);
  background:var(--accent,#3f9d73);
  box-shadow:none;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.sgr-game-card .sgr-card-more{
  background:var(--accent,#3f9d73);
  border-color:var(--accent2,#62c295);
}
/* The detail modal is not a card edge badge. */
.sgr-detail-cover .sgr-game-type-badge--detail{
  border-radius:999px;
}

/* v33.7 — borderless card CTA + game-type badge */
.sgr-game-card .sgr-card-more,
.sgr-game-card > .sgr-game-type-badge,
.sgr-detail-cover .sgr-game-type-badge--detail {
  border: 0 !important;
}


/* v33.8 — unified themed outlines + refined detail card. */
:root{--sgr-control-outline-mix:12%}

/* Public catalog cards: 1px, same as card border thickness; derived from CTA,
   only slightly lighter so the outline reads without turning pastel. */
.sgr-game-card .sgr-card-more,
.sgr-game-card > .sgr-game-type-badge{
  border:1px solid color-mix(in srgb,var(--accent,#3f9d73) 88%,white 12%) !important;
}

/* Detail shell owns the type badge. Mirror the edge-mounted geometry on the
   top-right: only top-right + bottom-left are rounded. */
.sgr-detail-shell{position:relative}
.sgr-detail-shell > .sgr-game-type-badge--detail{
  position:absolute;
  z-index:5;
  top:-1px;
  right:-1px;
  left:auto;
  width:max-content;
  max-width:min(48%,320px);
  min-height:34px;
  padding:7px 14px;
  border:1px solid var(--theme-outline,#315347) !important;
  border-radius:0 20px 0 20px;
  color:var(--theme-text,#fff);
  background:var(--theme-cta,#3f9d73);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Keep the close control clear of the corner badge while keeping the title
   at the top of the detail card rather than pushing the whole layout down. */
.sgr-detail-close{
  position:absolute !important;
  float:none !important;
  top:48px !important;
  right:18px !important;
}
.sgr-detail-title{
  clear:none !important;
  padding-right:150px;
}

/* Detail CTA follows the same 1px CTA-derived outline rule. */
.sgr-buy-button{
  border:1px solid color-mix(in srgb,var(--theme-cta,#2f865f) 88%,var(--theme-text,#fff) 12%) !important;
}

/* The cover image is intentionally borderless. */
.sgr-detail-cover{
  border:0 !important;
}

/* Rounds are grouped by a very subtle filled surface instead of a stroke. */
.sgr-round-row,
.sgr-no-rounds{
  border:0 !important;
  background:color-mix(in srgb,var(--theme-surface,#0b2b20) 94%,var(--theme-text,#fff) 6%) !important;
}

/* Difficulty is plain text everywhere, identical to the other fact values. */
.sgr-difficulty,
.sgr-difficulty-pill{
  display:initial !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  color:inherit !important;
  background:transparent !important;
  font:inherit !important;
}

@media(max-width:720px){
  .sgr-detail-shell > .sgr-game-type-badge--detail{
    max-width:52%;
    border-radius:0 16px 0 16px;
  }
  .sgr-detail-title{padding-right:120px}
  .sgr-detail-close{top:44px !important;right:12px !important}
}

/* v33.9 — left detail type badge, generic game structure, consent-first purchase. */
.sgr-detail-shell > .sgr-game-type-badge--detail{
  top:-1px !important;
  left:-1px !important;
  right:auto !important;
  max-width:min(58%,420px);
  min-height:48px;
  padding:9px 17px;
  border-radius:20px 0 20px 0;
  font-size:18px;
  line-height:1.5;
  font-weight:820;
}

.sgr-detail-title{
  padding-left:var(--sgr-detail-badge-offset,150px) !important;
  padding-right:64px !important;
  min-height:48px;
  box-sizing:border-box;
}

.sgr-detail-close{
  top:18px !important;
  right:18px !important;
}

/* Public structure rows are presentation-only; every cell uses one type size
   regardless of whether a runtime calls its items rounds, nights or stages. */
.sgr-round-row strong,
.sgr-round-row span,
.sgr-round-row b{
  font-size:15px !important;
  line-height:1.4;
}
.sgr-round-row strong{font-weight:780}
.sgr-round-row span{font-weight:680}
.sgr-round-row b{font-weight:680}

/* After the first Buy click, the CTA stays inert until the mandatory offer
   checkbox is accepted. */
.sgr-buy-button:disabled{
  opacity:.48;
  cursor:not-allowed;
  filter:saturate(.72);
}

@media(max-width:720px){
  .sgr-detail-shell > .sgr-game-type-badge--detail{
    max-width:62%;
    min-height:42px;
    padding:7px 13px;
    border-radius:16px 0 16px 0;
    font-size:16px;
  }
  .sgr-detail-title{
    padding-left:var(--sgr-detail-badge-offset,120px) !important;
    padding-right:52px !important;
    min-height:42px;
  }
  .sgr-detail-close{top:11px !important;right:11px !important}
}

/* v34.1 — compact public catalogue cards for 13-inch MacBook.
   Goal: four complete cards inside the same 1180px navigation/content guide.
   We do not shrink typography; the compression comes from card width, full-bleed
   covers, and tighter gutters. Account/library cards remain unchanged. */

/* Public catalogue only: cover touches the card on top/left/right. The outer
   card's overflow + radius clips the image to the card corners. */
#games .sgr-card-cover{
  margin:0 !important;
  border-radius:0 !important;
}

/* Slightly tighter public catalogue gutters. */
#games .sgr-game-grid{
  gap:14px !important;
}

/* Full /games/ catalogue: four columns at normal 13-inch desktop widths. */
@media (min-width:1180px){
  #games[data-sgr-catalog-page] .sgr-game-grid{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:14px !important;
    align-items:stretch !important;
  }
  #games[data-sgr-catalog-page] .sgr-game-card,
  #games[data-sgr-catalog-page] .sgr-catalog-skeleton{
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    flex:none !important;
  }
}

/* Intermediate desktop: keep cards readable rather than forcing four tiny cards. */
@media (min-width:900px) and (max-width:1179px){
  #games[data-sgr-catalog-page] .sgr-game-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:14px !important;
  }
  #games[data-sgr-catalog-page] .sgr-game-card,
  #games[data-sgr-catalog-page] .sgr-catalog-skeleton{
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    flex:none !important;
  }
}

@media (min-width:620px) and (max-width:899px){
  #games[data-sgr-catalog-page] .sgr-game-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:14px !important;
  }
  #games[data-sgr-catalog-page] .sgr-game-card,
  #games[data-sgr-catalog-page] .sgr-catalog-skeleton{
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    flex:none !important;
  }
}

/* Homepage rail: four complete cards fit exactly between the top-nav bounds.
   The fifth starts in the outer field and is handled by the existing fade. */
@media (min-width:1180px){
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell{
    --sgr-rail-gap:14px;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid{
    gap:var(--sgr-rail-gap) !important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-game-card,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-catalog-skeleton{
    flex:0 0 calc((var(--sgr-rail-guide-width) - (3 * var(--sgr-rail-gap))) / 4) !important;
    width:calc((var(--sgr-rail-guide-width) - (3 * var(--sgr-rail-gap))) / 4) !important;
    max-width:none !important;
  }
}

/* On narrower desktop keep the previous three-card rail. */
@media (min-width:1024px) and (max-width:1179px){
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell{
    --sgr-rail-gap:14px;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid{
    gap:var(--sgr-rail-gap) !important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-game-card,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-catalog-skeleton{
    flex:0 0 calc((var(--sgr-rail-guide-width) - (2 * var(--sgr-rail-gap))) / 3) !important;
    width:calc((var(--sgr-rail-guide-width) - (2 * var(--sgr-rail-gap))) / 3) !important;
    max-width:none !important;
  }
}

/* Match loading state to the full-bleed public card cover. */
#games .sgr-catalog-skeleton{padding:0 0 14px !important}
#games .sgr-skeleton-cover{margin:0 0 16px !important;border-radius:0 !important}
#games .sgr-catalog-skeleton > :not(.sgr-skeleton-cover){margin-left:14px;margin-right:14px}

/* v34.2 — one canonical public card geometry everywhere.
   /games/ is the reference. The homepage rail uses the same card width at the
   same viewport instead of squeezing cards into the narrower landing guide. */
@media (min-width:1180px){
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-game-card,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-catalog-skeleton{
    flex:0 0 calc((min(1480px, calc(100vw - 40px)) - 42px) / 4) !important;
    width:calc((min(1480px, calc(100vw - 40px)) - 42px) / 4) !important;
    max-width:none !important;
  }
}
@media (min-width:900px) and (max-width:1179px){
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-game-card,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-catalog-skeleton{
    flex:0 0 calc((min(1480px, calc(100vw - 40px)) - 28px) / 3) !important;
    width:calc((min(1480px, calc(100vw - 40px)) - 28px) / 3) !important;
    max-width:none !important;
  }
}

/* v34.4 — homepage horizontal rail: only the explicit "Подробнее" CTA opens
   the detail view. The card body is intentionally non-interactive so trackpad/
   touch horizontal scrolling cannot be mistaken for a card click. */
#games:not([data-sgr-catalog-page]) .sgr-card-main{
  cursor:default !important;
}


/* v34.5 — canonical detail polish + homepage card click restored. */
/* Type badge: regular-weight text and exactly the same outline recipe as CTA. */
.sgr-detail-shell > .sgr-game-type-badge--detail{
  font-weight:400 !important;
  border:1px solid color-mix(in srgb,var(--theme-cta,#2f865f) 88%,var(--theme-text,#fff) 12%) !important;
}

/* Author and numeric price share one baseline; there is no "Цена" caption. */
.sgr-detail-commerce{
  align-items:baseline !important;
}
.sgr-detail-price{
  display:block !important;
  align-self:baseline;
  line-height:1.3;
}
.sgr-detail-price strong{
  display:block;
  font-size:28px;
  line-height:1.05;
}

/* Homepage rail cards are clickable again. Horizontal scrolling still lives on
   the rail itself; the same data-sgr-open handler as /games/ opens the popup. */
#games:not([data-sgr-catalog-page]) .sgr-card-main{
  cursor:pointer !important;
}

/* v34.6 — homepage typography becomes the canonical typography for every game card,
   and the single shared detail popup uses the lighter/compact landing-page type scale. */

/* Canonical card type scale = homepage rail. */
.sgr-game-card h3{
  font-size:clamp(21px,1.75vw,27px) !important;
  line-height:1.08;
  letter-spacing:-.045em;
}
.sgr-game-card .sgr-card-copy>p{
  margin:14px 0 16px !important;
  font-size:15px !important;
  line-height:1.55;
}
.sgr-game-card .sgr-card-facts small{
  margin-bottom:6px !important;
  font-size:11px !important;
}
.sgr-game-card .sgr-card-facts strong{
  font-size:14px !important;
}
.sgr-game-card .sgr-card-author,
.sgr-game-card .sgr-creator-empty{
  font-size:13px !important;
}
.sgr-game-card .sgr-card-price{
  font-size:19px !important;
}
.sgr-game-card .sgr-card-more{
  height:44px !important;
  font-size:15px !important;
}

/* One shared popup for homepage, /games/ and /account/. Typography follows the
   more compact landing-page version instead of the oversized catalogue detail scale. */
.sgr-detail-shell{
  padding:20px !important;
}
.sgr-detail-title{
  margin-bottom:14px !important;
  font-size:clamp(32px,3.2vw,48px) !important;
  line-height:1.03 !important;
  font-weight:700;
  letter-spacing:-.04em;
}
.sgr-detail-panel{
  gap:18px !important;
}
.sgr-detail-description h3{
  margin:11px 0 5px !important;
  font-size:18px !important;
  line-height:1.2;
  font-weight:650;
}
.sgr-detail-description p{
  margin:0 !important;
  font-size:16px !important;
  line-height:1.42 !important;
  font-weight:500 !important;
}
.sgr-detail-commerce{
  margin-top:12px !important;
  padding-top:10px !important;
}
.sgr-detail-author{
  font-size:14px !important;
}
.sgr-detail-price strong{
  font-size:24px !important;
}
.sgr-buy-button{
  margin-top:10px !important;
  font-size:18px !important;
}
.sgr-detail-facts small{
  margin-bottom:6px !important;
  font-size:11px !important;
  font-weight:650 !important;
}
.sgr-detail-facts strong{
  font-size:16px !important;
  font-weight:720 !important;
}
.sgr-rounds h3{
  margin-top:16px !important;
  margin-bottom:8px !important;
  font-size:23px !important;
  line-height:1.15;
}
.sgr-round-row{
  padding-block:10px !important;
}
.sgr-round-row strong,
.sgr-round-row span,
.sgr-round-row b{
  font-size:14px !important;
  line-height:1.35 !important;
}

/* 13-inch MacBook height target: when description occupies up to four natural
   lines, reclaim vertical space above it instead of shrinking or clipping text. */
@media (min-width:1081px) and (max-height:900px){
  .sgr-detail-overlay{padding:20px !important}
  .sgr-detail-shell{max-height:94vh !important;padding:18px !important}
  .sgr-detail-title{margin-bottom:10px !important}
  .sgr-detail-description h3{margin-top:8px !important}
  .sgr-detail-commerce{margin-top:9px !important;padding-top:8px !important}
  .sgr-buy-button{margin-top:8px !important}
}

/* v34.7 — restore canonical card weights and requested detail typography. */
/* Small public cards: make the homepage typography weights explicit so the
   homepage and /games/ cannot drift because of surrounding page styles. */
.sgr-game-card h3{font-weight:700 !important}
.sgr-game-card .sgr-card-copy>p{font-weight:400 !important}
.sgr-game-card .sgr-card-facts small{font-weight:750 !important}
.sgr-game-card .sgr-card-facts strong{font-weight:820 !important}
.sgr-game-card .sgr-card-author{font-weight:400 !important}
.sgr-game-card .sgr-card-price{font-weight:700 !important}
.sgr-game-card .sgr-card-more{font-weight:820 !important}

/* Shared detail popup. Restore the requested larger scale and the original
   vertical rhythm around title, description and purchase CTA. */
.sgr-detail-title{
  margin-bottom:24px !important;
  font-size:clamp(36px,4vw,60px) !important;
  line-height:1 !important;
  font-weight:700 !important;
}
.sgr-detail-description p{
  font-size:18px !important;
  line-height:1.5 !important;
  font-weight:650 !important;
}
.sgr-detail-commerce{
  align-items:start !important;
  margin-top:20px !important;
  padding-top:13px !important;
}
.sgr-detail-author{
  align-items:flex-start !important;
  align-self:start !important;
}
.sgr-detail-price{
  align-self:start !important;
}
.sgr-buy-button{
  margin-top:13px !important;
}
.sgr-detail-facts small{
  font-size:12px !important;
}
.sgr-detail-facts strong{
  font-size:18px !important;
}
.sgr-rounds h3{
  font-size:27px !important;
}
.sgr-round-row strong,
.sgr-round-row span,
.sgr-round-row b{
  font-size:15px !important;
  line-height:1.4 !important;
}

/* Short desktop windows may keep the smaller shell padding, but must not
   silently override the typography/spacing values requested above. */
@media (min-width:1081px) and (max-height:900px){
  .sgr-detail-title{margin-bottom:24px !important}
  .sgr-detail-description h3{margin-top:11px !important}
  .sgr-detail-commerce{margin-top:20px !important;padding-top:13px !important}
  .sgr-buy-button{margin-top:13px !important}
}

@media(max-width:720px){
  .sgr-detail-title{font-size:34px !important}
}

/* v34.8 — canonical Geist variable font for every catalogue card on every page.
   /games/ previously inherited Inter and /account/ had an incomplete Latin-only
   Geist face, so identical numeric font-weights could still look different. */
@font-face{font-family:'SGR Geist';font-style:normal;font-weight:100 900;font-display:swap;src:url('/_next/static/_vinext_fonts/geist-8ac0455e797f/geist-ff2310f5.woff2') format('woff2');unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:'SGR Geist';font-style:normal;font-weight:100 900;font-display:swap;src:url('/_next/static/_vinext_fonts/geist-8ac0455e797f/geist-875ccdd4.woff2') format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'SGR Geist';font-style:normal;font-weight:100 900;font-display:swap;src:url('/_next/static/_vinext_fonts/geist-8ac0455e797f/geist-52306abf.woff2') format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:'SGR Geist';font-style:normal;font-weight:100 900;font-display:swap;src:url('/_next/static/_vinext_fonts/geist-8ac0455e797f/geist-001175b1.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'SGR Geist';font-style:normal;font-weight:100 900;font-display:swap;src:url('/_next/static/_vinext_fonts/geist-8ac0455e797f/geist-98bbbccb.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --sgr-card-font:'SGR Geist',Geist,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --sgr-card-title-weight:700;
  --sgr-card-description-weight:400;
  --sgr-card-label-weight:750;
  --sgr-card-value-weight:820;
  --sgr-card-author-weight:400;
  --sgr-card-price-weight:700;
  --sgr-card-button-weight:820;
  --sgr-card-title-line:1.08;
  --sgr-card-description-line:1.55;
  --sgr-card-fact-line:1.15;
  --sgr-card-author-line:1.25;
  --sgr-card-title-tracking:-.045em;
}

/* ONE typography source for homepage, /games/ and /account/. */
.sgr-game-card,
.view[data-panel="catalog"] .game-card{
  font-family:var(--sgr-card-font) !important;
}
.sgr-game-card h3,
.view[data-panel="catalog"] .game-copy h3{
  font-family:var(--sgr-card-font) !important;
  font-weight:var(--sgr-card-title-weight) !important;
  line-height:var(--sgr-card-title-line) !important;
  letter-spacing:var(--sgr-card-title-tracking) !important;
}
.sgr-game-card .sgr-card-copy>p,
.view[data-panel="catalog"] .game-copy p{
  font-family:var(--sgr-card-font) !important;
  font-weight:var(--sgr-card-description-weight) !important;
  line-height:var(--sgr-card-description-line) !important;
}
.sgr-game-card .sgr-card-facts small,
.view[data-panel="catalog"] .game-facts small{
  font-family:var(--sgr-card-font) !important;
  font-weight:var(--sgr-card-label-weight) !important;
  line-height:var(--sgr-card-fact-line) !important;
  letter-spacing:0 !important;
}
.sgr-game-card .sgr-card-facts strong,
.view[data-panel="catalog"] .game-facts b{
  font-family:var(--sgr-card-font) !important;
  font-weight:var(--sgr-card-value-weight) !important;
  line-height:var(--sgr-card-fact-line) !important;
  letter-spacing:0 !important;
}
.sgr-game-card .sgr-card-author,
.sgr-game-card .sgr-creator-empty,
.view[data-panel="catalog"] .game-bottom>small{
  font-family:var(--sgr-card-font) !important;
  font-weight:var(--sgr-card-author-weight) !important;
  line-height:var(--sgr-card-author-line) !important;
  letter-spacing:0 !important;
}
.sgr-game-card .sgr-card-price,
.view[data-panel="catalog"] .game-bottom>strong{
  font-family:var(--sgr-card-font) !important;
  font-weight:var(--sgr-card-price-weight) !important;
  letter-spacing:0 !important;
}
.sgr-game-card .sgr-card-more,
.view[data-panel="catalog"] .game-bottom button{
  font-family:var(--sgr-card-font) !important;
  font-weight:var(--sgr-card-button-weight) !important;
  letter-spacing:0 !important;
}



/* v34.9 — landing rail UX, simplified headings, mobile navigation. */
.hero .eyebrow,
.catalog-section .section-kicker,
.steps-section .section-kicker,
.download-section .section-kicker,
.faq-section .section-kicker{
  display:none!important;
}

/* Desktop: keep vertical page scrolling untouched and restore a clear,
   lightweight hover/focus emphasis for the card under the pointer. */
@media (min-width:721px) and (hover:hover) and (pointer:fine){
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid{
    padding-top:12px!important;
    padding-bottom:12px!important;
  }
  #games:not([data-sgr-catalog-page]) .sgr-game-card{
    position:relative;
    transform-origin:center center;
    transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;
    will-change:transform;
  }
  #games:not([data-sgr-catalog-page]) .sgr-game-card:hover,
  #games:not([data-sgr-catalog-page]) .sgr-game-card:focus-within{
    z-index:5;
    transform:translateY(-5px) scale(1.012);
    box-shadow:0 28px 62px rgba(52,16,24,.22);
    filter:saturate(1.03);
  }
}

/* Mobile: one centred card, no side fade/blur fields. Controls sit below the
   card as thin chevrons: right / both / left according to rail position. */
@media (max-width:720px){
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell{
    --sgr-mobile-card-width:min(390px,calc(100vw - 24px));
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0 0 46px!important;
    overflow:visible!important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell::before,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell::after{
    display:none!important;
    content:none!important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-start:not(.is-at-end) > .sgr-game-grid,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-end:not(.is-at-start) > .sgr-game-grid,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-start.is-at-end > .sgr-game-grid{
    box-sizing:border-box!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    gap:14px!important;
    padding:4px calc((100% - var(--sgr-mobile-card-width))/2) 6px!important;
    scroll-padding-inline:calc((100% - var(--sgr-mobile-card-width))/2)!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
    overscroll-behavior-x:auto!important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-game-card,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-catalog-skeleton{
    flex:0 0 var(--sgr-mobile-card-width)!important;
    width:var(--sgr-mobile-card-width)!important;
    max-width:var(--sgr-mobile-card-width)!important;
    scroll-snap-align:center!important;
  }
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow{
    top:auto!important;
    right:auto!important;
    bottom:2px!important;
    width:44px!important;
    height:34px!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    color:#6e1736!important;
    background:transparent!important;
    box-shadow:none!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    opacity:.72;
    transform:none!important;
    transition:opacity .16s ease,transform .16s ease!important;
  }
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow:hover,
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow:active{
    color:#6e1736!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow svg{
    width:30px!important;
    height:30px!important;
    stroke-width:1.45!important;
  }
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow--prev{
    left:calc(50% - 52px)!important;
  }
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow--next{
    left:calc(50% + 8px)!important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-start:not(.is-at-end) > .sgr-rail-arrow--next,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-end:not(.is-at-start) > .sgr-rail-arrow--prev{
    left:50%!important;
    transform:translateX(-50%)!important;
  }
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow:disabled{
    opacity:0!important;
    pointer-events:none!important;
  }
}

/* v34.9.2 — mobile carousel/detail polish. */
@media (max-width:720px){
  /* Match the full /games/ mobile card geometry: one complete card, centred,
     with real side breathing room and no masks/fades. */
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell{
    --sgr-mobile-card-width:min(82vw,350px) !important;
    padding-bottom:44px !important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-start:not(.is-at-end) > .sgr-game-grid,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-end:not(.is-at-start) > .sgr-game-grid,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell.is-at-start.is-at-end > .sgr-game-grid{
    padding-left:calc((100% - var(--sgr-mobile-card-width))/2) !important;
    padding-right:calc((100% - var(--sgr-mobile-card-width))/2) !important;
    scroll-padding-inline:calc((100% - var(--sgr-mobile-card-width))/2) !important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-game-card,
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid > .sgr-catalog-skeleton{
    flex:0 0 var(--sgr-mobile-card-width) !important;
    width:var(--sgr-mobile-card-width) !important;
    max-width:350px !important;
  }

  /* In the mobile detail sheet the type badge gets its own row, then the full
     game title starts below it instead of competing for the same line. */
  .sgr-detail-shell > .sgr-game-type-badge--detail{
    position:relative !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    display:flex !important;
    width:max-content;
    max-width:calc(100% - 54px) !important;
    margin:-14px 54px 12px -14px !important;
  }
  .sgr-detail-title{
    clear:both !important;
    width:100% !important;
    min-height:0 !important;
    margin:0 0 24px !important;
    padding:0 !important;
    font-size:clamp(30px,8vw,38px) !important;
    line-height:1.04 !important;
    overflow-wrap:anywhere;
  }
  .sgr-detail-close{
    position:absolute !important;
    top:10px !important;
    right:10px !important;
    float:none !important;
  }
}

/* v35 — mobile landing catalogue without the yellow field. */
@media (max-width:720px){
  .catalog-section#games{
    background:#0f0a0f !important;
    color:#fff8ef !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
  .catalog-section#games .section-heading{
    padding-left:20px !important;
    padding-right:20px !important;
  }
  .catalog-section#games .section-heading h2{
    color:#fff8ef !important;
  }
  .catalog-section#games .section-heading>p{
    color:#b8aeb2 !important;
  }
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow{
    color:#ef9ab7 !important;
  }
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow:hover,
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow:active{
    color:#ffc0d4 !important;
  }
}


/* v36 — mobile landing catalogue: keep the yellow section, remove the oversized
   yellow side fields around the carousel card. The rail itself is edge-to-edge,
   while the card stays fully visible with only a small 12px safety gutter. */
@media (max-width:720px){
  .catalog-section#games{
    background:#f3d985 !important;
    color:#22151a !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
  .catalog-section#games .section-heading{
    padding-left:18px !important;
    padding-right:18px !important;
  }
  .catalog-section#games .section-heading h2{
    color:#22151a !important;
  }
  .catalog-section#games .section-heading>p{
    color:#735d58 !important;
  }
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell{
    --sgr-mobile-card-width:min(390px,calc(100vw - 24px)) !important;
  }
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow,
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow:hover,
  #games:not([data-sgr-catalog-page]) .sgr-rail-arrow:active{
    color:#8a233f !important;
  }
}

/* v38 — mobile viewport hardening.
   Keep the page itself locked to the viewport horizontally while preserving
   intentional horizontal scrollers (catalog rails, filters, facts). */
html,body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
  overscroll-behavior-x:none;
}
@supports (overflow:clip){
  html,body{overflow-x:clip}
}

@media(max-width:720px){
  /* A rail may scroll sideways, but reaching either end must not pull the
     entire page sideways on iOS. */
  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell > .sgr-game-grid,
  #games[data-sgr-catalog-page] .sgr-game-grid,
  .sgr-filter-bar,
  .sgr-detail-facts{
    overscroll-behavior-x:contain !important;
  }

  /* Detail behaves like a mobile sheet inside Safari/Chrome's *visual*
     viewport. JS supplies the visualViewport top/height when available. */
  .sgr-detail-overlay{
    top:var(--sgr-vv-top,0px) !important;
    bottom:auto !important;
    height:var(--sgr-vv-height,100dvh) !important;
    min-height:0 !important;
    box-sizing:border-box !important;
    place-items:start center !important;
    align-content:start !important;
    padding:16px 8px max(16px,env(safe-area-inset-bottom)) !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  .sgr-detail-shell{
    width:100% !important;
    max-width:100% !important;
    max-height:calc(var(--sgr-vv-height,100dvh) - 32px) !important;
    margin:0 auto !important;
    overflow:auto !important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
}