:root {
  color-scheme: dark;
  --bg: #09070f;
  --panel: #12101b;
  --text: #fff8fb;
  --muted: #b9b1c2;
  --red: #ff254f;
  --pink: #ff4d88;
  --line: rgba(255, 255, 255, .12);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { min-width: 0; overflow-x: hidden; scroll-behavior: smooth; }
body { min-height: 100vh; margin: 0; color: var(--text); background: var(--bg); }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }

.home-page {
  background:
    radial-gradient(circle at 9% -8%, rgba(255, 37, 79, .28), transparent 28rem),
    radial-gradient(circle at 92% 18%, rgba(151, 35, 255, .14), transparent 30rem),
    linear-gradient(180deg, #0d0812 0, #070810 58%, #0b0710 100%);
}

.topbar {
  position: sticky; z-index: 20; top: 12px; display: flex; align-items: center; justify-content: space-between;
  width: min(1180px, calc(100% - 32px)); min-height: 64px; margin: 12px auto 0; padding: 9px 10px 9px 15px;
  border: 1px solid var(--line); border-radius: 19px; background: rgba(12, 9, 18, .82); backdrop-filter: blur(20px);
  box-shadow: 0 18px 58px rgba(0, 0, 0, .38), inset 0 1px rgba(255,255,255,.08);
}
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 950; letter-spacing: .08em; }
.brand__mark {
  display: grid; place-items: center; width: 38px; height: 38px; color: white; font-size: 25px; font-weight: 1000; font-style: italic;
  border-radius: 11px 17px 11px 17px; background: linear-gradient(145deg, var(--pink), #bd082f 74%);
  box-shadow: 0 0 25px rgba(255, 37, 79, .42), inset 0 1px rgba(255,255,255,.38);
}
.category-menu-button {
  display: inline-flex; align-items: center; justify-content: center; min-height: 42px; gap: 9px; padding: 0 18px; border: 1px solid rgba(255, 91, 123, .75); border-radius: 13px; color: white;
  background: linear-gradient(135deg, #6f0a20, var(--red)); cursor: pointer; font-weight: 800;
  box-shadow: 0 10px 28px rgba(255, 37, 79, .23), inset 0 1px rgba(255,255,255,.28);
}
.category-menu-button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.category-menu-button:hover, .category-menu-button:focus-visible { border-color: white; box-shadow: 0 0 0 3px rgba(255,37,79,.2), 0 12px 34px rgba(255,37,79,.4); outline: none; }
.category-menu-button[aria-pressed="true"] { border-color: #ffc0ce; background: linear-gradient(135deg,#9d0d34,#ff315d); box-shadow: 0 0 0 3px rgba(255,37,79,.12),0 12px 34px rgba(255,37,79,.34),inset 0 1px rgba(255,255,255,.3); }

.shell { width: min(1180px, calc(100% - 32px)); margin: 0 auto; padding: clamp(44px, 5vw, 72px) 0 80px; }
.hero { max-width: 940px; }
.eyebrow { margin: 0 0 13px; color: #ff7597; font-size: 13px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.hero h1 { max-width: 1000px; margin: 0; font-size: clamp(42px, 6.2vw, 78px); line-height: 1; letter-spacing: -.055em; text-wrap: balance; }
.hero h1.hero__home-title { font-size: clamp(38px, 5.6vw, 72px); }
.hero h1::first-line { color: #fff; }
.hero__lead { max-width: 800px; margin: 22px 0 0; color: #d7cfdc; font-size: clamp(16px, 1.6vw, 19px); line-height: 1.55; }

.feed { margin-top: clamp(40px, 4.5vw, 58px); }
.catalog-toolbar {
  position: relative; margin-bottom: 25px; padding: clamp(19px, 3vw, 28px); border: 1px solid rgba(255,255,255,.13);
  border-radius: 24px; background: linear-gradient(135deg, rgba(31,16,31,.93), rgba(12,10,20,.94) 62%, rgba(31,7,18,.92));
  box-shadow: 0 24px 65px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.08);
}
.catalog-toolbar::after { position: absolute; z-index: 0; top: -120px; right: 0; width: 220px; height: 240px; border-radius: 50%; background: rgba(255,37,79,.14); filter: blur(28px); content: ""; pointer-events: none; }
.catalog-toolbar > * { position: relative; z-index: 1; }
.catalog-toolbar__title { display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.catalog-toolbar__title h2 { margin: 0; font-size: clamp(34px, 5vw, 58px); letter-spacing: -.05em; }
.catalog-count { flex: 0 0 auto; min-width: 73px; padding: 9px 13px; border: 1px solid rgba(255,109,139,.35); border-radius: 999px; color: #fff1f5; background: rgba(255,37,79,.09); text-align: center; font-size: 13px; font-weight: 800; }
.catalog-controls { display: grid; grid-template-columns: minmax(0, 1fr) minmax(190px, 260px); gap: 12px; margin-top: 22px; }
.game-search, .provider-control { display: flex; align-items: center; min-width: 0; min-height: 50px; border: 1px solid rgba(255,255,255,.15); border-radius: 14px; color: #cec5d2; background: rgba(5,5,10,.56); transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; }
.game-search:focus-within, .provider-control:focus-within { border-color: rgba(255,92,125,.85); background: rgba(16,8,16,.82); box-shadow: 0 0 0 3px rgba(255,37,79,.14), 0 0 25px rgba(255,37,79,.14); }
.game-search svg { flex: 0 0 auto; width: 20px; height: 20px; margin-left: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.game-search input { min-width: 0; width: 100%; height: 48px; padding: 0 8px 0 11px; border: 0; outline: 0; color: #fff; background: transparent; font: inherit; }
.game-search input::placeholder { color: #92899a; }
.game-search button { display: grid; place-items: center; flex: 0 0 auto; width: 32px; height: 32px; margin-right: 8px; border: 0; border-radius: 9px; color: #d9cfdc; background: rgba(255,255,255,.08); cursor: pointer; font-size: 22px; line-height: 1; }
.provider-control { position: relative; }
.provider-control select { width: 100%; height: 48px; padding: 0 34px 0 14px; border: 0; outline: 0; color: #f5eef6; background: transparent; cursor: pointer; font: inherit; font-size: 13px; font-weight: 750; appearance: none; }
.provider-control:not(.provider-control--enhanced)::after { position: absolute; right: 16px; width: 8px; height: 8px; border-right: 2px solid #d4c4d2; border-bottom: 2px solid #d4c4d2; transform: rotate(45deg) translateY(-2px); content: ""; pointer-events: none; }
.provider-control--enhanced select { display: none; }
.provider-trigger { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-width: 0; min-height: 48px; padding: 0 15px; border: 0; color: #f5eef6; background: transparent; cursor: pointer; text-align: left; font: inherit; font-size: 13px; font-weight: 750; }
.provider-trigger[hidden], .provider-menu[hidden] { display: none; }
.provider-trigger > span:first-child { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.provider-trigger__chevron { flex: 0 0 auto; width: 8px; height: 8px; margin: -4px 2px 0 0; border-right: 2px solid #e9a0b4; border-bottom: 2px solid #e9a0b4; transform: rotate(45deg); transition: transform .18s ease; }
.provider-trigger[aria-expanded="true"] .provider-trigger__chevron { transform: translateY(4px) rotate(225deg); }
.provider-trigger:focus-visible { outline: 2px solid #ff8ca6; outline-offset: -3px; border-radius: 12px; }
.provider-menu { position: absolute; z-index: 20; top: calc(100% + 8px); right: 0; width: max(100%, 250px); max-width: min(360px, calc(100vw - 28px)); max-height: min(370px, 55vh); overflow-y: auto; overscroll-behavior: contain; padding: 7px; border: 1px solid rgba(255,123,153,.35); border-radius: 16px; background: linear-gradient(155deg,#241321,#100d17 72%); box-shadow: 0 22px 55px rgba(0,0,0,.7), inset 0 1px rgba(255,255,255,.1); scrollbar-color: #7d4559 #17111c; }
.provider-menu__option { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 42px; padding: 9px 10px; border: 1px solid transparent; border-radius: 10px; color: #ddd4df; background: transparent; cursor: pointer; text-align: left; font: inherit; font-size: 13px; font-weight: 650; }
.provider-menu__option:hover, .provider-menu__option:focus-visible { border-color: rgba(255,109,139,.35); color: #fff; background: rgba(255,73,112,.15); outline: none; }
.provider-menu__option[aria-selected="true"] { color: #fff; background: rgba(218,33,77,.28); }
.provider-menu__option:disabled { color: #716b78; cursor: not-allowed; }
.provider-menu__count { flex: 0 0 auto; min-width: 28px; padding: 3px 6px; border-radius: 7px; color: #ecc8d2; background: rgba(255,255,255,.07); text-align: center; font-size: 11px; }
.category-rail { position: relative; min-width: 0; margin-top: 12px; overflow: hidden; }
.category-rail::after { position: absolute; top: 0; right: 0; bottom: 5px; width: 30px; background: linear-gradient(90deg,transparent,#100b15); content: ""; pointer-events: none; }
.category-rail__track { display: flex; gap: 8px; overflow-x: auto; overscroll-behavior-x: contain; padding: 2px 30px 9px 2px; scrollbar-width: thin; scrollbar-color: #a42a4c transparent; -webkit-overflow-scrolling: touch; }
.category-rail__track a { flex: 0 0 auto; display: inline-flex; align-items: center; min-height: 39px; padding: 8px 15px; border: 1px solid rgba(255,255,255,.16); border-radius: 11px; color: #d9cdd9; background: rgba(255,255,255,.045); text-decoration: none; font-size: 13px; font-weight: 750; white-space: nowrap; }
.category-rail__track a:hover, .category-rail__track a:focus-visible { border-color: #ff8ca6; color: white; outline: none; }
.category-rail__track a[aria-current="page"] { border-color: rgba(255,98,130,.65); color: white; background: linear-gradient(135deg,rgba(126,9,38,.95),rgba(235,30,70,.9)); }

.game-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 28px 15px; }
.catalog-more { display: block; min-height: 48px; margin: 38px auto 0; padding: 10px 24px; border: 1px solid rgba(255,118,148,.75); border-radius: 13px; color: #fff; background: linear-gradient(135deg,#79112d,#d71943); box-shadow: 0 10px 28px rgba(0,0,0,.28); cursor: pointer; font-weight: 800; }
.catalog-more:hover, .catalog-more:focus-visible { border-color: #fff; background: linear-gradient(135deg,#a6173b,#ef315a); outline: none; }
.game-index { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.game-index a { min-width: 0; padding: 13px 15px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.035); color: #ece5ef; overflow-wrap: anywhere; line-height: 1.35; }
.game-index a:hover, .game-index a:focus-visible { border-color: #ff7597; background: rgba(255,37,79,.12); outline: none; }
.game-card { position: relative; min-width: 0; }
.game-unavailable { min-height: 100vh; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 18px; padding: 32px; text-align: center; background: #09070f; color: #fff; }
.game-unavailable img { width: min(240px, 70vw); height: auto; aspect-ratio: 576 / 784; object-fit: cover; border-radius: 18px; }
.game-unavailable h1 { margin: 0; font-size: clamp(28px, 5vw, 48px); }
.game-unavailable p { margin: 0; color: #b9afc0; }
.game-unavailable a { color: #fff; }
.game-card__link { display: block; }
.game-card__media {
  position: relative; display: block; overflow: hidden; aspect-ratio: 576 / 784; border: 1px solid rgba(255,255,255,.14); border-radius: 18px;
  background: #15111c; box-shadow: 0 18px 38px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.025);
  transition: border-color .22s ease, box-shadow .22s ease, transform .22s ease;
}
.game-card__media::after { position: absolute; inset: auto 0 0; height: 34%; background: linear-gradient(transparent, rgba(7,5,11,.38)); content: ""; }
.game-card img { width: 100%; height: 100%; display: block; object-fit: cover; }
.game-card__name { display: flex; align-items: center; min-width: 0; gap: 8px; margin-top: 10px; color: #ddd5e2; font-size: 14px; font-weight: 750; }
.game-card__name i { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: #26e58b; box-shadow: 0 0 12px rgba(38,229,139,.72); }
.game-card__short-description { display: block; margin: 5px 0 0 16px; color: #b9afc0; font-size: 12px; line-height: 1.4; }
.game-card__link:hover .game-card__media, .game-card__link:focus-visible .game-card__media { transform: translateY(-4px); border-color: rgba(255,67,105,.86); box-shadow: 0 24px 46px rgba(0,0,0,.58), 0 0 26px rgba(255,37,79,.3); }
.game-card__link:focus-visible { outline: none; }
.game-card__info {
  position: absolute; z-index: 3; top: 10px; right: 10px; display: grid; place-items: center; width: 36px; height: 36px; padding: 0;
  border: 1px solid rgba(255,255,255,.72); border-radius: 50%; color: #fff; background: rgba(8,6,12,.76); cursor: pointer;
  box-shadow: 0 7px 22px rgba(0,0,0,.55), inset 0 1px rgba(255,255,255,.2); backdrop-filter: blur(9px);
  font-size: 20px; font-weight: 950; line-height: 1; transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}
.game-card__info:hover, .game-card__info:focus-visible { outline: none; background: #d71943; box-shadow: 0 0 0 3px rgba(255,37,79,.2), 0 10px 28px rgba(0,0,0,.62); transform: scale(1.08); }
.game-description { width: min(680px, calc(100% - 28px)); max-width: none; max-height: min(780px, calc(100dvh - 28px)); padding: 0; overflow: hidden; border: 0; color: var(--text); background: transparent; }
.game-description::backdrop { background: rgba(3,2,7,.78); backdrop-filter: blur(8px); }
.game-description__panel { position: relative; max-height: min(780px, calc(100dvh - 28px)); padding: clamp(26px,5vw,42px); overflow-y: auto; overscroll-behavior: contain; border: 1px solid rgba(255,93,128,.48); border-radius: 24px; background: linear-gradient(145deg,#211020,#0e0b15 68%,#260814); box-shadow: 0 32px 100px rgba(0,0,0,.8), inset 0 1px rgba(255,255,255,.1); scrollbar-color: #c31943 #170b18; scrollbar-width: thin; }
.game-description__close { position: sticky; z-index: 2; top: 0; float: right; display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 1px solid rgba(255,118,148,.55); border-radius: 13px; color: #fff; background: rgba(55,10,28,.94); cursor: pointer; font-size: 27px; line-height: 1; }
.game-description__close:hover, .game-description__close:focus-visible { outline: none; border-color: #fff; background: #bd1239; }
.game-description h2 { max-width: calc(100% - 48px); margin: 0; font-size: clamp(30px,6vw,48px); line-height: 1.02; letter-spacing: -.045em; text-wrap: balance; }
.game-description__play { display: inline-flex; align-items: center; justify-content: center; min-width: 150px; min-height: 50px; margin-top: 22px; padding: 0 26px; border: 1px solid #ff91a8; border-radius: 14px; color: #fff; background: linear-gradient(135deg,#94102e,#ff254f); box-shadow: 0 12px 30px rgba(255,37,79,.28), inset 0 1px rgba(255,255,255,.25); font-size: 17px; font-weight: 900; }
.game-description__play:hover, .game-description__play:focus-visible { outline: none; border-color: #fff; background: linear-gradient(135deg,#c0133a,#ff496d); box-shadow: 0 0 0 3px rgba(255,37,79,.2), 0 15px 34px rgba(255,37,79,.36); }
.game-description__text { min-height: 80px; margin: 26px 0 0; color: #e8dfe9; font-size: 18px; line-height: 1.72; }
.game-description__text p { margin: 0 0 1.15em; }
.game-description__text p:last-child { margin-bottom: 0; }
.category-dialog { width: min(620px,calc(100% - 28px)); max-width: none; max-height: calc(100dvh - 28px); padding: 0; overflow: hidden; border: 0; color: var(--text); background: transparent; }
.category-dialog::backdrop { background: rgba(3,2,7,.8); backdrop-filter: blur(10px); }
.category-dialog__panel { position: relative; display: flex; flex-direction: column; box-sizing: border-box; max-height: calc(100dvh - 28px); overflow: hidden; padding: clamp(27px,5vw,42px); border: 1px solid rgba(255,93,128,.5); border-radius: 26px; background: radial-gradient(circle at 90% 0,rgba(255,37,79,.18),transparent 36%),linear-gradient(145deg,#211020,#0e0b15 68%,#260814); box-shadow: 0 32px 100px rgba(0,0,0,.82),inset 0 1px rgba(255,255,255,.1); }
.category-dialog[open]::backdrop { animation: category-backdrop-in .26s ease-out both; }
.category-dialog[open] .category-dialog__panel { animation: category-panel-in .32s cubic-bezier(.18,.8,.24,1) both; }
.category-dialog[open].is-closing::backdrop { animation: category-backdrop-out .22s ease-in both; }
.category-dialog[open].is-closing .category-dialog__panel { animation: category-panel-out .22s cubic-bezier(.4,0,1,1) both; }
@keyframes category-backdrop-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes category-backdrop-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes category-panel-in { from { opacity: 0; transform: translateY(18px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes category-panel-out { from { opacity: 1; transform: translateY(0) scale(1); } to { opacity: 0; transform: translateY(10px) scale(.98); } }
@media (prefers-reduced-motion: reduce) {
  .category-dialog[open]::backdrop, .category-dialog[open] .category-dialog__panel { animation: none; }
}
.category-dialog__close { position: absolute; z-index: 2; top: 18px; right: 18px; display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 1px solid rgba(255,118,148,.55); border-radius: 13px; color: #fff; background: rgba(55,10,28,.94); cursor: pointer; font-size: 27px; line-height: 1; }
.category-dialog__close:hover, .category-dialog__close:focus-visible { border-color: #fff; outline: none; background: #bd1239; }
.category-dialog h2 { margin: 0; font-size: clamp(36px,7vw,56px); line-height: 1; letter-spacing: -.05em; }
.category-dialog__list { display: grid; align-content: start; gap: 12px; min-height: 0; margin-top: 28px; padding-right: 6px; overflow-y: auto; overscroll-behavior-y: contain; scrollbar-width: thin; scrollbar-color: #ff5a8a rgba(255,255,255,.1); -webkit-overflow-scrolling: touch; }
.category-card { display: grid; grid-template-columns: 54px minmax(0,1fr) 28px; align-items: center; gap: 15px; width: 100%; min-height: 86px; padding: 14px 17px; border: 1px solid rgba(255,104,135,.45); border-radius: 19px; color: #fff; background: linear-gradient(135deg,rgba(113,10,43,.72),rgba(255,37,79,.18)); box-shadow: inset 0 1px rgba(255,255,255,.1),0 16px 34px rgba(0,0,0,.24); cursor: pointer; text-align: left; text-decoration: none; transition: border-color .2s ease,background .2s ease,box-shadow .2s ease; }
.category-card:hover, .category-card:focus-visible { border-color: #ffafc0; outline: none; background: linear-gradient(135deg,rgba(148,15,55,.9),rgba(255,37,79,.3)); box-shadow: 0 0 0 3px rgba(255,37,79,.13),0 18px 38px rgba(0,0,0,.32); }
.category-card.is-active { border-color: #ffd0da; background: linear-gradient(135deg,rgba(162,16,59,.96),rgba(255,48,91,.4)); box-shadow: 0 0 0 3px rgba(255,37,79,.14),0 18px 38px rgba(0,0,0,.34); }
.category-card__icon { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 17px; color: #fff; background: linear-gradient(145deg,#ff5a8a,#c20c37); box-shadow: 0 9px 24px rgba(255,37,79,.28),inset 0 1px rgba(255,255,255,.32); font-size: 32px; font-weight: 350; }
.category-card__copy { display: grid; min-width: 0; gap: 5px; }
.category-card__copy strong { font-size: 21px; font-weight: 950; line-height: 1.12; overflow-wrap: anywhere; }
.category-card__copy small { overflow: hidden; color: #cabfce; font-size: 13px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.category-card__arrow { color: #ffb3c2; font-size: 25px; }
.empty-state { display: grid; place-items: center; min-height: 260px; padding: 35px; border: 1px dashed rgba(255,255,255,.17); border-radius: 22px; color: var(--muted); text-align: center; background: rgba(255,255,255,.025); }
.empty-state > span { display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid rgba(255,91,123,.5); border-radius: 50%; color: #ff6b89; background: rgba(255,37,79,.08); font-size: 30px; }
.empty-state strong { margin-top: 12px; color: #fff; font-size: 24px; }
.empty-state p { margin: 6px 0 18px; }
.empty-state button { min-height: 44px; padding: 0 17px; border: 1px solid #ff6e8b; border-radius: 12px; color: white; background: #a30d31; cursor: pointer; font-weight: 850; }

.footer { display: grid; grid-template-columns: 1fr auto; gap: 10px 24px; align-items: end; width: min(1180px, calc(100% - 32px)); margin: 0 auto; padding: 42px 0 34px; border-top: 1px solid var(--line); }
.footer strong { font-size: 22px; letter-spacing: .1em; }
.footer p { grid-column: 1; margin: 0; color: var(--muted); }
.footer > span { grid-column: 2; grid-row: 1 / 3; display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid var(--line); border-radius: 50%; font-weight: 900; }

.game-page { overflow-x: hidden; background: radial-gradient(ellipse at 50% 42%, #261b2c 0, #110e1c 48%, #080712 100%); }
.game-fallback { display: grid; grid-template-columns: minmax(220px, 350px) 1fr; gap: 42px; align-items: center; min-height: 100vh; width: min(1050px, calc(100% - 36px)); margin: 0 auto; padding: 50px 0; }
.game-fallback > img { width: 100%; height: auto; border-radius: 24px; box-shadow: 0 30px 80px #000b; }
.game-fallback h1 { margin: 0 0 20px; font-size: clamp(38px, 6vw, 72px); line-height: .98; letter-spacing: -.05em; }
.game-fallback p:not(.eyebrow) { max-width: 680px; color: #d4ccd9; font-size: 18px; line-height: 1.6; }
.game-fallback button { min-height: 54px; margin-top: 12px; padding: 0 24px; border: 1px solid #ff718e; border-radius: 14px; color: #fff; background: linear-gradient(135deg,#8d0b29,#ff254f); cursor: pointer; font-weight: 900; }
.game-page .game-fallback { visibility: hidden; }
.game-page.is-leaving-player .game-fallback { visibility: hidden; }
.back-link { position: fixed; z-index: 2; top: 18px; left: 18px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 999px; background: rgba(8,6,12,.78); }
.game-info { position: absolute; z-index: 20; inset: 20px; overflow: auto; width: min(860px, calc(100% - 40px)); max-height: calc(100% - 40px); margin: auto; padding: clamp(25px,4vw,46px); border: 1px solid rgba(255,77,117,.45); border-radius: 24px; color: white; background: rgba(12,8,18,.97); box-shadow: 0 30px 90px #000d; scrollbar-color: #b9173d #160b18; }
.game-info__close { position: sticky; z-index: 3; top: 0; float: right; width: 48px; height: 48px; border: 1px solid #ff6b89; border-radius: 14px; color: white; background: linear-gradient(145deg,#5a091b,#d71943); box-shadow: 0 10px 25px #0008; cursor: pointer; font-size: 27px; }
.game-info h2 { max-width: 690px; margin: 0 0 18px; font-size: clamp(36px,6vw,66px); line-height: .98; letter-spacing: -.045em; }
.game-info h3 { margin: 0 0 13px; font-size: clamp(25px,3.2vw,38px); line-height: 1.08; letter-spacing: -.025em; }
.game-info p { color: #d7cfdb; font-size: 17px; line-height: 1.72; }
.seo-article__lead { max-width: 730px; margin-bottom: 22px; color: #fff !important; font-size: clamp(18px,2.4vw,22px) !important; line-height: 1.58 !important; }
.seo-keywords { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 34px; }
.seo-keywords span { padding: 8px 11px; border: 1px solid rgba(255,100,132,.32); border-radius: 999px; color: #ffd7e0; background: rgba(255,37,79,.08); font-size: 13px; font-weight: 800; }
.seo-section { padding: 30px 0; border-top: 1px solid rgba(255,255,255,.1); }
.seo-section p { margin: 12px 0 0; }
.seo-faq { padding: 32px 0 8px; border-top: 1px solid rgba(255,255,255,.1); }
.seo-faq details { margin-top: 10px; border: 1px solid rgba(255,255,255,.12); border-radius: 14px; background: rgba(255,255,255,.035); }
.seo-faq summary { padding: 16px 48px 16px 17px; cursor: pointer; color: #fff; font-weight: 850; line-height: 1.4; }
.seo-faq details p { margin: 0; padding: 0 17px 18px; }
.seo-related { margin-top: 32px; padding: 28px; border: 1px solid rgba(255,91,123,.25); border-radius: 18px; background: linear-gradient(145deg,rgba(118,9,34,.24),rgba(255,37,79,.06)); }
.seo-related > div { display: flex; flex-wrap: wrap; gap: 9px; }
.seo-related a { display: inline-flex; padding: 11px 14px; border: 1px solid rgba(255,116,146,.55); border-radius: 11px; background: #99102f; font-weight: 850; }
.seo-related a:hover, .seo-related a:focus-visible { border-color: white; background: #d71943; outline: none; }
.igp-help { position: absolute; z-index: 7; top: calc(max(12px, env(safe-area-inset-top)) + var(--igp-control-size) + 12px); right: max(14px, env(safe-area-inset-right)); bottom: auto; width: 52px; height: 52px; border: 2px solid #ff738e; border-radius: 50%; color: white; background: linear-gradient(145deg,#5a091b,#d71943); box-shadow: 0 0 22px rgba(255,37,79,.42); cursor: pointer; font-size: 23px; font-weight: 950; }

/* Local Slot X experiment: reserve a real top rail instead of covering the game. */
.game-page .igp-player.slotx-player--standard {
  --slotx-player-header-height: 76px;
  --slotx-player-rail-height: calc(var(--slotx-player-header-height) + env(safe-area-inset-bottom));
  overflow-x: hidden;
}
html.game-preload-lock, html.game-preload-lock body.game-page { height: 100%; overflow: hidden; overscroll-behavior: none; }
html.game-preload-lock .game-welcome { max-height: 100dvh; overflow-y: auto; overscroll-behavior: contain; }
.game-page .igp-player.slotx-player--standard.slotx-ios-chrome {
  position: fixed;
  z-index: 20;
  overscroll-behavior: auto;
}
@media (max-width: 620px) {
  .game-page .igp-player.slotx-player--standard.slotx-ios-chrome {
    --slotx-player-rail-height: var(--slotx-player-header-height);
  }
  .game-page .igp-player.slotx-player--standard.slotx-ios-chrome .igp-promo { bottom: 0; }
}
.game-page .igp-player.slotx-player--standard::before {
  position: absolute; z-index: 3; inset: auto 0 0; height: var(--slotx-player-rail-height); border-top: 1px solid rgba(255,145,168,.46);
  background: linear-gradient(112deg, #270a18 0%, #6e0b28 50%, #b7183f 100%); box-shadow: 0 -1px 0 rgba(255,255,255,.1), 0 -8px 22px rgba(255,37,79,.14); content: ''; pointer-events: none;
}
.game-page .igp-player.slotx-player--standard .igp-close {
  top: max(12px, env(safe-area-inset-top)); bottom: auto; left: 12px; width: 46px; height: 46px; border: 1px solid rgba(255,255,255,.42); border-radius: 50%; background: rgba(24,5,16,.72); box-shadow: 0 8px 24px rgba(0,0,0,.38), inset 0 1px rgba(255,255,255,.13); backdrop-filter: blur(9px); -webkit-backdrop-filter: blur(9px);
}
.game-page .igp-player.slotx-player--standard .igp-close:hover { background: rgba(255,255,255,.14); box-shadow: 0 0 0 3px rgba(255,255,255,.08); }
.game-page .igp-player.slotx-player--standard .igp-promo {
  z-index: 30; top: auto; right: 0; bottom: env(safe-area-inset-bottom); left: 0; display: grid; grid-template-columns: minmax(0,1fr) minmax(116px,.42fr); align-items: center; gap: 10px;
  width: 100%; height: var(--slotx-player-header-height); padding: 7px 10px; overflow: hidden; isolation: isolate; border: 0; border-top: 1px solid rgba(255,220,181,.32); border-radius: 0;
  background: radial-gradient(circle at 12% 140%,rgba(255,61,117,.32),transparent 44%),radial-gradient(circle at 86% -60%,rgba(244,179,80,.2),transparent 42%),linear-gradient(105deg,#10060c 0%,#280917 48%,#16070e 100%);
  box-shadow: 0 -1px 0 rgba(255,255,255,.08),0 -14px 38px rgba(20,2,11,.46); outline: none; backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); filter: none;
  user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent;
}
.game-page .igp-player.slotx-player--standard .igp-promo::before { background: linear-gradient(108deg,transparent 0 34%,rgba(255,255,255,.065) 43%,transparent 52% 100%); }
.game-page .igp-player.slotx-player--standard .igp-promo::after { right: 8%; left: 8%; background: linear-gradient(90deg,transparent,#ffc982b8 32%,#ff718f 68%,transparent); }
.game-page .igp-player.slotx-player--standard .igp-promo:hover { filter: brightness(1.07); background: radial-gradient(circle at 12% 140%,rgba(255,61,117,.38),transparent 44%),radial-gradient(circle at 86% -60%,rgba(244,179,80,.25),transparent 42%),linear-gradient(105deg,#14070e 0%,#310b1c 48%,#1b0811 100%); box-shadow: 0 -1px 0 rgba(255,255,255,.12),0 -16px 42px rgba(20,2,11,.52),0 0 28px rgba(255,49,88,.12); }
.slotx-promo-offer { position: relative; z-index: 1; display: grid; grid-template-columns: clamp(86px,22vw,116px) minmax(0,1fr); align-items: center; min-width: 0; gap: 9px; overflow: hidden; color: #fff; line-height: 1; text-transform: uppercase; white-space: nowrap; }
.slotx-promo-brand { display: block; width: 100%; height: auto; max-height: 48px; object-fit: contain; filter: drop-shadow(0 5px 9px rgba(0,0,0,.4)); }
.slotx-promo-offer__text { display: grid; align-content: center; min-width: 0; gap: 4px; overflow: hidden; }
.slotx-promo-offer__text strong { min-width: 0; overflow: hidden; color: #fff; font-family: var(--igp-font-display); font-size: clamp(25px,5.6vw,34px); font-weight: 950; letter-spacing: -.04em; text-overflow: ellipsis; text-shadow: 0 0 20px rgba(255,55,105,.38); }
.slotx-promo-offer__text span { overflow: hidden; color: #f5bbc7; font-size: clamp(10px,2vw,13px); font-weight: 900; letter-spacing: .06em; text-overflow: ellipsis; }
.game-page .igp-player.slotx-player--standard .slotx-promo-action { position: relative; z-index: 2; align-self: center; display: grid; grid-template-columns: 40px minmax(0,1fr); align-items: center; gap: 7px; min-width: 0; height: 54px; margin: 0; padding: 4px 9px 4px 5px; overflow: hidden; border: 1px solid rgba(255,232,202,.72); border-radius: 18px; color: #fff; background: linear-gradient(135deg,#9f123b 0%,#e02a52 62%,#ff5d73 100%); box-shadow: 0 9px 24px rgba(113,5,40,.36),inset 0 1px rgba(255,255,255,.32),inset 0 -8px 16px rgba(93,0,28,.16); font-family: var(--igp-font-body); text-align: left; }
.game-page .igp-player.slotx-player--standard .slotx-promo-action > b { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(33,3,17,.64); box-shadow: 0 5px 13px rgba(20,0,9,.45),0 0 0 1px rgba(255,228,151,.45),inset 0 1px rgba(255,255,255,.13); }
.slotx-promo-action__copy { min-width: 0; overflow: hidden; font-size: clamp(12px,2.6vw,16px); font-weight: 950; letter-spacing: .025em; line-height: 1; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.game-page .igp-player.slotx-player--standard .igp-promo:hover .slotx-promo-action { border-color: #fff3da; background: linear-gradient(135deg,#ad1643 0%,#ed315b 62%,#ff6c80 100%); box-shadow: 0 10px 28px rgba(133,5,45,.44),inset 0 1px rgba(255,255,255,.38),inset 0 -8px 16px rgba(93,0,28,.12); }
.game-page .igp-player.slotx-player--standard .igp-promo:focus { outline: none; }
.game-page .igp-player.slotx-player--standard .igp-promo:focus-visible .slotx-promo-action { box-shadow: 0 0 0 3px rgba(255,255,255,.92),0 10px 28px rgba(133,5,45,.44),inset 0 1px rgba(255,255,255,.38); }
@media (hover: none), (pointer: coarse) {
  .game-page .igp-player.slotx-player--standard .igp-promo:hover {
    transform: none; filter: none;
    background: radial-gradient(circle at 12% 140%,rgba(255,61,117,.32),transparent 44%),radial-gradient(circle at 86% -60%,rgba(244,179,80,.2),transparent 42%),linear-gradient(105deg,#10060c 0%,#280917 48%,#16070e 100%);
    box-shadow: 0 -1px 0 rgba(255,255,255,.08),0 -14px 38px rgba(20,2,11,.46);
  }
  .game-page .igp-player.slotx-player--standard .igp-promo:hover .slotx-promo-action {
    transform: none; border-color: rgba(255,232,202,.72); background: linear-gradient(135deg,#9f123b 0%,#e02a52 62%,#ff5d73 100%);
    box-shadow: 0 9px 24px rgba(113,5,40,.36),inset 0 1px rgba(255,255,255,.32),inset 0 -8px 16px rgba(93,0,28,.16);
  }
  .game-page .igp-player.slotx-player--standard .igp-promo:hover .slotx-promo-action > b { transform: none; }
}
.game-page .igp-player.slotx-player--standard .igp-redirect { z-index: 50; }
.game-page .igp-player.slotx-player--standard .igp-stage {
  inset: 0 0 var(--slotx-player-rail-height); height: auto;
  background: radial-gradient(circle at 50% 28%, rgba(255,49,88,.24), transparent 34%), radial-gradient(circle at 12% 88%, rgba(132,45,209,.2), transparent 42%), linear-gradient(155deg,#210d21 0%,#0d0914 56%,#310a1d 100%);
}
.game-page .igp-player.slotx-player--standard .igp-loading {
  inset: 0 0 var(--slotx-player-rail-height);
  color: #fff0f4; background: radial-gradient(circle at 50% 32%, rgba(255,49,88,.3), transparent 35%), radial-gradient(circle at 10% 90%, rgba(126,42,202,.22), transparent 43%), linear-gradient(155deg,#250e24 0%,#0f0916 57%,#380b20 100%);
  text-shadow: 0 2px 14px rgba(0,0,0,.65);
}
.game-page .igp-player--standard .igp-stage::before {
  position: absolute; z-index: 0; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  max-width: calc(100% - 32px); padding: 13px 20px 13px 45px;
  border: 1px solid rgba(255, 132, 163, .55); border-radius: 999px;
  color: #fff; background: rgba(26, 8, 23, .88);
  box-shadow: 0 12px 35px rgba(0, 0, 0, .42);
  font-size: 15px; font-weight: 700; white-space: nowrap;
  pointer-events: none; content: 'Загрузка игры…';
}
.game-page .igp-player--standard .igp-stage::after {
  position: absolute; z-index: 0; top: 50%; left: calc(50% - 70px);
  width: 17px; height: 17px; margin-top: -9px;
  border: 2px solid rgba(255, 255, 255, .35);
  border-top-color: #ff6f93; border-radius: 50%;
  animation: slotx-loading-spin .8s linear infinite; content: '';
}
.game-page .igp-player--standard .igp-stage iframe {
  z-index: 1;
}
@keyframes slotx-loading-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .game-page .igp-player--standard .igp-stage::after { animation: none; }
}
.game-page .igp-player.slotx-player--standard .igp-help {
  display: none;
}
.game-page .igp-player.slotx-player--standard .igp-help:hover { background: rgba(255,255,255,.14); box-shadow: 0 0 0 3px rgba(255,255,255,.08); }
.slotx-player-menu {
  position: absolute; z-index: 9; top: max(12px, env(safe-area-inset-top)); right: 12px; display: flex; flex-direction: column; align-items: center;
  touch-action: manipulation; user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent;
  transition: opacity .24s ease, visibility 0s linear 0s, transform .32s cubic-bezier(.2,.9,.2,1);
}
.igp-player.has-open-info .slotx-player-menu { opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-8px) scale(.88); transition: opacity .2s ease, visibility 0s linear .2s, transform .25s ease; }
.slotx-player-menu::before {
  position: absolute; z-index: -1; top: -14px; right: -12px; width: 82px; height: 82px; border-radius: 50%; opacity: .46;
  background: radial-gradient(circle, rgba(255,58,105,.28), transparent 68%); filter: blur(5px); content: ''; pointer-events: none;
  transition: opacity .45s ease, transform .55s cubic-bezier(.2,.9,.2,1);
}
.slotx-player-menu.is-open::before { opacity: .86; transform: scale(1.2); }
.slotx-player-menu__toggle,
.game-page .igp-player.slotx-player--standard .slotx-player-menu .igp-close,
.game-page .igp-player.slotx-player--standard .slotx-player-menu .slotx-player-menu__reload,
.game-page .igp-player.slotx-player--standard .slotx-player-menu .igp-help {
  position: static; display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 1px solid rgba(255,190,207,.5); border-radius: 50%; color: #fff;
  background: linear-gradient(145deg,rgba(112,12,46,.94),rgba(32,6,20,.92)); box-shadow: 0 10px 28px rgba(0,0,0,.46), 0 0 18px rgba(255,37,79,.18), inset 0 1px rgba(255,255,255,.2), inset 0 -8px 18px rgba(0,0,0,.16);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent;
  transition: transform .32s cubic-bezier(.2,.9,.2,1), border-color .25s ease, background .25s ease, box-shadow .32s ease, opacity .3s ease;
}
.slotx-player-menu__toggle:hover,
.game-page .igp-player.slotx-player--standard .slotx-player-menu .igp-close:hover,
.game-page .igp-player.slotx-player--standard .slotx-player-menu .slotx-player-menu__reload:hover,
.game-page .igp-player.slotx-player--standard .slotx-player-menu .igp-help:hover { border-color: rgba(255,255,255,.86); background: linear-gradient(145deg,#a7144b,#4b0a2a); box-shadow: 0 0 0 4px rgba(255,48,91,.12), 0 12px 30px rgba(0,0,0,.46), 0 0 24px rgba(255,48,91,.3); transform: translateY(-1px) scale(1.04); }
.slotx-player-menu__toggle:active,
.game-page .igp-player.slotx-player--standard .slotx-player-menu .igp-close:active,
.game-page .igp-player.slotx-player--standard .slotx-player-menu .slotx-player-menu__reload:active,
.game-page .igp-player.slotx-player--standard .slotx-player-menu .igp-help:active { transform: scale(.91); transition-duration: .09s; }
.slotx-player-menu__toggle { position: relative; z-index: 2; grid-template-rows: repeat(3,2px); align-content: center; gap: 4px; }
.slotx-player-menu__toggle > span { display: block; width: 19px; height: 2px; border-radius: 99px; background: currentColor; box-shadow: 0 1px 3px rgba(0,0,0,.35); transform-origin: center; transition: transform .45s cubic-bezier(.2,.9,.2,1), opacity .25s ease, width .35s ease; }
.slotx-player-menu.is-open .slotx-player-menu__toggle { border-color: rgba(255,255,255,.78); background: linear-gradient(145deg,#b71853,#620d36); box-shadow: 0 0 0 4px rgba(255,48,91,.14), 0 12px 30px rgba(0,0,0,.48), 0 0 26px rgba(255,48,91,.34); transform: rotate(90deg); }
.slotx-player-menu.is-open .slotx-player-menu__toggle > span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.slotx-player-menu.is-open .slotx-player-menu__toggle > span:nth-child(2) { width: 0; opacity: 0; }
.slotx-player-menu.is-open .slotx-player-menu__toggle > span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.slotx-player-menu .igp-close svg,
.slotx-player-menu__reload svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.slotx-player-menu__items {
  display: flex; flex-direction: column; gap: 8px; max-height: 0; margin-top: 0; padding: 0 7px; overflow: hidden; border: 1px solid transparent; border-radius: 999px;
  opacity: 0; visibility: hidden; pointer-events: none; background: rgba(10,5,12,.7); box-shadow: 0 16px 36px rgba(0,0,0,0); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  transform: translateY(-14px) scale(.82); transform-origin: 50% 0; transition: max-height .52s cubic-bezier(.2,.9,.2,1), margin-top .42s ease, padding .42s ease, opacity .28s ease, visibility 0s linear .52s, transform .52s cubic-bezier(.2,.9,.2,1), border-color .3s ease, box-shadow .45s ease;
}
.slotx-player-menu.is-open .slotx-player-menu__items {
  max-height: 182px; margin-top: 9px; padding: 7px; border-color: rgba(255,179,199,.24); opacity: 1; visibility: visible; pointer-events: auto;
  box-shadow: 0 16px 36px rgba(0,0,0,.4), inset 0 1px rgba(255,255,255,.08); transform: translateY(0) scale(1); transition-delay: 0s;
}
.slotx-player-menu__items > button { opacity: 0; transform: translateY(-12px) scale(.82); }
.slotx-player-menu.is-open .slotx-player-menu__items > button { opacity: 1; transform: translateY(0) scale(1); }
.slotx-player-menu.is-open .slotx-player-menu__items > button:nth-child(1) { transition-delay: .08s; }
.slotx-player-menu.is-open .slotx-player-menu__items > button:nth-child(2) { transition-delay: .15s; }
.slotx-player-menu.is-open .slotx-player-menu__items > button:nth-child(3) { transition-delay: .22s; }
.game-page .igp-player.slotx-player--standard .slotx-player-menu .igp-help { font-size: 21px; font-weight: 950; }

@media (max-width: 620px) {
  .game-page .igp-player.slotx-player--standard { --slotx-player-header-height: 68px; }
  .game-page .igp-player.slotx-player--standard .igp-promo { grid-template-columns: minmax(0,1fr) 106px; gap: 7px; padding: 5px 6px 5px 9px; }
  .slotx-promo-offer { grid-template-columns: 86px minmax(0,1fr); gap: 6px; }
  .slotx-promo-brand { max-height: 44px; }
  .slotx-promo-offer__text { gap: 3px; }
  .slotx-promo-offer__text strong { font-size: clamp(22px,7vw,27px); }
  .slotx-promo-offer__text span { font-size: 10px; }
  .game-page .igp-player.slotx-player--standard .slotx-promo-action { grid-template-columns: 35px minmax(0,1fr); gap: 5px; height: 48px; padding: 4px 6px 4px 4px; border-radius: 15px; }
  .game-page .igp-player.slotx-player--standard .slotx-promo-action > b { width: 35px; height: 35px; }
  .slotx-promo-action__copy { font-size: 11px; }
}

@media (max-width: 900px) {
  .game-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .game-index { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .catalog-controls { grid-template-columns: minmax(0,1fr) minmax(160px,220px); }
}

@media (max-width: 620px) {
  .topbar { width: calc(100% - 20px); min-height: 58px; top: 8px; margin-top: 8px; padding: 7px 8px 7px 11px; border-radius: 16px; }
  .brand { gap: 8px; font-size: 14px; }
  .brand__mark { width: 34px; height: 34px; font-size: 22px; }
  .category-menu-button { min-height: 40px; gap: 7px; padding: 0 12px; font-size: 12px; }
  .category-menu-button svg { width: 16px; height: 16px; }
  .category-dialog__panel { padding: 26px 18px 20px; border-radius: 21px; }
  .category-dialog__close { top: 14px; right: 14px; }
  .category-card { grid-template-columns: 48px minmax(0,1fr) 22px; gap: 12px; min-height: 78px; padding: 12px; border-radius: 17px; }
  .category-card__icon { width: 48px; height: 48px; border-radius: 15px; }
  .shell { width: calc(100% - 24px); padding-top: 38px; }
  .hero h1 { font-size: clamp(36px, 10vw, 50px); }
  .hero h1.hero__home-title { font-size: clamp(34px, 9vw, 46px); }
  .hero__lead { margin-top: 16px; font-size: 15px; line-height: 1.5; }
  .feed { margin-top: 32px; }
  .catalog-toolbar { margin: 0 -2px 18px; padding: 18px 14px 14px; border-radius: 19px; }
  .catalog-toolbar__title h2 { font-size: 32px; }
  .catalog-count { min-width: 65px; padding: 8px 10px; font-size: 12px; }
  .catalog-controls { grid-template-columns: minmax(0,1fr) minmax(112px,38%); gap: 8px; margin-top: 16px; }
  .game-search { min-height: 48px; }
  .provider-control select { padding-left: 8px; padding-right: 24px; font-size: 11px; }
  .provider-control::after { right: 10px; }
  .provider-trigger { padding-inline: 9px; font-size: 11px; }
  .game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 10px; }
  .game-index { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .game-index a { padding: 12px 10px; font-size: 13px; }
  .game-card__media { border-radius: 14px; }
  .game-card__info { top: 7px; right: 7px; width: 34px; height: 34px; font-size: 19px; }
  .game-description { max-height: calc(100dvh - 16px); }
  .game-description__panel { max-height: calc(100dvh - 16px); padding: 20px 17px 28px; border-radius: 18px; }
  .game-card__name { margin-top: 8px; font-size: 13px; }
  .game-card__name i { width: 7px; height: 7px; }
  .footer { width: calc(100% - 24px); }
  .game-fallback { grid-template-columns: 1fr; align-content: center; gap: 24px; width: calc(100% - 28px); }
  .game-fallback > img { display: none; }
  .game-info { inset: 8px; width: calc(100% - 16px); max-height: calc(100% - 16px); padding: 20px 17px 28px; border-radius: 18px; }
  .game-info p { font-size: 16px; }
  .seo-keywords { margin-bottom: 28px; }
  .seo-section { padding: 25px 0; }
  .seo-related { padding: 20px 16px; }
}

@media (max-width: 420px) {
  .catalog-controls { grid-template-columns: minmax(0,1fr); }
  .game-search, .provider-control { width: 100%; }
  .provider-control select { padding-left: 14px; padding-right: 34px; font-size: 13px; }
  .provider-control::after { right: 16px; }
  .provider-trigger { padding-inline: 14px; font-size: 13px; }
  .provider-menu { width: 100%; max-width: none; }
}

@media (max-width: 360px) {
  .catalog-toolbar__title { gap: 8px; }
  .catalog-toolbar__title h2 { font-size: 30px; }
  .catalog-count { min-width: 58px; padding: 7px 8px; font-size: 10px; }
  .catalog-toolbar .eyebrow { font-size: 11px; letter-spacing: .1em; }
  .category-dialog__panel { padding-inline: 14px; }
  .category-card { grid-template-columns: 42px minmax(0,1fr) 18px; gap: 8px; padding: 10px; }
  .category-card__icon { width: 42px; height: 42px; font-size: 28px; }
  .category-card__copy strong { font-size: 18px; }
  .category-card__arrow { font-size: 20px; text-align: right; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; transition: none !important; }
}

/* Game entrance and information sheet. Shared across all selected games. */
.game-page { min-height:100svh; background:#09070f; }
.welcome-backdrop { position:fixed; inset:0; pointer-events:none; background:radial-gradient(ellipse at 70% 40%,#821e4933,transparent 65%),#09070f; overflow:hidden; }
.welcome-backdrop::before { content:""; position:absolute; inset:-100px; background-image:linear-gradient(#09070fa8,#09070fe8),var(--game-art); background-size:cover; background-position:center; filter:blur(60px); opacity:.6; }
.game-topbar { position:relative; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:22px 32px; border-bottom:1px solid #ffffff0c; }
.slotx-wordmark { color:#fff; font-size:24px; font-weight:950; text-decoration:none; letter-spacing:-1px; }
.slotx-wordmark b { color:#ff416c; }
.game-topbar button { background:none; border:0; color:#e6dde8; font:inherit; cursor:pointer; }
.game-topbar button span { margin-left:8px; color:#ac9baa; }
.game-topbar__mode { color:#a79aaa; font-size:13px; }
.game-welcome { position:relative; min-height:calc(100svh - 78px); display:flex; flex-direction:column; justify-content:center; align-items:center; padding:48px 24px; }
.game-page.igp-player-open .game-topbar,
.game-page.igp-player-open .game-welcome { display:none; }
.welcome-card { position:relative; display:grid; grid-template-columns:260px 1fr; width:min(790px,100%); overflow:hidden; background:linear-gradient(130deg,#24202aee,#17121cee); border:1px solid #ffffff19; border-radius:28px; box-shadow:0 35px 100px #0009; }
.welcome-art { position:relative; min-height:360px; overflow:hidden; background:#17111d; }
.welcome-art img { width:100%; height:100%; object-fit:cover; display:block; }
.welcome-art::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#100b16ba,transparent 55%); }
.welcome-art>span { position:absolute; left:24px; bottom:24px; z-index:1; padding:8px 12px; border:1px solid #ffffff40; border-radius:100px; background:#100c1777; color:#fff; font-size:10px; font-weight:800; letter-spacing:2px; backdrop-filter:blur(12px); }
.welcome-content { display:flex; flex-direction:column; padding:42px 36px 26px; min-width:0; }
.welcome-content .eyebrow,.info-header .eyebrow { color:#ff849e; font-size:11px; letter-spacing:1.8px; margin:0 0 12px; }
.welcome-content h1 { color:#fff; font-size:clamp(28px,3.5vw,44px); letter-spacing:-1.5px; line-height:1.1; margin:0; overflow-wrap:anywhere; }
.welcome-description { color:#a99fac; margin:16px 0 24px; }
.welcome-facts { display:flex; gap:45px; margin:0 0 30px; }
.welcome-facts span { display:block; font-size:12px; color:#9e92a5; margin-bottom:6px; }
.welcome-facts strong { color:#dcd3df; font-weight:500; }
.welcome-play { display:flex; justify-content:center; align-items:center; gap:15px; width:100%; min-height:56px; padding:14px 22px; border:1px solid #ff6f91; border-radius:14px; background:linear-gradient(110deg,#fa2d60,#d91c4b); color:white; font:inherit; font-weight:750; font-size:17px; cursor:pointer; box-shadow:0 8px 28px #ee235333; transition:transform .18s,filter .18s; }
.welcome-play:hover { filter:brightness(1.12); transform:translateY(-1px); }
.welcome-play span:last-child { margin-left:auto; }
.welcome-play span:first-child { margin-right:auto; }
.welcome-more { border:0; background:none; color:#c2b4c8; font:inherit; font-size:13px; padding:18px 0 0; cursor:pointer; }
.welcome-more:hover { color:white; }
.welcome-close { position:absolute; z-index:2; right:12px; top:10px; width:30px; height:30px; display:grid; place-items:center; color:#bdafc5; text-decoration:none; font-size:24px; border-radius:50%; }
.welcome-close:hover { background:#ffffff12; }
.game-info { position:fixed; inset:0; width:min(760px,calc(100% - 48px)); max-width:none; max-height:calc(100svh - 64px); margin:auto; padding:36px; border:1px solid #ffffff20; border-radius:24px; color:#f5eff8; background:#19151f; box-shadow:0 32px 120px #000b; overflow:auto; }
.game-info::backdrop { background:#06050bd9; backdrop-filter:blur(16px); }
.game-info:not([open]) { display:none; }
.game-info .game-info__close { top:0; width:34px; height:34px; background:#302735; border:1px solid #ffffff1c; box-shadow:none; font-size:24px; border-radius:50%; }
.info-header { display:flex; align-items:center; gap:22px; padding:0 32px 28px 0; border-bottom:1px solid #ffffff12; }
.info-header>img { width:76px; height:100px; object-fit:cover; border-radius:12px; }
.info-header>div { flex:1; min-width:0; }
.game-info .info-header h2 { margin:0; font-size:30px; letter-spacing:-.8px; overflow-wrap:anywhere; }
.info-header p { margin:8px 0 0; }
.info-header .welcome-play { width:145px; flex-shrink:0; }
.info-layout { display:grid; grid-template-columns:minmax(0,1fr) 230px; gap:40px; padding-top:28px; }
.info-media { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:30px; }
.info-media>div { aspect-ratio:16/10; border:1px solid #ffffff10; border-radius:12px; display:grid; place-items:center; color:#665b71; background:linear-gradient(140deg,#2b2433,#211b29); }
.game-info .seo-section,.game-info .seo-related,.info-features,.info-tags { margin:0; padding:22px 0; border-bottom:1px solid #ffffff0e; }
.game-info .seo-article h2,.info-sidebar h2 { font-size:22px; line-height:1.25; letter-spacing:-.4px; margin:0 0 12px; }
.game-info .seo-article h3 { font-size:22px; line-height:1.25; letter-spacing:-.4px; margin:0 0 12px; }
.game-info p { font-size:15px; line-height:1.65; margin:8px 0; color:#afa2b8; }
.info-sidebar section { padding:20px; border:1px solid #ffffff10; border-radius:16px; margin-bottom:16px; background:#ffffff03; }
.info-sidebar h2 { font-size:16px; }
.game-info .info-rating { font-size:36px; color:#fff; }.info-rating span { font-size:16px; color:#8f829a; }
.info-features summary { cursor:pointer; font-size:22px; font-weight:700; }
.info-features dl { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin:24px 0 0; }
.info-features dt { font-size:12px; color:#94879e; }.info-features dd { margin:6px 0 0; font-size:14px; color:#e0d6e6; }
.game-page :focus-visible { outline:2px solid #ff91ac; outline-offset:5px; }
@media(max-width:700px) {
 .game-topbar { padding:18px; }.game-topbar__mode { display:none; }.game-topbar button { max-width:65%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
 .game-welcome { padding:28px 18px; min-height:calc(100svh - 70px); }
 .welcome-card { grid-template-columns:1fr; max-width:410px; border-radius:22px; }
 .welcome-art { min-height:0; height:175px; }.welcome-art img { object-position:center 28%; }.welcome-art>span { left:20px; bottom:16px; }
 .welcome-content { padding:24px; }.welcome-content h1 { font-size:30px; }.welcome-description { margin:12px 0; }.welcome-facts { margin:0 0 20px; }
 .welcome-play { gap:8px; padding-inline:14px; font-size:15px; }
 .welcome-play span { flex:0 0 auto; }
 .welcome-close { background:#120d1aaa; color:#fff; }
 .game-info { width:calc(100% - 16px); max-height:calc(100svh - 16px); padding:20px; border-radius:18px; }
 .info-header { flex-wrap:wrap; gap:14px; padding-right:0; }.info-header>img { width:60px;height:80px; }.game-info .info-header h2 { font-size:23px; }.info-header .welcome-play { width:100%; }
 .info-layout { grid-template-columns:1fr; gap:24px; }.info-features dl { grid-template-columns:repeat(2,1fr); }.info-media { gap:8px; margin-bottom:10px; }.info-sidebar { display:grid;grid-template-columns:1fr 1fr;gap:12px; }.info-sidebar section { padding:14px; }
}
@media(prefers-reduced-motion:reduce) { .welcome-play { transition:none; } }

.game-info .info-features summary h2 { display:inline; margin:0; }

.welcome-art picture { display:block; width:100%; height:100%; }
@media(max-width:700px) {
 .welcome-art { height:180px; isolation:isolate; display:flex; align-items:center; justify-content:center; }
 .welcome-art::before { content:""; position:absolute; z-index:-2; inset:-24px; background-image:var(--cover-art); background-size:cover; background-position:center; filter:blur(20px); opacity:.65; }
 .welcome-art::after { z-index:-1; background:linear-gradient(180deg,#100b1630,#100b1690); }
 .welcome-art picture { width:100%; height:156px; }
 .welcome-art picture img { width:100%; max-width:100%; height:100%; object-fit:contain; object-position:center; }
 .welcome-art>span { left:12px; bottom:12px; font-size:8px; padding:6px 8px; letter-spacing:1px; }
 /* Reserve the wide artwork's space before the <source> image has decoded. */
 .welcome-art--landscape { height:auto; aspect-ratio:var(--landscape-ratio, 16/9); }
 .welcome-art--landscape::before { display:none; }
 .welcome-art--landscape picture { position:absolute; inset:0; width:100%; height:100%; }
 .welcome-art--landscape picture img { width:100%; height:100%; object-fit:contain; }
}

.welcome-art .welcome-landscape-logo { display:none; }
@media(max-width:700px) {
 .welcome-art .welcome-landscape-logo { display:block; position:absolute; width:76%; max-width:76%; height:60%; object-fit:contain; left:12%; top:17%; filter:drop-shadow(0 3px 8px #0008); }
}

@media(max-width:700px) {
 .welcome-art--sugar-scatter { aspect-ratio:800/310; }
 .welcome-art--sugar-scatter picture { position:absolute; top:0; left:0; width:100%; height:auto; }
}

@media(max-width:700px) { .welcome-art--sugar-rush { aspect-ratio:1200/560; } }

/* The information is the server-rendered page; the non-modal player is its backdrop. */
.game-page .game-info-page { position:fixed; z-index:100; inset:0; overflow-y:auto; overscroll-behavior:contain; visibility:hidden; opacity:0; pointer-events:none; background:#0b0810; color:#f8f3f8; scrollbar-color:#8c183c #160c17; }
.game-page .game-info-page.is-open { visibility:visible; opacity:1; pointer-events:auto; }
.game-page.is-info-open .igp-player { filter:brightness(.35); }
.game-info-page__header { position:sticky; z-index:3; top:0; display:flex; align-items:center; gap:clamp(16px,3vw,42px); min-height:76px; padding:12px max(24px,calc((100vw - 1120px)/2)); border-bottom:1px solid #ffffff20; background:#110c17eb; backdrop-filter:blur(18px); }
.game-info-page__brand,.game-info-page__footer>a { color:#fff; text-decoration:none; font-size:22px; font-weight:900; letter-spacing:.06em; white-space:nowrap; }
.game-info-page__brand b,.game-info-page__footer b { color:#ff4269; }
.game-info-page__header nav { display:flex; gap:24px; margin:auto; }
.game-info-page__header nav a { color:#c9bdc9; text-decoration:none; font-weight:650; }
.game-info-page__header nav a:hover { color:#fff; }
.game-info-page__close,.game-info-page__footer button { border:1px solid #ffffff38; border-radius:100px; padding:11px 18px; background:#ffffff0d; color:#fff; font:inherit; font-weight:700; cursor:pointer; }
.game-info-page__close span { margin-left:12px; font-size:20px; line-height:0; }
.game-info-page__body { width:min(1120px,calc(100% - 48px)); margin:auto; }
.game-info-page__hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,32%); align-items:center; gap:clamp(30px,6vw,100px); padding:clamp(54px,8vw,110px) 0; border-bottom:1px solid #ffffff24; }
.game-info-page__eyebrow { margin:0 0 18px; color:#ff7393; font-size:12px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.game-info-page__intro h2 { margin:0; max-width:840px; font-size:clamp(40px,6vw,82px); line-height:1.04; letter-spacing:-.055em; overflow-wrap:anywhere; }
.game-info-page__lead { max-width:740px; margin:26px 0 32px; color:#d8cbd8; font-size:clamp(18px,2vw,23px); line-height:1.55; }
.game-info-page__play { min-height:52px; padding:13px 21px; border:1px solid #ff829c; border-radius:12px; background:linear-gradient(120deg,#a51239,#ed315a); box-shadow:0 12px 32px #c112463d; color:#fff; font:inherit; font-weight:800; cursor:pointer; }
.game-info-page__play span { margin-left:14px; }
.game-info-page__art { display:block; width:100%; }
.game-info-page__art img { display:block; width:100%; max-height:430px; object-fit:contain; filter:drop-shadow(0 26px 40px #0008); }
.game-info-page__categories { padding:30px 0 36px; border-bottom:1px solid #ffffff24; }
.game-info-page__categories h3 { margin:0 0 17px; color:#cdbecb; font-size:13px; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
.game-info-page__category-list { display:flex; flex-wrap:wrap; gap:10px; }
.game-info-page__category-chip { display:inline-flex; align-items:center; gap:10px; min-height:44px; padding:9px 15px; border:1px solid #ff73934d; border-radius:999px; background:linear-gradient(135deg,#6c183033,#ffffff0b); color:#fff; font-size:14px; font-weight:750; text-decoration:none; transition:background .18s,border-color .18s,transform .18s; }
.game-info-page__category-chip:hover { transform:translateY(-2px); border-color:#ff8ba8; background:#b9284d66; }
.game-info-page__category-chip:focus-visible { outline:3px solid #ffb0c2; outline-offset:3px; }
.game-info-page__category-icon { color:#ff8ca8; font-size:17px; line-height:1; }
.game-info-page__category-arrow { color:#ff9bb2; font-size:17px; line-height:1; }
.game-info-page__sections { display:block; }
.game-info-page__section { display:block; width:100%; padding:54px 0 62px; border-bottom:1px solid #ffffff22; scroll-margin-top:90px; }
.game-info-page__section h3 { margin:0 0 20px; color:#fff; font-size:clamp(30px,3.8vw,48px); line-height:1.1; letter-spacing:-.035em; }
.game-info-page__section p { max-width:800px; margin:0 0 18px; color:#c8bbca; font-size:clamp(17px,1.7vw,20px); line-height:1.7; }
.game-facts { margin:48px 0 72px; padding:clamp(24px,3vw,36px); border:1px solid #ff739338; border-radius:22px; background:linear-gradient(135deg,#37142488,#1b1120 55%,#251426); box-shadow:0 18px 48px #0003; }
.game-facts h3 { margin:0 0 23px; color:#fff; font-size:clamp(25px,3vw,34px); line-height:1.18; letter-spacing:-.025em; }
.game-facts__table { margin:0; border-top:1px solid #ffffff23; }
.game-facts__row { display:grid; grid-template-columns:minmax(170px,38%) minmax(0,1fr); gap:16px; align-items:baseline; padding:19px 0; border-bottom:1px solid #ffffff23; }
.game-facts__row dt { color:#bdaeba; font-size:14px; font-weight:700; }
.game-facts__row dd { min-width:0; margin:0; color:#fff; font-size:18px; font-weight:750; overflow-wrap:anywhere; }
.game-unavailable .game-facts { width:min(600px,100%); margin:22px 0 4px; text-align:left; }
.game-info-page__footer { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:112px; padding:28px max(24px,calc((100vw - 1120px)/2)); color:#a99cab; }
@media(max-width:700px) { .game-info-page__header { min-height:66px; flex-wrap:wrap; gap:8px 16px; padding:12px 18px; } .game-info-page__header nav { order:3; width:100%; margin:4px 0 0; font-size:13px; } .game-info-page__close { margin-left:auto; padding:9px 12px; font-size:13px; } .game-info-page__body { width:calc(100% - 36px); } .game-info-page__hero { display:flex; flex-direction:column-reverse; align-items:stretch; gap:24px; padding:30px 0 42px; } .game-info-page__art img { max-height:180px; } .game-info-page__lead { margin:18px 0 24px; } .game-info-page__section { padding:38px 0 42px; } .game-facts { margin:28px 0 42px; padding:22px 18px; border-radius:18px; } .game-facts__row { grid-template-columns:1fr; gap:6px; padding:15px 0; } .game-facts__row dd { font-size:17px; } .game-info-page__footer { min-height:0; flex-wrap:wrap; padding:30px 18px; } }
@media(max-width:700px) { .game-info-page__art--landscape img { max-height:none; height:auto; } }

@media(max-width:700px) {
 .welcome-art--crop { aspect-ratio:var(--landscape-ratio); }
 .welcome-art--crop picture { position:absolute; top:0; left:0; width:100%; height:auto; }
}