/* 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-players,.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-players{padding:0 10px 0 13px;color-scheme:dark}
.sgr-filter-players::placeholder{color:#8e7a82}

.sgr-filter-search:focus,.sgr-filter-players: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;flex:0 0 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;
  }
}


/* v57 — promo codes in website checkout (backend v60). */
.sgr-detail-price-original{
  display:block;
  margin:0 0 2px;
  color:var(--theme-muted,#b7c6bf);
  font-size:14px;
  line-height:1.15;
  text-decoration:line-through;
  text-decoration-thickness:1px;
}
.sgr-detail-price-original[hidden]{display:none!important}
.sgr-promo-block{
  display:grid;
  gap:7px;
  margin:0 0 14px;
}
.sgr-promo-label{
  color:var(--theme-text,#fff);
  font-size:14px;
  font-weight:650;
}
.sgr-promo-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
}
.sgr-promo-input{
  min-width:0;
  height:44px;
  padding:0 13px;
  border:1px solid color-mix(in srgb,var(--theme-outline,#315347) 78%,transparent);
  border-radius:11px;
  outline:none;
  color:var(--theme-text,#fff);
  background:color-mix(in srgb,var(--theme-surface-high,#123d30) 72%,transparent);
  font:inherit;
  font-size:14px;
  text-transform:uppercase;
}
.sgr-promo-input::placeholder{color:var(--theme-muted,#b7c6bf);text-transform:none}
.sgr-promo-input:focus{
  border-color:var(--theme-cta,#3f9d73);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--theme-cta,#3f9d73) 18%,transparent);
}
.sgr-promo-apply{
  height:44px;
  padding:0 15px;
  border:1px solid color-mix(in srgb,var(--theme-cta,#3f9d73) 72%,var(--theme-text,#fff) 12%);
  border-radius:11px;
  color:var(--theme-text,#fff);
  background:transparent;
  font:inherit;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
}
.sgr-promo-apply:hover{background:color-mix(in srgb,var(--theme-cta,#3f9d73) 14%,transparent)}
.sgr-promo-apply:disabled{opacity:.58;cursor:wait}
.sgr-promo-status{
  min-height:0;
  margin:0;
  color:#ffacb9;
  font-size:12px;
  line-height:1.4;
}
.sgr-promo-status.is-success{color:#92e3b8}
@media(max-width:430px){
  .sgr-promo-row{grid-template-columns:1fr}
  .sgr-promo-apply{width:100%}
}


/* v58 — collapsed promo disclosure + percentage-first feedback. */
.sgr-promo-disclosure{margin:0 0 14px;border-top:1px solid color-mix(in srgb,var(--theme-outline,#315347) 54%,transparent);border-bottom:1px solid color-mix(in srgb,var(--theme-outline,#315347) 54%,transparent)}
.sgr-promo-disclosure>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;color:var(--theme-muted,#b7c6bf);font-size:13px;font-weight:700;cursor:pointer;list-style:none;user-select:none}
.sgr-promo-disclosure>summary::-webkit-details-marker{display:none}
.sgr-promo-disclosure>summary::after{content:'⌄';font-size:16px;line-height:1;transition:transform .18s ease}
.sgr-promo-disclosure[open]>summary::after{transform:rotate(180deg)}
.sgr-promo-disclosure[open]>summary{color:var(--theme-text,#fff)}
.sgr-promo-disclosure .sgr-promo-block{margin:0;padding:0 0 13px}

/* v59 — compact promo disclosure: no separator lines, chevron hugs the label. */
.sgr-promo-disclosure{margin:0 0 14px;border:0}
.sgr-promo-disclosure>summary{display:inline-flex;align-items:center;justify-content:flex-start;width:auto;gap:6px;padding:7px 0;color:var(--theme-muted,#b7c6bf)}
.sgr-promo-disclosure>summary::after{margin:0;flex:0 0 auto;font-size:15px}
.sgr-promo-disclosure .sgr-promo-block{padding:7px 0 6px}

/* v60 — bundle offers */
.sgr-bundle-card{position:relative}
.sgr-bundle-badge{background:rgba(93,57,45,.92);color:#fff;border-color:rgba(255,255,255,.18)}
.sgr-bundle-discount{position:absolute;top:14px;right:14px;z-index:4;padding:7px 10px;border-radius:999px;background:#fff4e8;color:#6d3427;font-weight:800;font-size:13px;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.sgr-bundle-collage{position:relative;width:100%;height:100%;min-height:220px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(0,0,0,.08))}
.sgr-bundle-collage img,.sgr-bundle-collage span{position:absolute;width:55%;height:76%;object-fit:cover;border-radius:14px;box-shadow:0 14px 36px rgba(0,0,0,.32);border:1px solid rgba(255,255,255,.28);background:#1f2937;color:#fff;display:flex;align-items:center;justify-content:center;text-align:center;padding:8px;font-weight:700}
.sgr-bundle-collage--fan img:nth-child(1),.sgr-bundle-collage--fan span:nth-child(1){transform:translateX(-28%) rotate(-8deg)}
.sgr-bundle-collage--fan img:nth-child(2),.sgr-bundle-collage--fan span:nth-child(2){transform:translateX(0) rotate(0);z-index:2}
.sgr-bundle-collage--fan img:nth-child(3),.sgr-bundle-collage--fan span:nth-child(3){transform:translateX(28%) rotate(8deg)}
.sgr-bundle-collage--fan img:nth-child(4),.sgr-bundle-collage--fan span:nth-child(4){display:none}
.sgr-bundle-collage--stack img:nth-child(1),.sgr-bundle-collage--stack span:nth-child(1){transform:translate(-18%,-8%) rotate(-4deg)}
.sgr-bundle-collage--stack img:nth-child(2),.sgr-bundle-collage--stack span:nth-child(2){transform:translate(0,0);z-index:2}
.sgr-bundle-collage--stack img:nth-child(3),.sgr-bundle-collage--stack span:nth-child(3){transform:translate(18%,8%) rotate(4deg)}
.sgr-bundle-collage--grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:8px;padding:12px}
.sgr-bundle-collage--grid img,.sgr-bundle-collage--grid span{position:static;width:100%;height:100%;border-radius:10px;box-shadow:none}
.sgr-bundle-card-games{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.sgr-bundle-card-games span{padding:5px 8px;border-radius:999px;background:rgba(255,255,255,.12);font-size:12px;line-height:1.2}
.sgr-bundle-card .sgr-card-price s{opacity:.62;font-weight:500;margin-right:5px}
.sgr-bundle-detail-games{display:grid;gap:10px;margin:14px 0 20px}
.sgr-bundle-detail-games article{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid rgba(255,255,255,.11);border-radius:14px;background:rgba(255,255,255,.045)}
.sgr-bundle-mini-cover{width:48px;height:64px;flex:0 0 auto;border-radius:8px;overflow:hidden;background:rgba(255,255,255,.08)}
.sgr-bundle-mini-cover img{width:100%;height:100%;object-fit:cover}
.sgr-bundle-detail-games article>div:last-child{display:flex;flex-direction:column;gap:4px}
.sgr-bundle-detail-games article span{opacity:.72;font-size:13px}
.sgr-bundle-detail-panel .sgr-detail-price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.sgr-bundle-detail-panel .sgr-detail-price-original{text-decoration:line-through;opacity:.65}
.sgr-bundle-detail-panel .sgr-detail-price small{width:100%;opacity:.75}
@media (max-width:680px){.sgr-bundle-collage{min-height:190px}.sgr-bundle-discount{top:10px;right:10px}}

/* v60 bundle collage balance for two-card offers. */
.sgr-bundle-collage--fan.sgr-bundle-count-2 img:nth-child(1),.sgr-bundle-collage--fan.sgr-bundle-count-2 span:nth-child(1){transform:translateX(-20%) rotate(-6deg);z-index:1}
.sgr-bundle-collage--fan.sgr-bundle-count-2 img:nth-child(2),.sgr-bundle-collage--fan.sgr-bundle-count-2 span:nth-child(2){transform:translateX(20%) rotate(6deg);z-index:2}
.sgr-bundle-collage--stack.sgr-bundle-count-2 img:nth-child(1),.sgr-bundle-collage--stack.sgr-bundle-count-2 span:nth-child(1){transform:translate(-12%,-4%) rotate(-4deg);z-index:1}
.sgr-bundle-collage--stack.sgr-bundle-count-2 img:nth-child(2),.sgr-bundle-collage--stack.sgr-bundle-count-2 span:nth-child(2){transform:translate(12%,4%) rotate(4deg);z-index:2}

/* v65 — mobile full-catalog parity + mobile filters + high-signal Bundle merchandising. */
.sgr-mobile-filter-trigger{display:none}
.sgr-mobile-filter-overlay{display:none}

/* Bundle card: keep the canonical card footprint, but make the commercial value scan instantly. */
.sgr-bundle-card{
  border-color:color-mix(in srgb,#ff7a59 44%,var(--card-border,#315e4e));
  box-shadow:0 18px 44px #43172518,0 0 0 1px #ffcf5a18 inset;
}
.sgr-bundle-card:hover{box-shadow:0 25px 55px #3410182b,0 0 0 1px #ffcf5a24 inset}
.sgr-bundle-badge{
  min-height:31px;
  padding:7px 11px;
  background:#ffd45f;
  color:#35161f;
  border-color:#fff3bb;
  box-shadow:0 7px 20px #0003;
  font-size:11px;
  font-weight:900;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.sgr-bundle-discount{
  top:9px;
  right:9px;
  width:82px;
  height:82px;
  padding:0;
  border:2px solid #fff0c7;
  border-radius:50%;
  background:linear-gradient(145deg,#ff4f6d,#ff7548 62%,#ff9f43);
  color:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:1px;
  transform:rotate(7deg);
  box-shadow:0 12px 28px #0006,0 0 0 4px #ff66452b;
  text-shadow:0 1px 1px #8b1d2e55;
}
.sgr-bundle-discount small{font-size:9px;font-weight:950;letter-spacing:.12em;line-height:1}
.sgr-bundle-discount strong{font-size:25px;font-weight:950;letter-spacing:-.04em;line-height:1}
.sgr-bundle-card .sgr-card-cover{overflow:hidden}
.sgr-bundle-ribbon{
  position:absolute;
  z-index:5;
  left:12px;
  bottom:12px;
  max-width:calc(100% - 24px);
  padding:8px 11px;
  border:1px solid #ffdca9;
  border-radius:9px;
  background:linear-gradient(90deg,#ff4f6d,#ff7c46);
  color:#fff;
  box-shadow:0 8px 24px #0005;
  font-size:11px;
  font-weight:950;
  line-height:1;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.sgr-bundle-card .sgr-card-copy{padding-bottom:13px}
.sgr-bundle-card .sgr-bundle-card-slogan{
  min-height:0;
  margin:14px 0 14px;
  color:var(--card-text,#fff);
  display:block;
  font-size:15px;
  font-weight:800;
  line-height:1.35;
  -webkit-line-clamp:unset;
  opacity:.94;
}
.sgr-bundle-card-games{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  margin-top:0;
}
.sgr-bundle-card-games span{
  min-width:0;
  display:flex;
  align-items:center;
  gap:5px;
  padding:7px 7px;
  border:1px solid #ffffff16;
  border-radius:10px;
  background:#ffffff0d;
  color:var(--card-muted,#d9cbd1);
  font-size:10px;
  font-weight:720;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.sgr-bundle-card-games span b{
  flex:0 0 18px;
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  border-radius:6px;
  background:#ffd45f;
  color:#35161f;
  font-size:10px;
  font-weight:950;
}
.sgr-bundle-saving-line{
  margin-top:10px;
  padding:9px 10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border:1px solid #ffb36b45;
  border-radius:11px;
  background:linear-gradient(90deg,#ff5b6b16,#ffb34712);
  color:var(--card-text,#fff);
  font-size:12px;
}
.sgr-bundle-saving-line span{color:var(--card-muted,#d7c6cc);font-weight:720}
.sgr-bundle-saving-line strong{color:#ffd45f;font-size:14px;font-weight:950;white-space:nowrap}
.sgr-bundle-card-bottom{align-items:center}
.sgr-bundle-bottom-note{color:var(--card-muted,#c8bac0);font-size:12px;font-weight:760}
.sgr-bundle-card-price{display:grid;justify-items:end;gap:2px;line-height:1}
.sgr-bundle-card-price s{margin:0!important;color:var(--card-muted,#b9abb0);font-size:12px;font-weight:650!important;opacity:.75!important}
.sgr-bundle-card-price strong{color:#ffd45f;font-size:24px;font-weight:950;letter-spacing:-.04em}
.sgr-bundle-card-more{
  min-height:50px;
  background:linear-gradient(90deg,#ff4f6d,#ff7848)!important;
  border-color:#ffb26e!important;
  color:#fff!important;
  box-shadow:0 10px 26px #ff4f6d26;
  font-weight:900;
}

/* Bundle detail: merchandise the bundle as one strong offer, then show every included game as a real mini product card. */
.sgr-bundle-detail-head{
  position:relative;
  min-height:200px;
  margin:0 0 20px;
  padding:24px 150px 24px 24px;
  border:1px solid #ffac6845;
  border-radius:20px;
  background:
    radial-gradient(circle at 82% 20%,#ffcc5b24 0,transparent 30%),
    radial-gradient(circle at 8% 100%,#ff4f6d28 0,transparent 34%),
    linear-gradient(135deg,#2b111d,#421c22 58%,#2b1712);
  overflow:hidden;
}
.sgr-bundle-detail-kicker{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:14px}
.sgr-bundle-detail-kicker span,.sgr-bundle-detail-kicker b{
  display:inline-flex;
  align-items:center;
  min-height:29px;
  padding:6px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.055em;
  line-height:1;
  text-transform:uppercase;
}
.sgr-bundle-detail-kicker span{background:#ffd45f;color:#35161f}
.sgr-bundle-detail-kicker b{background:#ffffff12;color:#ffe6db;border:1px solid #ffffff17}
.sgr-bundle-detail-head h2{
  max-width:900px;
  margin:0;
  color:#fff;
  font-size:clamp(42px,5.2vw,72px);
  font-weight:900;
  letter-spacing:-.055em;
  line-height:.96;
}
.sgr-bundle-detail-head>p{max-width:760px;margin:16px 0 0;color:#ffe7dc;font-size:clamp(18px,2vw,24px);font-weight:760;line-height:1.35}
.sgr-bundle-detail-discount{
  position:absolute;
  top:28px;
  right:28px;
  width:108px;
  height:108px;
  border:3px solid #fff1c8;
  border-radius:50%;
  background:linear-gradient(145deg,#ff4f6d,#ff7548 62%,#ff9f43);
  color:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:1px;
  transform:rotate(7deg);
  box-shadow:0 18px 46px #0007,0 0 0 6px #ff7a4f2a;
}
.sgr-bundle-detail-discount small{font-size:10px;font-weight:950;letter-spacing:.13em;line-height:1}
.sgr-bundle-detail-discount strong{font-size:34px;font-weight:950;letter-spacing:-.05em;line-height:1}
.sgr-bundle-detail-hero{margin:0 0 20px;border-radius:18px;overflow:hidden;border:1px solid #ffffff17;max-height:430px}
.sgr-bundle-detail-hero img{width:100%;height:100%;max-height:430px;object-fit:cover;display:block}
.sgr-bundle-detail-panel{
  display:grid!important;
  grid-template-columns:minmax(0,1.9fr) minmax(310px,.8fr)!important;
  gap:20px!important;
  align-items:start;
}
.sgr-bundle-showcase{
  min-width:0;
  padding:20px;
  border:1px solid #ffffff12;
  border-radius:18px;
  background:#ffffff08;
}
.sgr-bundle-showcase-title{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:16px}
.sgr-bundle-showcase-title small{display:block;margin-bottom:5px;color:#ffb6a0;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.sgr-bundle-showcase-title h3{margin:0;color:#fff;font-size:28px;letter-spacing:-.035em;line-height:1.08}
.sgr-bundle-showcase-title>span{color:#bdaeb4;font-size:12px;font-weight:720;white-space:nowrap}
.sgr-bundle-mini-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.sgr-bundle-mini-card{
  min-width:0;
  overflow:hidden;
  border:1px solid #ffffff18;
  border-radius:15px;
  background:linear-gradient(180deg,#23171c,#171014);
  box-shadow:0 10px 28px #0003;
}
.sgr-bundle-mini-card-cover{aspect-ratio:16/9;overflow:hidden;background:#0f0b0d;display:grid;place-items:center}
.sgr-bundle-mini-card-cover img{width:100%;height:100%;object-fit:cover;display:block}
.sgr-bundle-mini-card-cover>span{font-size:34px;font-weight:950;color:#ffffff2e}
.sgr-bundle-mini-card-copy{display:grid;gap:5px;padding:12px}
.sgr-bundle-mini-card-copy small{color:#ffad96;font-size:9px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.sgr-bundle-mini-card-copy strong{color:#fff;font-size:15px;line-height:1.25;min-height:2.5em}
.sgr-bundle-mini-card-copy>span{color:#ffd45f;font-size:15px;font-weight:900}
.sgr-bundle-description{margin-top:16px;padding-top:16px;border-top:1px solid #ffffff12}
.sgr-bundle-description strong{display:block;margin-bottom:7px;color:#fff;font-size:15px}
.sgr-bundle-description p{margin:0;color:#c9bbc0;font-size:14px;line-height:1.55}
.sgr-bundle-offer-box{
  position:sticky;
  top:8px;
  padding:20px;
  border:1px solid #ffae6952;
  border-radius:18px;
  background:linear-gradient(160deg,#28151b,#1b1216 72%);
  box-shadow:0 22px 50px #0003;
}
.sgr-bundle-offer-label{display:block;margin-bottom:16px;color:#ffb294;font-size:10px;font-weight:950;letter-spacing:.1em;text-transform:uppercase}
.sgr-bundle-price-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:8px 0}
.sgr-bundle-price-row>span{color:#a9969e;font-size:13px;font-weight:720}
.sgr-bundle-price-row--old s{color:#c0adb5;font-size:17px;font-weight:750;text-decoration-thickness:1.5px}
.sgr-bundle-price-row--current{padding-top:3px;align-items:end}
.sgr-bundle-price-row--current>div{display:grid;justify-items:end;gap:2px}
.sgr-bundle-price-row--current strong{color:#ffd45f;font-size:38px;font-weight:950;letter-spacing:-.055em;line-height:1}
.sgr-bundle-price-row--current .sgr-detail-price-original{margin:0;color:#aa969f;font-size:13px}
.sgr-bundle-save-box{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:3px 10px;
  margin:14px 0 12px;
  padding:12px 13px;
  border:1px solid #ff805a55;
  border-radius:13px;
  background:linear-gradient(90deg,#ff4f6d1d,#ff9f4318);
}
.sgr-bundle-save-box span{color:#d8c7cd;font-size:11px;font-weight:780}
.sgr-bundle-save-box strong{color:#fff;font-size:19px;font-weight:950}
.sgr-bundle-save-box b{grid-row:1/3;grid-column:2;align-self:center;padding:7px 9px;border-radius:9px;background:#ff5a63;color:#fff;font-size:15px;font-weight:950}
.sgr-bundle-offer-note{margin:0 0 14px;color:#aa969f;font-size:12px;line-height:1.45}
.sgr-bundle-buy-button{margin-top:4px;background:linear-gradient(90deg,#ff4f6d,#ff7848)!important;border-color:#ffb26e!important;box-shadow:0 12px 28px #ff4f6d22;font-size:17px!important}
.sgr-bundle-owned-status{margin-top:12px;padding:12px;border-radius:12px;background:#ffffff0b;color:#ddd0d5}

@media(max-width:900px){
  .sgr-bundle-detail-panel{grid-template-columns:1fr!important}
  .sgr-bundle-offer-box{position:static}
  .sgr-bundle-mini-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:760px){
  /* Full /games/ catalogue must keep the same dark background as desktop.
     The homepage promotional catalogue intentionally keeps its own yellow section. */
  .games-catalog.catalog-section#games[data-sgr-catalog-page="1"]{
    background:transparent!important;
    color:inherit!important;
    padding:0!important;
  }

  /* Full-catalog mobile toolbar: search on top, sort + Filters below. Desktop is untouched. */
  #games[data-sgr-catalog-page="1"] .sgr-filter-bar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:10px!important;
    overflow:visible!important;
    padding:0!important;
    align-items:stretch!important;
  }
  #games[data-sgr-catalog-page="1"] .sgr-search-wrap{
    grid-column:1/-1!important;
    grid-row:1!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    flex:none!important;
  }
  #games[data-sgr-catalog-page="1"] .sgr-sort-wrap{
    grid-column:1!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    flex:none!important;
  }
  #games[data-sgr-catalog-page="1"] .sgr-sort-button{
    width:100%!important;
    min-width:0!important;
    height:46px!important;
    padding-left:34px!important;
    padding-right:28px!important;
    border:1px solid #5b3d49!important;
    border-radius:12px!important;
    background:#1d1217!important;
  }
  #games[data-sgr-catalog-page="1"] .sgr-sort-current-icon{left:9px!important}
  #games[data-sgr-catalog-page="1"] .sgr-sort-chevron{right:9px!important}
  #games[data-sgr-catalog-page="1"] .sgr-sort-label{max-width:none!important}
  #games[data-sgr-catalog-page="1"] .sgr-filter-difficulty,
  #games[data-sgr-catalog-page="1"] .sgr-filter-age,
  #games[data-sgr-catalog-page="1"] .sgr-filter-time,
  #games[data-sgr-catalog-page="1"] .sgr-filter-players,
  #games[data-sgr-catalog-page="1"] .sgr-filter-reset{display:none!important}
  #games[data-sgr-catalog-page="1"] .sgr-mobile-filter-trigger{
    grid-column:2;
    grid-row:2;
    min-width:0;
    height:46px;
    padding:0 13px;
    border:1px solid #5b3d49;
    border-radius:12px;
    background:#1d1217;
    color:#eadfe3;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    font:inherit;
    font-size:13px;
    font-weight:800;
    cursor:pointer;
  }
  #games[data-sgr-catalog-page="1"] .sgr-mobile-filter-trigger svg{width:18px;height:18px;fill:none;stroke:#ef9abb;stroke-width:2;stroke-linecap:round}
  #games[data-sgr-catalog-page="1"] .sgr-mobile-filter-trigger b{min-width:20px;height:20px;padding:0 6px;display:grid;place-items:center;border-radius:999px;background:#ef82aa;color:#2b111b;font-size:11px;font-weight:950}
  #games[data-sgr-catalog-page="1"] .sgr-mobile-filter-trigger.is-active{border-color:#a05a74;background:#281620}
  #games[data-sgr-catalog-page="1"] .sgr-result-count{margin-top:10px}

  .sgr-mobile-filter-open{overflow:hidden!important}
  .sgr-mobile-filter-overlay{
    position:fixed;
    z-index:10080;
    inset:0;
    display:flex;
    align-items:flex-end;
    justify-content:center;
  }
  .sgr-mobile-filter-overlay[hidden]{display:none!important}
  .sgr-mobile-filter-backdrop{position:absolute;inset:0;border:0;background:#050306bf;backdrop-filter:blur(6px)}
  .sgr-mobile-filter-sheet{
    position:relative;
    z-index:1;
    width:100%;
    max-height:min(82dvh,720px);
    overflow:auto;
    padding:0 16px max(16px,env(safe-area-inset-bottom));
    border:1px solid #5a3947;
    border-bottom:0;
    border-radius:22px 22px 0 0;
    background:#180d12;
    color:#f3e9ed;
    box-shadow:0 -26px 70px #0008;
    overscroll-behavior:contain;
  }
  .sgr-mobile-filter-sheet>header{
    position:sticky;
    z-index:2;
    top:0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin:0 -16px;
    padding:17px 16px 13px;
    border-bottom:1px solid #ffffff10;
    background:#180d12f5;
    backdrop-filter:blur(14px);
  }
  .sgr-mobile-filter-sheet>header small{display:block;margin-bottom:2px;color:#9e8992;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
  .sgr-mobile-filter-sheet>header h2{margin:0;font-size:25px;letter-spacing:-.04em}
  .sgr-mobile-filter-close{width:40px;height:40px;display:grid;place-items:center;border:1px solid #5a3947;border-radius:999px;background:#24151b;color:#fff;cursor:pointer}
  .sgr-mobile-filter-close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
  .sgr-mobile-filter-fields{display:grid;gap:14px;padding:18px 0}
  .sgr-mobile-filter-fields label{display:grid;gap:7px}
  .sgr-mobile-filter-fields label>span{color:#c7b5bd;font-size:12px;font-weight:780}
  .sgr-mobile-filter-fields select,.sgr-mobile-filter-fields input{
    width:100%;
    height:50px;
    padding:0 13px;
    border:1px solid #5b3d49;
    border-radius:12px;
    outline:none;
    background:#22141a;
    color:#f3e9ed;
    font:inherit;
    font-size:14px;
  }
  .sgr-mobile-filter-fields select{appearance:none;-webkit-appearance:none;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='%23bda8b1' 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 14px center;padding-right:38px}
  .sgr-mobile-filter-fields select:focus,.sgr-mobile-filter-fields input:focus{border-color:#ef82aa;box-shadow:0 0 0 3px #ef82aa18}
  .sgr-mobile-filter-sheet>footer{
    position:sticky;
    bottom:0;
    display:grid;
    grid-template-columns:1fr 1.35fr;
    gap:10px;
    margin:0 -16px;
    padding:13px 16px max(14px,env(safe-area-inset-bottom));
    border-top:1px solid #ffffff10;
    background:#180d12f5;
    backdrop-filter:blur(14px);
  }
  .sgr-mobile-filter-sheet>footer button{height:50px;border-radius:12px;font:inherit;font-size:14px;font-weight:900;cursor:pointer}
  .sgr-mobile-filter-reset{border:1px solid #60424d;background:#24161b;color:#d8c7ce}
  .sgr-mobile-filter-apply{border:1px solid #ffb26e;background:linear-gradient(90deg,#ef4f71,#ff7548);color:#fff;box-shadow:0 10px 24px #ef4f7125}

  /* Bundle remains the same product card size; promotional accents scale down for a phone. */
  .sgr-bundle-discount{width:70px;height:70px;top:8px;right:8px}
  .sgr-bundle-discount strong{font-size:22px}
  .sgr-bundle-discount small{font-size:8px}
  .sgr-bundle-ribbon{left:9px;bottom:9px;padding:7px 9px;font-size:9px}
  .sgr-bundle-card-games{grid-template-columns:1fr}
  .sgr-bundle-card-games span:nth-child(n+3){display:none}
  .sgr-bundle-detail-head{min-height:0;padding:21px 20px 115px;margin-bottom:14px}
  .sgr-bundle-detail-head h2{font-size:clamp(34px,10vw,48px)}
  .sgr-bundle-detail-head>p{font-size:17px}
  .sgr-bundle-detail-discount{top:auto;right:20px;bottom:18px;width:82px;height:82px}
  .sgr-bundle-detail-discount strong{font-size:27px}
  .sgr-bundle-showcase{padding:14px}
  .sgr-bundle-showcase-title{display:block}
  .sgr-bundle-showcase-title h3{font-size:23px}
  .sgr-bundle-showcase-title>span{display:block;margin-top:6px;white-space:normal}
  .sgr-bundle-mini-grid{grid-template-columns:1fr;gap:10px}
  .sgr-bundle-mini-card{display:grid;grid-template-columns:112px minmax(0,1fr)}
  .sgr-bundle-mini-card-cover{aspect-ratio:auto;height:100%;min-height:90px}
  .sgr-bundle-mini-card-copy strong{min-height:0}
  .sgr-bundle-offer-box{padding:16px}
  .sgr-bundle-price-row--current strong{font-size:34px}
}


/* v68 — one canonical compact card across homepage, /games/ and account companion styles.
   Bundle conforms to the game card; regular games are NOT stretched to the Bundle. */
#games .sgr-game-grid{align-items:flex-start!important}
#games .sgr-game-card{align-self:flex-start}

/* Normal game copy keeps its pre-v66 compact geometry. Pin the two-line title on
   phones too, so card height does not jump because of a one-line title. */
#games .sgr-game-card:not(.sgr-bundle-card) .sgr-card-copy>h3{
  min-height:2.16em!important;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}

/* Bundle upper + middle are one visual promo surface. It still uses the same
   16:9 cover + compact copy geometry as a normal game, so the lower commerce
   block starts at the same height. */
#games .sgr-bundle-card .sgr-card-main{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 82% 12%,#ffd45f22,transparent 30%),
    radial-gradient(circle at 8% 100%,#ff4f6d26,transparent 36%),
    linear-gradient(145deg,#32151f,#241118 66%,#351811);
}
#games .sgr-bundle-card .sgr-card-cover{
  position:relative;
  z-index:1;
  margin:0!important;
  border-radius:0!important;
  background:transparent!important;
}
#games .sgr-bundle-card .sgr-card-copy{
  position:relative;
  z-index:3;
  padding:17px 17px 12px!important;
  background:linear-gradient(180deg,rgba(39,17,25,.18),rgba(31,13,19,.9));
}
#games .sgr-bundle-card .sgr-card-copy>h3{
  min-height:2.16em!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  overflow:hidden!important;
}
#games .sgr-bundle-card .sgr-bundle-card-slogan{
  min-height:3.2em!important;
  margin:14px 0 16px!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  overflow:hidden!important;
  color:var(--card-muted,#eadce1)!important;
  font-size:15px!important;
  font-weight:650!important;
  line-height:1.55!important;
}
#games .sgr-bundle-card .sgr-bundle-saving-line{
  box-sizing:border-box;
  min-height:49px;
  margin:0!important;
  padding:8px 10px!important;
}
#games .sgr-bundle-card .sgr-bundle-card-games{display:none!important}

/* Fan looks like three actual mini product cards rather than loose images. */
#games .sgr-bundle-card--fan .sgr-bundle-collage img,
#games .sgr-bundle-card--fan .sgr-bundle-collage span{
  border:1px solid rgba(255,255,255,.38);
  box-shadow:0 12px 30px rgba(0,0,0,.42),0 0 0 2px rgba(255,255,255,.06);
}

/* A custom Bundle cover is allowed to occupy the WHOLE merged promo surface.
   Recommended source: 4:5 (1200×1500 px); object-fit crops it to the card while
   the lower gradient keeps the title readable. */
#games .sgr-bundle-card--custom-art .sgr-card-main::before{
  content:'';
  display:block;
  width:100%;
  aspect-ratio:16/9;
}
#games .sgr-bundle-card--custom-art .sgr-card-cover{
  position:absolute!important;
  z-index:0!important;
  inset:0!important;
  aspect-ratio:auto!important;
  width:100%!important;
  height:100%!important;
}
#games .sgr-bundle-card--custom-art .sgr-card-cover::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(14,7,10,.04) 18%,rgba(22,8,14,.15) 45%,rgba(24,8,14,.94) 78%,#18080e 100%);
}
#games .sgr-bundle-card--custom-art .sgr-card-cover>img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}
#games .sgr-bundle-card--custom-art .sgr-card-copy{
  background:transparent!important;
}
#games .sgr-bundle-card--custom-art .sgr-bundle-ribbon{
  top:46px;
  bottom:auto;
}

/* Bundle commerce area is exactly the regular compact commerce area. */
#games .sgr-bundle-card-bottom{
  align-items:end!important;
  gap:10px 14px!important;
  padding:13px 17px 16px!important;
}
#games .sgr-bundle-bottom-note{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px!important;
  font-weight:650!important;
}
#games .sgr-bundle-card-more{
  min-height:44px!important;
  height:44px!important;
  font-size:15px!important;
}

/* The same phone width on landing and the full catalogue: ~6 px per screen side. */
@media(max-width:720px){
  :root{--sgr-mobile-card-width:min(420px,calc(100vw - 12px))}

  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell{
    --sgr-mobile-card-width:min(420px,calc(100vw - 12px))!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{
    gap:12px!important;
    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:var(--sgr-mobile-card-width)!important;
  }

  #games[data-sgr-catalog-page] .sgr-game-grid{
    display:flex!important;
    flex-direction:column!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    gap:14px!important;
  }
  #games[data-sgr-catalog-page] .sgr-game-card,
  #games[data-sgr-catalog-page] .sgr-catalog-skeleton{
    flex:0 0 auto!important;
    width:var(--sgr-mobile-card-width)!important;
    max-width:var(--sgr-mobile-card-width)!important;
  }

  #games .sgr-game-card h3{min-height:2.16em!important}
  #games .sgr-bundle-discount{width:66px;height:66px;top:8px;right:8px}
  #games .sgr-bundle-discount strong{font-size:21px}
  #games .sgr-bundle-ribbon{left:9px;padding:7px 9px;font-size:9px}
}

/* v68 final compact price alignment: Bundle must not grow the card footer. */
#games .sgr-bundle-card-price{
  display:flex!important;
  align-items:baseline!important;
  justify-content:flex-end!important;
  gap:6px!important;
  min-height:24px!important;
  line-height:1!important;
}
#games .sgr-bundle-card-price s{
  margin:0!important;
  font-size:11px!important;
  line-height:1!important;
}
#games .sgr-bundle-card-price strong{
  font-size:20px!important;
  line-height:1!important;
  white-space:nowrap!important;
}

/* v68 final card equalization: compact content slots, without the v66 fixed 232px body. */
#games .sgr-game-card:not(.sgr-bundle-card) .sgr-card-copy>p{
  min-height:3.2em!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  overflow:hidden!important;
}

/* v68 desktop physical-width parity. The homepage rail now uses the same card
   width that /games/ and /account/ already derive from the 1480px catalogue grid. */
@media(min-width:1180px){
  :root{--sgr-game-card-width:calc((min(1480px, calc(100vw - 40px)) - 42px) / 4)}
}
@media(min-width:900px) and (max-width:1179px){
  :root{--sgr-game-card-width:calc((min(1480px, calc(100vw - 40px)) - 28px) / 3)}
}


/* v69 — mobile card gutter + Bundle compact promo cleanup. */
@media(max-width:720px){
  :root{--sgr-mobile-card-width:min(420px,calc(100vw - 24px))!important}

  #games:not([data-sgr-catalog-page]) > .sgr-rail-shell{
    --sgr-mobile-card-width:min(420px,calc(100vw - 24px))!important;
  }

  #games[data-sgr-catalog-page] .sgr-game-grid{
    width:100%!important;
    max-width:100%!important;
    padding-left:0!important;
    padding-right:0!important;
    box-sizing:border-box!important;
  }
  #games[data-sgr-catalog-page] .sgr-game-card,
  #games[data-sgr-catalog-page] .sgr-catalog-skeleton{
    width:min(420px,100%)!important;
    max-width:min(420px,100%)!important;
  }
}

/* No separate Economy box on the compact Bundle card. The promo ribbon now
   closes the merged upper surface, immediately before the commerce footer. */
#games .sgr-bundle-saving-line{display:none!important}
#games .sgr-bundle-ribbon-slot{
  min-height:49px;
  display:flex;
  align-items:flex-end;
  justify-content:flex-start;
  margin:0!important;
  padding:0!important;
}
#games .sgr-bundle-ribbon-slot .sgr-bundle-ribbon{
  position:static!important;
  inset:auto!important;
  display:inline-flex!important;
  width:max-content!important;
  max-width:100%!important;
  margin:0!important;
  transform:none!important;
}
#games .sgr-bundle-card--custom-art .sgr-bundle-ribbon-slot .sgr-bundle-ribbon{
  position:static!important;
  inset:auto!important;
}

/* v70 — mobile typography parity with desktop cards.
   Keep body copy unchanged; increase card titles so the title/description
   hierarchy matches the large-screen ratio. Shared by landing and /games/. */
@media(max-width:720px){
  #games .sgr-game-card h3{
    font-size:25px!important;
    line-height:1.08!important;
    font-weight:700!important;
  }
  #games .sgr-game-card .sgr-card-copy>p{
    font-size:15px!important;
    line-height:1.55!important;
  }
}


/* v73 — bundle artwork system.
   Small card master: 1200x1800 (2:3).
   Expanded hero master: 1920x1080 (16:9).
   Small-card title/subtitle overlay is opt-in: it exists only when short_description is non-empty. */
.sgr-bundle-badge{
  background:linear-gradient(90deg,#ff4f6d,#ff7848)!important;
  color:#fff!important;
  border-color:#ffb26e!important;
  box-shadow:0 9px 24px #ff4f6d35,0 5px 18px #0004!important;
}
.sgr-bundle-card .sgr-card-cover{
  aspect-ratio:2/3!important;
  background:#120d10;
}
.sgr-bundle-card .sgr-card-cover>img,
.sgr-bundle-card .sgr-bundle-collage{width:100%;height:100%;object-fit:cover}
.sgr-bundle-card-copy-overlay{
  position:absolute;
  z-index:4;
  inset:auto 0 0;
  min-height:40%;
  padding:96px 18px 18px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:8px;
  background:linear-gradient(180deg,rgba(16,8,12,0) 0%,rgba(16,8,12,.18) 24%,rgba(16,8,12,.82) 72%,rgba(16,8,12,.95) 100%);
  color:#fff;
  text-align:left;
  pointer-events:none;
}
.sgr-bundle-card-copy-overlay h3{
  min-height:0!important;
  margin:0!important;
  color:#fff!important;
  font-size:clamp(25px,2.1vw,32px)!important;
  font-weight:900!important;
  letter-spacing:-.045em!important;
  line-height:1.02!important;
  text-wrap:balance;
}
.sgr-bundle-card-copy-overlay p{
  min-height:0!important;
  margin:0!important;
  color:#f5e9ed!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2!important;
  overflow:hidden;
  font-size:14px!important;
  font-weight:700!important;
  line-height:1.35!important;
  opacity:.94!important;
}
.sgr-bundle-card--clean-art .sgr-card-cover::after{content:none!important}

/* Expanded bundle: the hero image fills the offer, commercial UI stays editable HTML above it. */
.sgr-bundle-hero-stage{
  position:relative;
  isolation:isolate;
  clear:both;
  width:100%;
  min-height:clamp(560px,60vw,760px);
  aspect-ratio:16/9;
  margin:0 0 20px;
  display:grid;
  align-items:end;
  overflow:hidden;
  border:1px solid #ffffff1c;
  border-radius:22px;
  background:linear-gradient(135deg,#25131a,#351a1f 58%,#171114);
  box-shadow:0 24px 72px #0004;
}
.sgr-bundle-hero-background{
  position:absolute;
  z-index:-3;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.sgr-bundle-hero-scrim{
  position:absolute;
  z-index:-2;
  inset:0;
  background:
    linear-gradient(90deg,rgba(8,4,6,.18) 0%,rgba(8,4,6,.06) 48%,rgba(8,4,6,.12) 100%),
    linear-gradient(180deg,rgba(8,4,6,.03) 24%,rgba(8,4,6,.28) 58%,rgba(8,4,6,.82) 100%);
}
.sgr-bundle-hero-offer{
  width:min(760px,calc(100% - 48px));
  margin:24px;
  padding:22px;
  border:1px solid #ffffff28;
  border-radius:18px;
  background:linear-gradient(155deg,rgba(31,16,21,.88),rgba(17,11,14,.94));
  -webkit-backdrop-filter:blur(16px) saturate(1.08);
  backdrop-filter:blur(16px) saturate(1.08);
  box-shadow:0 22px 55px #0007;
}
.sgr-bundle-hero-offer h2{
  max-width:680px;
  margin:0;
  color:#fff;
  font-size:clamp(36px,4vw,58px);
  font-weight:900;
  letter-spacing:-.055em;
  line-height:.98;
  text-wrap:balance;
}
.sgr-bundle-detail-kicker{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px}
.sgr-bundle-detail-kicker span,
.sgr-bundle-detail-kicker b,
.sgr-bundle-inline-discount{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:7px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.055em;
  line-height:1;
  text-transform:uppercase;
}
.sgr-bundle-detail-kicker span{
  background:linear-gradient(90deg,#ff4f6d,#ff7848)!important;
  color:#fff!important;
  border:1px solid #ffb26e;
}
.sgr-bundle-detail-kicker b{background:#ffffff16;color:#fff;border:1px solid #ffffff24}
.sgr-bundle-inline-discount{background:#ffd45f;color:#381720;border:1px solid #fff0a5}
.sgr-bundle-hero-lead{max-width:660px;margin:12px 0 0;color:#f6e8ed;font-size:16px;font-weight:700;line-height:1.45}
.sgr-bundle-purchase-facts{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0}
.sgr-bundle-purchase-facts span{padding:8px 10px;border:1px solid #ffffff20;border-radius:10px;background:#ffffff0d;color:#eee1e6;font-size:12px;font-weight:760}
.sgr-bundle-purchase-facts b{color:#fff;font-size:14px}
.sgr-bundle-hero-commerce{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:end;margin-top:18px;padding-top:16px;border-top:1px solid #ffffff1c}
.sgr-bundle-hero-prices{display:grid;gap:8px}
.sgr-bundle-hero-old,.sgr-bundle-hero-current{display:flex;align-items:baseline;gap:12px}
.sgr-bundle-hero-old span,.sgr-bundle-hero-current>span{min-width:112px;color:#bbaab1;font-size:12px;font-weight:760}
.sgr-bundle-hero-old s{color:#c9b8be;font-size:17px;font-weight:760;text-decoration-thickness:1.5px}
.sgr-bundle-hero-current>div{display:flex;align-items:baseline;gap:8px}
.sgr-bundle-hero-current strong{color:#ffd45f;font-size:38px;font-weight:950;letter-spacing:-.055em;line-height:1}
.sgr-bundle-hero-current .sgr-detail-price-original{margin:0;color:#c4b3b9;font-size:13px}
.sgr-bundle-hero-saving{display:grid;grid-template-columns:auto auto;align-items:center;gap:2px 8px;padding:10px 12px;border:1px solid #ff9c6455;border-radius:12px;background:linear-gradient(90deg,#ff4f6d20,#ff9f431d)}
.sgr-bundle-hero-saving span{color:#d9cbd0;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.sgr-bundle-hero-saving strong{color:#fff;font-size:18px;font-weight:950}
.sgr-bundle-hero-saving b{grid-row:1/3;grid-column:2;padding:6px 8px;border-radius:8px;background:#ff5a63;color:#fff;font-size:14px;font-weight:950}
.sgr-bundle-hero-note{margin:14px 0 0;color:#cdbec4;font-size:12px;line-height:1.5}
.sgr-bundle-hero-offer .sgr-bundle-buy-button{margin-top:16px}
.sgr-bundle-showcase--detail{margin-top:0;padding:20px;border:1px solid #ffffff12;border-radius:18px;background:#ffffff08}

@media(max-width:760px){
  .sgr-bundle-card .sgr-card-cover{aspect-ratio:2/3!important}
  .sgr-bundle-card-copy-overlay{padding:80px 16px 16px;min-height:42%}
  .sgr-bundle-card-copy-overlay h3{font-size:29px!important}
  .sgr-bundle-hero-stage{min-height:680px;aspect-ratio:auto;border-radius:17px}
  .sgr-bundle-hero-background{object-position:center top}
  .sgr-bundle-hero-scrim{background:linear-gradient(180deg,rgba(8,4,6,.02) 12%,rgba(8,4,6,.25) 40%,rgba(8,4,6,.88) 72%,rgba(8,4,6,.96) 100%)}
  .sgr-bundle-hero-offer{width:calc(100% - 24px);margin:12px;padding:17px;border-radius:15px}
  .sgr-bundle-hero-offer h2{font-size:clamp(31px,10vw,44px)}
  .sgr-bundle-hero-commerce{grid-template-columns:1fr;align-items:start}
  .sgr-bundle-hero-saving{justify-self:start}
  .sgr-bundle-showcase-title{align-items:start;flex-direction:column;gap:7px}
  .sgr-bundle-showcase-title>span{white-space:normal}
}

@media(max-width:430px){
  .sgr-bundle-hero-stage{min-height:640px}
  .sgr-bundle-hero-old span,.sgr-bundle-hero-current>span{min-width:100px}
  .sgr-bundle-hero-current strong{font-size:34px}
}

/* v74 — bundle image geometry.
   Public storefront is full-bleed: artwork may differ slightly from the recommended
   master ratio, but must never create empty bars. The browser crops only the excess.
   Small bundle artwork master: 1400x1600 (7:8); commerce footer stays outside artwork. */
#games .sgr-bundle-card .sgr-card-cover{
  aspect-ratio:7/8!important;
  width:100%!important;
  overflow:hidden!important;
}
#games .sgr-bundle-card .sgr-card-cover>img,
#games .sgr-bundle-card .sgr-bundle-collage{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}
/* Custom artwork uses the same responsive artwork area; footer remains separate. */
#games .sgr-bundle-card--custom-art .sgr-card-main::before{
  aspect-ratio:7/8!important;
}
#games .sgr-bundle-card--custom-art .sgr-card-cover{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  aspect-ratio:auto!important;
}
/* v73's optional copy overlay owns the fade. No second permanent filter. */
#games .sgr-bundle-card--custom-art .sgr-card-cover::after{
  content:none!important;
  background:none!important;
}
.sgr-bundle-card--clean-art .sgr-card-cover::after{content:none!important}

/* Expanded artwork: 16:9 is the design master; cover guarantees edge-to-edge fill
   when the uploaded source is slightly off-ratio. */
.sgr-bundle-hero-background{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}
@media(max-width:760px){
  #games .sgr-bundle-card .sgr-card-cover{aspect-ratio:7/8!important}
  .sgr-bundle-hero-background{object-position:center top!important}
}


/* v75 — bundle presentation controls + cherry commerce theme.
   Small card copy visibility is independent from the required internal bundle title.
   The footer is a separate commerce surface; artwork remains 7:8 full-bleed. */
#games .sgr-bundle-card-bottom{
  background:#5f263d!important;
  border-top-color:#7e4f5f!important;
  color:#fff7f4!important;
}
#games .sgr-bundle-card-bottom .sgr-card-author,
#games .sgr-bundle-card-bottom .sgr-bundle-bottom-note,
#games .sgr-bundle-card-bottom .sgr-bundle-card-price,
#games .sgr-bundle-card-bottom .sgr-bundle-card-price s,
#games .sgr-bundle-card-bottom .sgr-bundle-card-price strong{color:#fff7f4!important}
#games .sgr-bundle-card-bottom .sgr-bundle-card-price s{opacity:.72!important}

/* Expanded offer uses the same cherry family as the site. The artwork remains the
   background; this plate is UI and never needs to be baked into the image. */
.sgr-bundle-hero-offer{
  color:#5f263d!important;
  border-color:#ffffffb8!important;
  background:linear-gradient(155deg,rgba(255,249,246,.94),rgba(255,240,238,.91))!important;
  box-shadow:0 22px 55px #43172542!important;
}
.sgr-bundle-hero-offer h2{color:#5f263d!important}
.sgr-bundle-hero-lead{color:#6f3a4d!important}
.sgr-bundle-detail-kicker b{
  background:#f5e5e8!important;
  color:#5f263d!important;
  border-color:#d8b8c2!important;
}
.sgr-bundle-purchase-facts span{
  background:#fff7f4d9!important;
  color:#6f3a4d!important;
  border-color:#d8b8c2!important;
}
.sgr-bundle-purchase-facts b{color:#5f263d!important}
.sgr-bundle-hero-commerce{border-top-color:#d8b8c2!important}
.sgr-bundle-hero-old span,.sgr-bundle-hero-current>span{color:#8c6674!important}
.sgr-bundle-hero-old s{color:#9b7482!important}
.sgr-bundle-hero-current strong{color:#5f263d!important}
.sgr-bundle-hero-current .sgr-detail-price-original{color:#9b7482!important}
.sgr-bundle-hero-saving{
  border-color:#d98a9f!important;
  background:linear-gradient(90deg,#fce5ea,#fff0e8)!important;
}
.sgr-bundle-hero-saving span{color:#8c6674!important}
.sgr-bundle-hero-saving strong{color:#5f263d!important}
.sgr-bundle-hero-note{color:#765061!important}
.sgr-bundle-owned-status{background:#5f263d0d!important;color:#5f263d!important;border:1px solid #d8b8c2!important}

/* What is included: reuse the real catalog-card renderer, with no extra API fan-out.
   Full detail is fetched only if a user explicitly opens one included game. */
.sgr-bundle-included-grid{
  margin-top:18px;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}
.sgr-bundle-included-grid .sgr-game-card{height:100%}
.sgr-bundle-included-grid .sgr-card-cover{aspect-ratio:16/9}
@media(max-width:1080px){.sgr-bundle-included-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.sgr-bundle-included-grid{grid-template-columns:1fr}}

/* v76 — Bundle parity + game-detail structure.
   Small Bundle card follows the exact responsive card geometry of ordinary games.
   The recommended source artwork remains 1400x1600 (7:8), but storefront rendering
   is full-bleed cover so a slightly off-ratio upload never creates empty bars. */
:is(#games,#store-grid) .sgr-bundle-card{
  display:flex!important;
  flex-direction:column!important;
  height:var(--sgr-bundle-sync-height,auto)!important;
  background:var(--card)!important;
  border-color:var(--card-border)!important;
}
:is(#games,#store-grid) .sgr-bundle-card .sgr-card-main{
  position:relative!important;
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:hidden!important;
  background:var(--card)!important;
}
:is(#games,#store-grid) .sgr-bundle-card .sgr-card-main::before{
  content:''!important;
  display:block!important;
  width:100%!important;
  aspect-ratio:7/8!important;
}
:is(#games,#store-grid) .sgr-bundle-card--height-synced .sgr-card-main::before{display:none!important}
:is(#games,#store-grid) .sgr-bundle-card .sgr-card-cover,
:is(#games,#store-grid) .sgr-bundle-card--custom-art .sgr-card-cover{
  position:absolute!important;
  z-index:1!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  aspect-ratio:auto!important;
  margin:0!important;
  border-radius:0!important;
  overflow:hidden!important;
  background:var(--card)!important;
}
:is(#games,#store-grid) .sgr-bundle-card .sgr-card-cover>img,
:is(#games,#store-grid) .sgr-bundle-card .sgr-bundle-collage{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}
:is(#games,#store-grid) .sgr-bundle-card-bottom{
  flex:0 0 auto!important;
  background:var(--card)!important;
  border-top-color:#ffffff17!important;
  color:#f7f7f2!important;
}
:is(#games,#store-grid) .sgr-bundle-card-bottom .sgr-card-author,
:is(#games,#store-grid) .sgr-bundle-card-bottom .sgr-bundle-bottom-note,
:is(#games,#store-grid) .sgr-bundle-card-bottom .sgr-bundle-card-price,
:is(#games,#store-grid) .sgr-bundle-card-bottom .sgr-bundle-card-price strong{color:#f7f7f2!important}
:is(#games,#store-grid) .sgr-bundle-card-bottom .sgr-bundle-card-price s{color:#b9aaaF!important;opacity:.72!important}
:is(#games,#store-grid) .sgr-bundle-card .sgr-card-more{
  background:var(--accent)!important;
  border-color:var(--accent2)!important;
}


/* v91 — account uses the exact same Bundle-card component as public catalog.
   Only its outer grid sizing is adapted to the account content column. */
#store-grid > .sgr-game-card{
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  flex:none!important;
  align-self:stretch!important;
}
@media(max-width:820px){
  #store-grid > .sgr-game-card{width:100%!important;max-width:100%!important;}
}

/* Bundle detail now mirrors an ordinary game detail: badge + title, left content,
   right secondary content. The old full-background sales hero is intentionally unused. */
.sgr-bundle-detail-panel-v76{
  grid-template-columns:minmax(410px,.88fr) minmax(0,1.32fr)!important;
  gap:24px!important;
  align-items:start!important;
}
.sgr-bundle-detail-cover-v76{
  aspect-ratio:16/9!important;
  border-color:color-mix(in srgb,var(--theme-outline,#315347) 78%,transparent)!important;
  background:var(--theme-surface,#0b2b20)!important;
}
.sgr-bundle-detail-cover-v76 img{object-fit:cover!important;object-position:center!important}
.sgr-bundle-detail-left-v76 .sgr-detail-description h3{color:var(--theme-primary,#62c295)!important}

/* Commerce / CTA under the description. No Economy box and no explanatory library copy. */
.sgr-bundle-commerce-v76{
  position:relative;
  margin-top:22px;
  padding:18px;
  border:1px solid color-mix(in srgb,var(--theme-outline,#315347) 82%,transparent);
  border-radius:16px;
  background:linear-gradient(145deg,var(--theme-surface,#0b2b20),var(--theme-surface-high,#123d30));
  box-shadow:0 14px 34px #0002;
  overflow:visible;
}
.sgr-bundle-commerce-prices-v76{
  display:grid;
  gap:8px;
  padding-right:98px;
}
.sgr-bundle-commerce-prices-v76>div{display:flex;align-items:baseline;gap:12px;min-height:28px}
.sgr-bundle-commerce-prices-v76 span:first-child{min-width:104px;color:var(--theme-muted,#b5c6bf);font-size:13px;font-weight:720}
.sgr-bundle-commerce-prices-v76 s{color:var(--theme-muted,#b5c6bf);font-size:18px;font-weight:760;text-decoration-thickness:1.5px}
.sgr-bundle-commerce-prices-v76 strong{color:var(--theme-text,#f7f7f2);font-size:34px;font-weight:950;letter-spacing:-.045em;line-height:1}
.sgr-bundle-commerce-prices-v76 .sgr-detail-price-original{margin:0!important}
.sgr-bundle-commerce-discount-v76{
  top:-16px!important;
  right:14px!important;
  width:82px!important;
  height:82px!important;
}
.sgr-bundle-commerce-discount-v76 small{font-size:9px!important}
.sgr-bundle-commerce-discount-v76 strong{font-size:24px!important}
.sgr-bundle-commerce-v76 .sgr-bundle-buy-button{margin-top:16px!important}
.sgr-bundle-owned-status{background:#ffffff0b!important;color:var(--theme-text,#f7f7f2)!important;border:1px solid color-mix(in srgb,var(--theme-outline,#315347) 70%,transparent)!important}

/* Right column: only “Что входит” and three proportionally reduced catalog cards. */
.sgr-bundle-included-panel-v76>h3{
  margin:0 0 14px;
  color:var(--theme-text,#f7f7f2);
  font-size:27px;
  letter-spacing:-.035em;
}
.sgr-bundle-included-grid-v76{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  margin:0!important;
  align-items:stretch!important;
}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card{
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  height:100%!important;
  border-radius:14px!important;
  box-shadow:0 10px 28px #0003!important;
  transform:none!important;
  display:flex!important;
  flex-direction:column!important;
}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card:hover{transform:translateY(-2px)!important}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-main{flex:1 1 auto!important}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-cover{
  position:relative!important;
  inset:auto!important;
  width:100%!important;
  height:auto!important;
  aspect-ratio:16/9!important;
  margin:0!important;
  border-radius:0!important;
}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-game-type-badge{
  top:7px!important;left:7px!important;min-height:22px!important;padding:4px 7px!important;font-size:8px!important
}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-copy{padding:10px 10px 8px!important}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card h3{
  min-height:2.16em!important;
  font-size:15px!important;
  line-height:1.08!important;
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  overflow:hidden!important;
}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-copy>p{
  min-height:2.8em!important;
  margin:8px 0 9px!important;
  font-size:10px!important;
  line-height:1.4!important;
  -webkit-line-clamp:2!important;
}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-facts{gap:3px!important;padding-top:8px!important}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-facts small{margin-bottom:3px!important;font-size:7px!important}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-facts strong{font-size:9px!important}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-bottom{
  margin-top:auto!important;
  grid-template-columns:1fr!important;
  gap:7px!important;
  padding:9px 10px 10px!important;
}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-author{font-size:9px!important}
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-more{
  grid-column:1!important;
  height:34px!important;
  min-height:34px!important;
  border-radius:9px!important;
  font-size:11px!important;
}

/* Inline read-only detail for an included game: deliberately no price and no buy CTA. */
.sgr-bundle-included-expanded-v76[hidden]{display:none!important}
.sgr-bundle-included-expanded-v76{margin-top:14px}
.sgr-bundle-included-detail-card{
  position:relative;
  padding:17px;
  border:1px solid color-mix(in srgb,var(--theme-outline,#315347) 76%,transparent);
  border-radius:15px;
  background:color-mix(in srgb,var(--theme-surface,#0b2b20) 92%,#fff 8%);
}
.sgr-bundle-included-detail-card h4{margin:0 42px 10px 0;color:var(--theme-text,#fff);font-size:24px;letter-spacing:-.035em}
.sgr-bundle-included-detail-description{margin:0 0 14px;color:var(--theme-text,#fff);font-size:15px;line-height:1.5}
.sgr-bundle-included-detail-close{
  position:absolute;top:12px;right:12px;width:32px;height:32px;border:1px solid #ffffff2c;border-radius:999px;background:#0003;color:#fff;font-size:22px;line-height:1;cursor:pointer
}
.sgr-bundle-included-detail-card .sgr-detail-facts{grid-template-columns:repeat(5,minmax(0,1fr))}
.sgr-bundle-included-detail-card .sgr-rounds h3{font-size:21px}

@media(max-width:1080px){
  .sgr-bundle-detail-panel-v76{grid-template-columns:1fr!important}
  .sgr-bundle-included-grid-v76{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:720px){
  .sgr-bundle-commerce-prices-v76{padding-right:80px}
  .sgr-bundle-commerce-discount-v76{width:70px!important;height:70px!important;right:9px!important}
  .sgr-bundle-included-grid-v76{grid-template-columns:1fr!important}
  .sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-copy>p{font-size:13px!important}
  .sgr-bundle-included-grid-v76 .sgr-bundle-included-card h3{font-size:20px!important}
  .sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-facts small{font-size:9px!important}
  .sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-facts strong{font-size:12px!important}
  .sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-card-author{font-size:11px!important}
  .sgr-bundle-included-detail-card .sgr-detail-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* v77 — Bundle micro-polish.
   - instant card hover parity with regular game cards;
   - restore the original Bundle CTA + gold bundle price;
   - title-case Bundle badge;
   - game-detail typography/color parity;
   - mobile included-game detail opens as an overlay rather than below the cards. */

/* Bundle card hover must use the exact same timing as ordinary game cards. */
#games .sgr-bundle-card{
  transition:transform .22s ease,box-shadow .22s ease!important;
  transition-delay:0s!important;
  will-change:transform;
}
#games .sgr-bundle-card:hover{
  transform:translateY(-4px)!important;
  box-shadow:0 25px 55px #3410182b,0 0 0 1px #ffcf5a24 inset!important;
}

/* Human-readable badge casing. */
.sgr-bundle-badge{
  text-transform:none!important;
  letter-spacing:.035em!important;
}

/* Small Bundle commerce: one aligned price line + original Bundle colors. */
#games .sgr-bundle-card-bottom{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:10px!important;
  align-items:stretch!important;
}
#games .sgr-bundle-price-line-v77{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:end!important;
  gap:12px!important;
  width:100%!important;
}
#games .sgr-bundle-price-line-v77 .sgr-bundle-bottom-note{
  align-self:end!important;
  min-width:0!important;
  color:var(--card-muted,#c8bac0)!important;
  font-size:12px!important;
  font-weight:760!important;
  line-height:1.2!important;
  white-space:normal!important;
}
#games .sgr-bundle-card-price{
  display:flex!important;
  align-items:baseline!important;
  justify-content:flex-end!important;
  gap:7px!important;
  min-width:max-content!important;
}
#games .sgr-bundle-card-price s{
  color:var(--card-muted,#b9abb0)!important;
  opacity:.75!important;
}
#games .sgr-bundle-card-price strong{
  color:#ffd45f!important;
  font-size:20px!important;
  font-weight:950!important;
}
#games .sgr-bundle-card-more{
  min-height:44px!important;
  height:44px!important;
  color:#fff!important;
  background:linear-gradient(90deg,#ff4f6d,#ff7848)!important;
  border-color:#ffb26e!important;
  box-shadow:0 10px 26px #ff4f6d26!important;
  font-weight:900!important;
}
#games .sgr-bundle-card-more:hover{filter:brightness(1.06)!important}

/* Expanded Bundle detail uses the same text rules as a normal game detail. */
.sgr-bundle-detail-left-v76 .sgr-detail-description h3,
.sgr-bundle-included-panel-v76>h3{
  margin:11px 0 5px!important;
  color:var(--theme-primary,#3f9d73)!important;
  font-size:18px!important;
  line-height:1.2!important;
  font-weight:650!important;
  letter-spacing:-.035em!important;
}
.sgr-bundle-detail-left-v76 .sgr-detail-description p{
  color:var(--theme-text,#eef4f0)!important;
  font-size:18px!important;
  line-height:1.5!important;
  font-weight:650!important;
}
.sgr-bundle-commerce-prices-v76 strong{
  color:#ffd45f!important;
}

/* Fix the scaled "Квиз" badge geometry in included mini cards. */
.sgr-bundle-included-grid-v76 .sgr-bundle-included-card .sgr-game-type-badge{
  top:8px!important;
  left:8px!important;
  width:auto!important;
  max-width:calc(100% - 16px)!important;
  min-height:22px!important;
  height:auto!important;
  padding:5px 8px!important;
  border-radius:999px!important;
  line-height:1!important;
  font-size:8px!important;
  transform:none!important;
}

/* Included-game read-only detail adopts the clicked mini-card palette. */
.sgr-bundle-included-expanded-v77[hidden]{display:none!important}
.sgr-bundle-included-detail-card{
  color:var(--card-text,#f7f7f2)!important;
  background:var(--card,#0b2b20)!important;
  border-color:var(--card-border,#315e4e)!important;
}
.sgr-bundle-included-detail-card h4{
  margin:0 46px 10px 0!important;
  color:var(--card-text,#fff)!important;
  font-size:clamp(36px,4vw,60px)!important;
  line-height:1!important;
  font-weight:700!important;
  letter-spacing:-.04em!important;
}
.sgr-bundle-included-detail-description{
  margin:0 0 14px!important;
  color:var(--card-text,#fff)!important;
  font-size:18px!important;
  line-height:1.5!important;
  font-weight:650!important;
}
.sgr-bundle-included-detail-card .sgr-detail-facts small,
.sgr-bundle-included-detail-card .sgr-round-row b,
.sgr-bundle-included-detail-card .sgr-no-rounds{color:var(--card-muted,#b5c6bf)!important}
.sgr-bundle-included-detail-card .sgr-detail-facts strong,
.sgr-bundle-included-detail-card .sgr-rounds h3{color:var(--card-text,#fff)!important}
.sgr-bundle-included-detail-close{
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  line-height:0!important;
}
.sgr-bundle-included-detail-close svg{
  display:block!important;
  width:16px!important;
  height:16px!important;
}
.sgr-bundle-included-detail-close path{
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2.4!important;
  stroke-linecap:round!important;
}

/* On phones the included-game description is a nested modal, not a block below cards. */
@media(max-width:720px){
  .sgr-bundle-included-expanded-v77:not([hidden]){
    position:fixed!important;
    z-index:10050!important;
    inset:0!important;
    display:grid!important;
    place-items:start center!important;
    margin:0!important;
    padding:14px!important;
    overflow:auto!important;
    overscroll-behavior:contain!important;
    background:#050708de!important;
    -webkit-backdrop-filter:blur(8px)!important;
    backdrop-filter:blur(8px)!important;
  }
  .sgr-bundle-included-expanded-v77 .sgr-bundle-included-detail-card{
    width:min(100%,680px)!important;
    margin:auto 0!important;
    padding:18px!important;
    border-radius:17px!important;
    box-shadow:0 28px 80px #0009!important;
  }
  .sgr-bundle-included-detail-card h4{
    font-size:34px!important;
  }
}

/* v79 — Bundle commerce repair.
   Fixes malformed v78 CSS, restores the pre-v77 price layout, preserves
   the requested gradient CTA / gold price, and keeps v78 included-card behavior. */

/* Mini Bundle: restore the earlier two-column commerce layout. */
#games .sgr-bundle-card .sgr-bundle-card-bottom{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:end!important;
  gap:10px 14px!important;
  padding:13px 17px 16px!important;
  background:var(--card)!important;
  color:#f7f7f2!important;
}
#games .sgr-bundle-card .sgr-bundle-card-bottom .sgr-card-author{
  min-width:0!important;
  align-self:end!important;
}
#games .sgr-bundle-card .sgr-bundle-bottom-note{
  display:block!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:var(--card-muted,#c8bac0)!important;
  font-size:13px!important;
  font-weight:650!important;
  line-height:1.25!important;
}
#games .sgr-bundle-card .sgr-bundle-card-price{
  display:grid!important;
  justify-items:end!important;
  align-self:end!important;
  gap:2px!important;
  line-height:1!important;
  white-space:nowrap!important;
}
#games .sgr-bundle-card .sgr-bundle-card-price s{
  margin:0!important;
  color:var(--card-muted,#b9abb0)!important;
  font-size:12px!important;
  font-weight:650!important;
  opacity:.75!important;
}
#games .sgr-bundle-card .sgr-bundle-card-price strong{
  color:#ffd45f!important;
  font-size:24px!important;
  font-weight:950!important;
  letter-spacing:-.04em!important;
}
#games .sgr-bundle-card .sgr-bundle-card-more{
  grid-column:1/-1!important;
  min-height:44px!important;
  height:44px!important;
  color:#fff!important;
  background:linear-gradient(90deg,#ff4f6d,#ff7848)!important;
  border-color:#ffb26e!important;
  box-shadow:0 10px 26px #ff4f6d26!important;
  font-weight:900!important;
}
#games .sgr-bundle-card .sgr-bundle-card-more:hover{
  filter:brightness(1.06)!important;
}

/* Expanded Bundle: return the original stacked label/value price layout. */
.sgr-bundle-commerce-v76 .sgr-bundle-commerce-prices-v76{
  display:grid!important;
  gap:8px!important;
  padding-right:98px!important;
}
.sgr-bundle-commerce-v76 .sgr-bundle-commerce-prices-v76>div{
  display:flex!important;
  align-items:baseline!important;
  justify-content:flex-start!important;
  gap:12px!important;
  min-height:28px!important;
}
.sgr-bundle-commerce-v76 .sgr-bundle-commerce-prices-v76 span:first-child{
  min-width:104px!important;
  color:var(--theme-muted,#b5c6bf)!important;
  font-size:13px!important;
  font-weight:720!important;
}
.sgr-bundle-commerce-v76 .sgr-bundle-commerce-prices-v76 s{
  color:var(--theme-muted,#b5c6bf)!important;
  font-size:18px!important;
  font-weight:760!important;
  text-decoration-thickness:1.5px!important;
}
.sgr-bundle-commerce-v76 .sgr-bundle-commerce-prices-v76 strong{
  color:#ffd45f!important;
  font-size:34px!important;
  font-weight:950!important;
  letter-spacing:-.045em!important;
  line-height:1!important;
}

/* Included cards: whole card remains the detail trigger. */
.sgr-bundle-included-card[data-sgr-bundle-game-detail]{cursor:pointer!important}
.sgr-bundle-included-card[data-sgr-bundle-game-detail]:focus-visible{
  outline:2px solid var(--accent,#62c295)!important;
  outline-offset:3px!important;
}
.sgr-bundle-included-card[data-sgr-bundle-game-detail] .sgr-card-more{pointer-events:none!important}

/* Expanded included-game detail inherits both primary and secondary game palette. */
.sgr-bundle-included-detail-card{
  color:var(--theme-text,var(--card-text,#f7f7f2))!important;
  background:var(--theme-surface,var(--card,#0b2b20))!important;
  border-color:var(--theme-outline,var(--card-border,#315e4e))!important;
}
.sgr-bundle-included-detail-card h4,
.sgr-bundle-included-detail-card .sgr-bundle-included-detail-description,
.sgr-bundle-included-detail-card .sgr-detail-facts strong,
.sgr-bundle-included-detail-card .sgr-rounds h3,
.sgr-bundle-included-detail-card .sgr-round-row strong,
.sgr-bundle-included-detail-card .sgr-round-row span{
  color:var(--theme-text,var(--card-text,#fff))!important;
}
.sgr-bundle-included-detail-card .sgr-detail-facts small,
.sgr-bundle-included-detail-card .sgr-round-row b,
.sgr-bundle-included-detail-card .sgr-no-rounds{
  color:var(--theme-muted,var(--card-muted,#b5c6bf))!important;
}
.sgr-bundle-included-detail-card .sgr-detail-facts,
.sgr-bundle-included-detail-card .sgr-round-row,
.sgr-bundle-included-detail-card .sgr-no-rounds{
  border-color:var(--theme-outline,var(--card-border,#315e4e))!important;
  background:color-mix(in srgb,var(--theme-surface-high,var(--card-surface-high,#123d30)) 88%,var(--theme-text,#fff) 12%)!important;
}
.sgr-bundle-included-detail-card .sgr-tags span{
  color:var(--theme-text,var(--card-text,#fff))!important;
  background:var(--theme-surface-high,var(--card-surface-high,#123d30))!important;
}
.sgr-bundle-included-detail-card .sgr-bundle-included-detail-close{
  color:var(--theme-text,#fff)!important;
  border-color:color-mix(in srgb,var(--theme-outline,#fff) 70%,transparent)!important;
  background:color-mix(in srgb,var(--theme-surface-high,#000) 82%,transparent)!important;
}

@media(max-width:720px){
  #games .sgr-bundle-card .sgr-bundle-bottom-note{font-size:12px!important}
  .sgr-bundle-commerce-v76 .sgr-bundle-commerce-prices-v76{padding-right:80px!important}
}

/* v90 — on phones, an included-game detail fully covers the Bundle detail shell.
   No parent-card edges remain visible; the nested detail owns the whole sheet. */
@media(max-width:720px){
  .sgr-detail-shell.sgr-bundle-nested-open{overflow:hidden!important}
  .sgr-bundle-included-expanded-v77:not([hidden]){
    position:absolute!important;
    z-index:10050!important;
    inset:0!important;
    display:block!important;
    margin:0!important;
    padding:0!important;
    overflow:auto!important;
    overscroll-behavior:contain!important;
    border-radius:inherit!important;
    background:var(--theme-surface,var(--card,#0b2b20))!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }
  .sgr-bundle-included-expanded-v77 .sgr-bundle-included-detail-card{
    box-sizing:border-box!important;
    width:100%!important;
    min-height:100%!important;
    margin:0!important;
    padding:18px!important;
    border:0!important;
    border-radius:inherit!important;
    box-shadow:none!important;
  }
}