body.s7-framework.s7-surface-game .s7-game-page {
--s7-game-canvas: min(1340px, calc(100% - 2 * var(--s7-container-gutter)));
--s7-game-radius: 22px;
--s7-game-tabs-height: 56px;
--s7-game-hero-gap: 16px;
--s7-game-shell-inset: clamp(20px, 2.1vw, 28px);
--s7-game-title-inset: calc(var(--s7-game-shell-inset) + 17px);
--s7-game-poster-overlap: 116px;
min-width: 0;
max-width: 100%;
overflow-x: clip;
color: var(--s7-ink);
font-family: var(--s7-font-body);
}
body.s7-framework.s7-surface-game .l-main { background: var(--s7-canvas); }
body.s7-framework.s7-surface-game:not(.admin-bar) #page-header.pos_fixed { top: 0; }
body.s7-framework.s7-surface-game #page-header .l-subheader.at_middle {
padding-block: 0 !important;
background: var(--s7-header-bg) !important;
box-shadow: none !important;
}
body.s7-framework.s7-surface-game #page-header .s7-site-header__inner {
width: min(calc(100% - 2 * var(--s7-container-gutter)), 1340px);
}
body.s7-framework.s7-surface-game .s7-game-page__source,
body.s7-framework.s7-surface-game .s7-game-page__source > section,
body.s7-framework.s7-surface-game .s7-game-page__source .l-section-h,
body.s7-framework.s7-surface-game .s7-game-page__source .wpb_column { min-width: 0; }
body.s7-framework.s7-surface-game .s7-game-page__source > section:not(.s7-game-hero) > .l-section-h {
width: var(--s7-game-canvas);
max-width: none;
}
body.s7-framework.s7-surface-game .s7-game-page__source > section:not(.s7-game-hero) > .l-section-h > .g-cols {
max-width: 100%;
margin-right: 0;
margin-left: 0;
}
body.s7-framework.s7-surface-game .s7-game-hero {
--s7-game-title-ink: var(--s7-header-text);
--s7-game-title-glass: color-mix(in srgb,var(--s7-header-bg) 52%,transparent);
--s7-game-title-glass-opaque: color-mix(in srgb,var(--s7-header-bg) 88%,var(--s7-surface));
--s7-game-title-border: color-mix(in srgb,var(--s7-header-text) 22%,transparent);
position: relative;
box-sizing: border-box;
width: var(--s7-game-canvas);
height: clamp(340px, 27vw, 412px);
min-height: 0;
margin: calc(var(--s7-header-sticky-offset, 70px) + var(--s7-game-hero-gap)) auto 0 !important;
padding: 0 !important;
overflow: clip;
border-radius: var(--s7-game-radius) var(--s7-game-radius) 0 0;
background: transparent;
color: var(--s7-heading);
isolation: isolate;
}
body.s7-framework.s7-surface-game .s7-game-hero[data-s7-game-hero-tone="dark"] {
--s7-game-title-glass: color-mix(in srgb,var(--s7-header-bg) 50%,transparent);
--s7-game-title-border: color-mix(in srgb,var(--s7-header-text) 24%,transparent);
}
body.s7-framework.s7-surface-game .s7-game-hero[data-s7-game-hero-tone="light"] {
--s7-game-title-ink: var(--s7-accent-ink);
--s7-game-title-glass: color-mix(in srgb,var(--s7-download-ink-light) 54%,transparent);
--s7-game-title-glass-opaque: color-mix(in srgb,var(--s7-download-ink-light) 90%,var(--s7-surface));
--s7-game-title-border: color-mix(in srgb,var(--s7-accent-ink) 16%,transparent);
}
body.s7-framework.s7-surface-game .s7-game-hero::after { display: none; }
body.s7-framework.s7-surface-game .s7-game-hero > .l-section-img {
z-index: 0;
background-position: center 20%;
background-size: cover;
transform: none;
}
body.s7-framework.s7-surface-game .s7-game-hero > .l-section-overlay { display: none; }
body.s7-framework.s7-surface-game .s7-game-hero > .l-section-h {
position: relative;
z-index: 1;
box-sizing: border-box;
width: 100%;
max-width: none;
min-height: 100%;
padding: 0;
}
body.s7-framework.s7-surface-game .s7-game-page--composed .s7-game-hero > .l-section-h > .g-cols {
position: absolute;
top: 0;
left: 0;
width: 1px;
height: 1px;
margin: 0 !important;
overflow: hidden;
clip-path: inset(50%);
}
body.s7-framework.s7-surface-game .s7-game-hero-title {
position: absolute;
top: calc(100% + var(--s7-game-shell-inset) - var(--s7-game-poster-overlap));
right: auto;
bottom: auto;
left: var(--s7-game-title-inset);
box-sizing: border-box;
display: flex;
width: fit-content;
max-width: calc(100% - (2 * var(--s7-game-title-inset)));
align-items: center;
padding: 12px 18px;
overflow: hidden;
border: 1px solid var(--s7-game-title-border);
border-radius: 18px;
background: var(--s7-game-title-glass);
box-shadow:0 8px 24px color-mix(in srgb,var(--s7-header-bg) 18%,transparent);
-webkit-backdrop-filter: blur(20px) saturate(1.18);
backdrop-filter: blur(20px) saturate(1.18);
isolation: isolate;
}
body.s7-framework.s7-surface-game .s7-game-hero-title::before {
display:none;
content:none;
}
body.s7-framework.s7-surface-game .s7-game-hero-title::after { display: none; }
body.s7-framework.s7-surface-game .s7-game-hero-title [data-s7-game-role="title"] {
position: relative;
z-index: 1;
max-width: none;
margin: 0;
color: var(--s7-game-title-ink);
font: 650 clamp(23px, 2vw, 32px)/1.12 var(--s7-font-display);
letter-spacing: -.028em;
text-align: left !important;
text-wrap: balance;
white-space: nowrap;
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
body.s7-framework.s7-surface-game .s7-game-hero-title {
border-color: var(--s7-game-title-border);
background: var(--s7-game-title-glass);
box-shadow:0 8px 24px color-mix(in srgb,var(--s7-header-bg) 18%,transparent);
-webkit-backdrop-filter:blur(20px) saturate(1.18);
backdrop-filter:blur(20px) saturate(1.18);
}
}
body.s7-framework.s7-surface-game .s7-game-shell {
position: relative;
z-index: 2;
box-sizing: border-box;
width: var(--s7-game-canvas);
margin: 0 auto 28px;
padding: var(--s7-game-shell-inset);
border: 1px solid var(--s7-border);
border-top: 0;
border-radius: 0 0 var(--s7-game-radius) var(--s7-game-radius);
background: var(--s7-surface);
box-shadow: var(--s7-shadow-ambient);
}
body.s7-framework.s7-surface-game .s7-game-primary {
display: grid;
grid-template-columns: minmax(0, 1fr) clamp(280px, 24vw, 320px);
align-items: start;
gap: clamp(22px, 2.4vw, 32px);
}
body.s7-framework.s7-surface-game .s7-game-sidebar,
body.s7-framework.s7-surface-game .s7-game-primary,
body.s7-framework.s7-surface-game .s7-game-main,
body.s7-framework.s7-surface-game .s7-game-panels,
body.s7-framework.s7-surface-game .s7-game-supplements { min-width: 0; }
body.s7-framework.s7-surface-game .s7-game-main { grid-column: 1; grid-row: 1; padding-top: 0; }
body.s7-framework.s7-surface-game .s7-game-sidebar {
box-sizing: border-box;
grid-column: 2;
grid-row: 1;
margin-top: -116px;
padding-inline: 0;
}
body.s7-framework.s7-surface-game .s7-game-poster .w-image-h {
display: block;
aspect-ratio: 2 / 3;
overflow: hidden;
border-radius: 14px;
background: transparent;
}
body.s7-framework.s7-surface-game .s7-game-poster {
display: block;
box-sizing: border-box;
aspect-ratio: auto;
padding: 6px;
overflow: hidden;
border: 1px solid var(--s7-border);
border-radius: 20px !important;
background: var(--s7-surface);
box-shadow: var(--s7-shadow-ambient);
}
body.s7-framework.s7-surface-game .s7-game-poster .w-image-h {
position: relative;
border-radius: 14px !important;
box-shadow: none;
}
body.s7-framework.s7-surface-game .s7-game-poster img {
position: relative;
z-index: 1;
display: block;
width: 100%;
height: 100%;
border: 0 !important;
border-radius: 14px !important;
opacity: 1 !important;
visibility: visible !important;
object-fit: cover;
}
body.s7-framework.s7-surface-game .s7-game-action-island {
display: grid;
gap: 10px;
margin-top: 14px;
padding: 0 7px 4px;
border: 0;
border-radius: 0;
background: transparent;
color: var(--s7-muted);
}
body.s7-framework.s7-surface-game .s7-game-action-island > * { min-width: 0; }
body.s7-framework.s7-surface-game .s7-game-action-island .w-btn-wrapper { margin: 0; }
body.s7-framework.s7-surface-game .s7-game-action-island .wpb_text_column:has(.s7-dl-counter) { margin: 0; }
body.s7-framework.s7-surface-game .s7-game-action-island p:has(.s7-dl-counter) {
margin: 0 !important;
color: var(--s7-ink) !important;
font: 500 13px/1.4 var(--s7-font-body);
text-align: center;
}
body.s7-framework.s7-surface-game .s7-game-action-island p:has(.s7-dl-counter) > span {
color: inherit !important;
font-size: inherit !important;
}
body.s7-framework.s7-surface-game .s7-game-action-island .s7-dl-counter {
color: var(--s7-brand-accent) !important;
font-weight: 500;
font-variant-numeric: tabular-nums;
}
body.s7-framework.s7-surface-game .s7-game-primary-action {
box-sizing: border-box;
width: fit-content;
max-width: 100%;
min-width: min(180px, 100%);
display: flex !important;
margin-inline: auto !important;
align-items: center;
justify-content: center;
flex-wrap: nowrap;
gap: 8px;
}
body.s7-framework.s7-surface-game .s7-game-primary-action .w-btn-label {
min-width: 0;
flex: 0 1 auto;
line-height: 1.2;
text-align: center;
white-space: normal;
overflow-wrap: anywhere;
text-wrap: balance;
}
body.s7-framework.s7-surface-game .s7-game-primary-action > i { margin-left: 0 !important; flex: 0 0 auto; }
body.s7-framework.s7-surface-game .s7-game-primary-action.us-btn-style_15 {
border-color: transparent !important;
background: linear-gradient(135deg, color-mix(in srgb, var(--s7-brand-purple) 72%, white) 0%, var(--s7-brand-purple) 52%, color-mix(in srgb, var(--s7-brand-purple) 78%, black) 100%) !important;
box-shadow: inset 0 1px 0 color-mix(in srgb, white 22%, transparent), 0 8px 18px color-mix(in srgb, var(--s7-brand-purple) 22%, transparent);
}
body.s7-framework.s7-surface-game .s7-game-action-island .w-iconbox {
margin: 2px 0 0;
padding-top: 12px;
border-top: 1px solid var(--s7-border);
color: var(--s7-ink);
}
body.s7-framework.s7-surface-game .s7-game-action-island .w-iconbox-icon { color: var(--s7-accent); }
body.s7-framework.s7-surface-game .s7-game-action-island .w-iconbox p { color: var(--s7-ink) !important; font-weight: 400; }
body.s7-framework.s7-surface-game .s7-game-tabs {
position: sticky;
z-index: 10;
top: var(--s7-header-sticky-offset, 70px);
box-sizing: border-box;
display: flex;
width: 100%;
max-width: 100%;
min-width: 0;
min-height: var(--s7-game-tabs-height);
align-items: flex-start;
gap: 28px;
padding: 12px 16px 0;
overflow: auto hidden;
border: 0;
border-radius: 0;
background: color-mix(in srgb, var(--s7-surface) 92%, transparent);
box-shadow: none;
scrollbar-width: none;
}
body.s7-framework.s7-surface-game .s7-game-tabs::after {
position: absolute;
right: 0;
bottom: 0;
left: 16px;
z-index: 0;
height: 1px;
background: var(--s7-border);
content: "";
pointer-events: none;
}
body.s7-framework.s7-surface-game .s7-game-tabs[hidden] { display: none; }
body.s7-framework.s7-surface-game .s7-game-tabs::-webkit-scrollbar { display: none; }
body.s7-framework.s7-surface-game .s7-game-tabs__tab {
position: relative;
z-index: 1;
display: flex;
min-width: max-content;
min-height: 44px;
align-items: flex-start;
padding: 0;
border: 0;
background: transparent;
color: var(--s7-muted);
cursor: pointer;
font: 650 14px/28px var(--s7-font-display);
transition: color 160ms var(--s7-ease-out), transform 120ms var(--s7-ease-out);
}
body.s7-framework.s7-surface-game .s7-game-tabs__tab::after {
position: absolute;
right: 0;
bottom: 0;
left: 0;
height: 2px;
background: var(--s7-accent);
content: "";
opacity: 0;
transform: scaleX(.55);
transform-origin: center;
transition: opacity 160ms var(--s7-ease-out), transform 160ms var(--s7-ease-out);
}
body.s7-framework.s7-surface-game .s7-game-tabs__tab[aria-selected="true"] { color: var(--s7-heading); }
body.s7-framework.s7-surface-game .s7-game-tabs__tab[aria-selected="true"]::after { opacity: 1; transform: scaleX(1); }
body.s7-framework.s7-surface-game .s7-game-panels { width: 100%; }
body.s7-framework.s7-surface-game .s7-game-anchor {
display: block;
width: 0;
height: 0;
overflow: hidden;
scroll-margin-top: calc(var(--s7-header-sticky-offset, 70px) + var(--s7-game-tabs-height) + 16px);
}
body.s7-framework.s7-surface-game .s7-game-panels > [role="tabpanel"] {
box-sizing: border-box;
width: 100%;
min-width: 0;
padding: 20px 16px 8px;
border: 0;
border-radius: 0;
background: transparent;
margin-top: 0;
scroll-margin-top: calc(var(--s7-header-sticky-offset, 70px) + var(--s7-game-tabs-height) + 16px);
}
body.s7-framework.s7-surface-game .s7-game-tabs-ready [role="tabpanel"][hidden] { display: none !important; }
body.s7-framework.s7-surface-game .s7-game-tabs-ready .s7-game-panels > .w-tabs-section[role="tabpanel"]:not([hidden]) { display: block !important; }
body.s7-framework.s7-surface-game .s7-game-tabs-ready .s7-game-panels .w-tabs-section-header { display: none; }
body.s7-framework.s7-surface-game .s7-game-tabs-ready .s7-game-panels .w-tabs-section-content {
display: block !important;
height: auto !important;
max-height: none !important;
padding: 0 !important;
overflow: visible !important;
}
body.s7-framework.s7-surface-game .s7-game-panels .wpb_text_column:not([role="tabpanel"]),
body.s7-framework.s7-surface-game .s7-game-panels .w-tabs-section-content-h {
max-width: 75ch;
color: var(--s7-ink);
font-size: var(--s7-body-size);
line-height: 1.72;
}
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-panel="about"] .w-tabs-section-content-h,
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-panel="about"] .s7-game-about-description {
width: 100%;
max-width: none;
}
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-panel="features"] .w-tabs-section-content-h,
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-panel="features"] .wpb_text_column:not([role="tabpanel"]) {
width: 100%;
max-width: none;
}
body.s7-framework.s7-surface-game .s7-game-panels p { margin-block: 0 1.1em; }
body.s7-framework.s7-surface-game .s7-game-panels :is(h2, h3) { color: var(--s7-heading) !important; }
body.s7-framework.s7-surface-game .s7-game-facts {
display: grid;
margin: 0;
grid-template-columns: repeat(auto-fit, minmax(min(168px, 100%), 1fr));
grid-auto-flow: row dense;
gap: 16px 20px;
}
body.s7-framework.s7-surface-game .s7-game-facts__row { min-width: 0; grid-column: auto; grid-row: auto; }
body.s7-framework.s7-surface-game .s7-game-facts__row--genre {
grid-column: span 2;
padding-top: 0;
border-top: 0;
}
body.s7-framework.s7-surface-game .s7-game-facts__row--languages { grid-column: 1 / -1; }
body.s7-framework.s7-surface-game .s7-game-facts__row--languages:has(.s7-game-languages__disclosure[open]) { grid-column: 1 / -1; }
body.s7-framework.s7-surface-game .s7-game-facts__row--genre dd { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; scrollbar-width: thin; }
body.s7-framework.s7-surface-game .s7-game-facts dt {
margin: 0 0 5px;
color: var(--s7-muted);
font: 600 var(--s7-label-size)/1.2 var(--s7-font-display);
}
body.s7-framework.s7-surface-game .s7-game-facts dd {
display: flex;
min-width: 0;
margin: 0;
flex-wrap: wrap;
gap: 7px;
color: var(--s7-ink);
font-weight: 450;
}
body.s7-framework.s7-surface-game .s7-game-facts__genre {
padding: 5px 10px;
border: 1px solid var(--s7-border);
border-radius: 999px;
background: var(--s7-surface-muted);
color: var(--s7-heading);
font-size: var(--s7-label-size);
line-height: 1.15;
text-decoration: none;
transition: border-color 160ms var(--s7-ease-out), color 160ms var(--s7-ease-out), background-color 160ms var(--s7-ease-out);
}
body.s7-framework.s7-surface-game .s7-game-about-description {
max-width: 80ch;
margin: 0;
}
body.s7-framework.s7-surface-game .s7-game-about-heading { display: none; }
body.s7-framework.s7-surface-game [data-s7-game-panel="about"] > .wpb_wrapper:empty { display: none; }
body.s7-framework.s7-surface-game .s7-game-details {
margin-top: 0;
padding-top: 0;
}
body.s7-framework.s7-surface-game .s7-game-languages {
box-sizing: border-box;
min-width: 0;
margin: 0;
padding: 0;
}
body.s7-framework.s7-surface-game .s7-game-languages__overview { display: block; min-width: 0; max-width: 100%; flex: 0 0 auto; }
body.s7-framework.s7-surface-game .s7-game-facts dd.s7-game-languages__body { display: flex; width: 100%; min-width: 0; max-width: 100%; align-items: center; flex-wrap: wrap; gap: 8px 12px; }
body.s7-framework.s7-surface-game .s7-game-languages__value { display: block; color: var(--s7-ink); font-size: var(--s7-body-size); font-weight: 450; line-height: 1.5; white-space: nowrap; }
body.s7-framework.s7-surface-game .s7-game-languages__disclosure,
body.s7-framework.s7-surface-game .s7-game-languages__disclosure[open] { display: contents; }
body.s7-framework.s7-surface-game .s7-game-languages__disclosure > summary {
display: inline-flex;
width: fit-content;
min-height: 0;
align-items: center;
gap: 6px;
padding: 5px 10px;
flex: 0 0 auto;
border: 1px solid var(--s7-border);
border-radius: 999px;
background: var(--s7-surface-muted);
color: var(--s7-heading);
cursor: pointer;
font: 500 var(--s7-label-size)/1.15 var(--s7-font-body);
list-style: none;
transition: border-color 160ms var(--s7-ease-out), background-color 160ms var(--s7-ease-out), color 160ms var(--s7-ease-out);
}
body.s7-framework.s7-surface-game .s7-game-languages__disclosure > summary::-webkit-details-marker { display: none; }
body.s7-framework.s7-surface-game .s7-game-languages__disclosure > summary::before { color: currentColor; content: "▸"; transition: transform 160ms var(--s7-ease-out); }
body.s7-framework.s7-surface-game .s7-game-languages__disclosure[open] > summary::before { transform: rotate(90deg); }
body.s7-framework.s7-surface-game .s7-game-languages__table-wrap { box-sizing: border-box; width: 100%; min-width: 0; max-width: 100%; max-height: none; padding-top: 0; overflow-x: auto; overflow-y: hidden; overscroll-behavior-inline: contain; flex: 0 0 100%; }
body.s7-framework.s7-surface-game .s7-game-languages table { width: 100%; min-width: 520px; margin: 0; border-collapse: collapse; table-layout: fixed; font-size: 13px; }
body.s7-framework.s7-surface-game .s7-game-languages thead th:first-child { width: 48%; }
body.s7-framework.s7-surface-game .s7-game-languages thead th:not(:first-child) { width: 26%; text-align: center; }
body.s7-framework.s7-surface-game .s7-game-languages :is(th, td) { padding: 10px 12px; border-bottom: 1px solid var(--s7-border); text-align: left; }
body.s7-framework.s7-surface-game .s7-game-languages tbody td { color: var(--s7-heading); font-size: 17px; text-align: center; }
body.s7-framework.s7-surface-game .s7-game-languages tbody th { color: var(--s7-ink); font-weight: 500; }
body.s7-framework.s7-surface-game .s7-game-languages__check { display: inline-block; line-height: 1; }
body.s7-framework.s7-surface-game .s7-game-languages tbody tr:last-child :is(th, td) { border-bottom: 0; }
body.s7-framework.s7-surface-game .s7-game-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
body.s7-framework.s7-surface-game .s7-game-panels img,
body.s7-framework.s7-surface-game .s7-game-panels video,
body.s7-framework.s7-surface-game .s7-game-panels iframe {
max-width: 100%;
height: auto;
border-radius: 14px;
}
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-panel="features"] .w-tabs-section-content-h { max-width: none; }
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-panel="features"] { padding-top: 24px; }
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-panel="features"] ul {
column-count: 1;
column-gap: normal;
}
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-panel="features"] li {
margin-bottom: 14px;
break-inside: avoid;
}
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-role="about-support"] {
display: block !important;
margin-top: 30px;
padding-top: 30px;
border-top: 1px solid var(--s7-border);
}
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-role="about-support"] .w-tabs-section-header { display: none; }
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-role="about-support"] .w-tabs-section-content {
display: block !important;
height: auto !important;
}
body.s7-framework.s7-surface-game [data-s7-game-panel="about"] .s7-game-details {
margin-top: 24px;
padding-top: 20px;
border-top: 1px solid var(--s7-border);
}
body.s7-framework.s7-surface-game [data-s7-game-panel="about"] .s7-game-facts {
grid-template-columns: repeat(auto-fit, minmax(min(168px, 100%), 1fr));
}
body.s7-framework.s7-surface-game [data-s7-game-panel="about"] .s7-game-languages {
width: 100%;
}
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-panel="requirements"] {
padding-top: 24px;
border: 0;
background: transparent;
}
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-panel="requirements"] .w-tabs-section-content-h { width: 100%; max-width: none; }
body.s7-framework.s7-surface-game .s7-game-panels [data-s7-game-panel="requirements"] .wpb_text_column { width: 100%; max-width: none; }
body.s7-framework.s7-surface-game .s7-game-requirements {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 14px;
}
body.s7-framework.s7-surface-game .s7-game-requirements__group {
min-width: 0;
padding: clamp(18px, 2vw, 24px);
border: 1px solid var(--s7-border);
border-radius: var(--s7-game-radius);
background: var(--s7-surface);
}
body.s7-framework.s7-surface-game .s7-game-requirements__group > p:first-child {
margin: 0 0 16px;
color: var(--s7-heading);
font: 800 var(--s7-title-size)/1.2 var(--s7-font-display);
}
body.s7-framework.s7-surface-game .s7-game-requirements__group ul { margin: 0; padding-left: 20px; }
body.s7-framework.s7-surface-game .s7-game-supplements {
display: grid;
gap: 22px;
margin-top: clamp(22px, 2.4vw, 32px);
}
body.s7-framework.s7-surface-game .s7-game-media-island,
body.s7-framework.s7-surface-game .s7-game-supplement {
--s7-game-island-pad: clamp(20px, 2.6vw, 34px);
box-sizing: border-box;
min-width: 0;
padding: var(--s7-game-island-pad);
border: 1px solid var(--s7-border);
border-radius: var(--s7-game-radius);
background: var(--s7-surface);
}
body.s7-framework.s7-surface-game .s7-game-media-island { overflow: hidden; }
body.s7-framework.s7-surface-game .s7-game-media-island > .s7-game-supplement {
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
}
body.s7-framework.s7-surface-game .s7-game-streams {
display: grid;
grid-template-columns: minmax(0, 1fr);
align-items: stretch;
gap: 22px;
}
body.s7-framework.s7-surface-game .s7-game-streams--paired { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.s7-framework.s7-surface-game .s7-game-streams > .s7-game-supplement { height: 100%; background: var(--s7-surface); box-shadow: var(--s7-shadow-ambient); }
body.s7-framework.s7-surface-game .s7-game-native-streams {
width: 100%;
margin: 22px 0 0;
padding: 0 !important;
background: transparent !important;
}
body.s7-framework.s7-surface-game .s7-game-native-streams > .l-section-h { width: var(--s7-game-canvas); max-width: none; padding: 0; }
body.s7-framework.s7-surface-game .s7-game-native-streams > .l-section-h > .g-cols {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr));
align-items: stretch;
gap: 22px;
margin: 0 !important;
}
body.s7-framework.s7-surface-game .s7-game-native-stream { width: auto !important; padding: 0 !important; }
body.s7-framework.s7-surface-game .s7-game-native-stream > .vc_column-inner {
box-sizing: border-box;
height: 100%;
padding: clamp(20px, 2.6vw, 34px) !important;
border: 1px solid var(--s7-border);
border-radius: var(--s7-game-radius);
background: var(--s7-surface);
box-shadow: var(--s7-shadow-ambient);
color: var(--s7-ink);
}
body.s7-framework.s7-surface-game .s7-game-native-stream > .vc_column-inner :is(h2, h3, h4, h5, p, li, blockquote) { color: var(--s7-ink) !important; }
body.s7-framework.s7-surface-game .s7-game-native-stream > .vc_column-inner :is(time, small, .post_date, .w-post-elm-before, .w-post-elm-after) { color: var(--s7-muted) !important; }
body.s7-framework.s7-surface-game .s7-game-native-stream > .vc_column-inner a { color: var(--s7-brand-accent) !important; }
body.s7-framework.s7-surface-game .s7-game-native-stream--news .w-grid .post_title a { color: var(--s7-heading) !important; }
body.s7-framework.s7-surface-game .s7-game-native-stream--news .wpb_text_column h3 a { color: var(--s7-brand-accent) !important; }
body.s7-framework.s7-surface-game .s7-game-supplement--download {
width: 100%;
padding-bottom: clamp(20px, 2vw, 24px);
overflow: hidden;
border-radius: var(--s7-game-radius);
}
body.s7-framework.s7-surface-game .s7-game-download-title {
margin: calc(0px - var(--s7-game-island-pad)) calc(0px - var(--s7-game-island-pad)) 24px;
padding: 20px var(--s7-game-island-pad) 18px;
border-bottom: 1px solid var(--s7-border);
background: var(--s7-surface-muted);
color: var(--s7-heading);
font: 500 clamp(22px, 1.6vw, 26px)/1.2 var(--s7-font-display);
letter-spacing: -.02em;
}
body.s7-framework.s7-surface-game .s7-game-supplement--download .w-separator { display: none; }
body.s7-framework.s7-surface-game .s7-game-supplement--download .w-iconbox {
margin: 0;
padding: 0;
border-top: 0;
}
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-download-button {
--s7-download-button-ink: var(--s7-download-ink-light);
position: relative;
overflow: hidden;
isolation: isolate;
border-color: transparent !important;
background: var(--s7-download-button-background, linear-gradient(145deg, var(--s7-download-button-end), var(--s7-download-button-start))) !important;
box-shadow: inset 0 1px 0 color-mix(in srgb, var(--s7-download-ink-light) 30%, transparent);
color: var(--s7-download-button-ink) !important;
transform: translateZ(0);
}
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-download-button::before {
position: absolute;
inset: 0;
z-index: 1;
border-radius: inherit;
background: radial-gradient(circle at 22% 0%, color-mix(in srgb, var(--s7-download-ink-light) 26%, transparent), transparent 44%);
content: "";
opacity: .72;
pointer-events: none;
}
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-download-button::after {
position: absolute;
inset: 0;
z-index: 0;
border-radius: inherit;
background: var(--s7-download-button-hover-background, linear-gradient(145deg, var(--s7-download-button-start), var(--s7-download-button-end)));
content: "";
opacity: 0;
pointer-events: none;
transition: opacity 300ms ease;
}
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-download-button > * { position: relative; z-index: 2; }
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-download-button :is(i, .w-btn-label) { color: inherit !important; }
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-download-button--torrent { --s7-download-button-start: var(--s7-download-torrent-start); --s7-download-button-end: var(--s7-download-torrent-end); }
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-download-button--cloud { --s7-download-button-start: var(--s7-download-cloud-start); --s7-download-button-end: var(--s7-download-cloud-end); --s7-download-button-background: linear-gradient(145deg, var(--s7-download-cloud-end), var(--s7-download-cloud-brand) 48%, var(--s7-download-cloud-start)); --s7-download-button-hover-background: linear-gradient(145deg, var(--s7-download-cloud-start), var(--s7-download-cloud-brand) 58%, var(--s7-download-cloud-end)); }
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-download-button--yandex { --s7-download-button-start: var(--s7-download-yandex-start); --s7-download-button-end: var(--s7-download-yandex-end); --s7-download-button-ink: var(--s7-download-ink-dark); --s7-download-button-background: linear-gradient(145deg, var(--s7-download-yandex-end), var(--s7-download-yandex-brand) 52%, var(--s7-download-yandex-start)); --s7-download-button-hover-background: linear-gradient(145deg, var(--s7-download-yandex-start), var(--s7-download-yandex-brand) 58%, var(--s7-download-yandex-end)); }
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-download-button--google { --s7-download-button-background: radial-gradient(circle at 92% 100%, color-mix(in srgb, var(--s7-download-google-yellow) 68%, transparent), transparent 36%), linear-gradient(145deg, var(--s7-download-google-blue), var(--s7-download-google-green)); --s7-download-button-hover-background: radial-gradient(circle at 8% 0%, color-mix(in srgb, var(--s7-download-google-yellow) 72%, transparent), transparent 34%), linear-gradient(145deg, var(--s7-download-google-green), var(--s7-download-google-blue)); }
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-download-button--launcher { --s7-download-button-start: var(--s7-download-launcher-start); --s7-download-button-end: var(--s7-download-launcher-end); }
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-purchase {
position: relative;
display: flex;
width: fit-content;
min-height: 42px;
align-items: center;
gap: 8px;
margin: 34px auto 0 !important;
padding: 0 14px !important;
overflow: visible;
border: 1px solid var(--s7-brand-accent);
border-radius: 999px;
background: transparent;
color: var(--s7-heading) !important;
cursor: pointer;
transition: border-color 160ms var(--s7-ease-out), background-color 160ms var(--s7-ease-out), color 160ms var(--s7-ease-out);
}
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-purchase::before {
position: absolute;
top: -18px;
left: 50%;
width: min(420px, calc(100vw - 96px));
border-top: 1px solid var(--s7-border);
content: "";
transform: translateX(-50%);
pointer-events: none;
}
body.s7-framework.s7-surface-game .s7-game-purchase :is(.w-iconbox-icon, .w-iconbox-title, .w-iconbox-link) { color: inherit !important; }
body.s7-framework.s7-surface-game .s7-game-purchase .w-iconbox-icon { flex: 0 0 auto; margin: 0; }
body.s7-framework.s7-surface-game .s7-game-purchase .w-iconbox-title { font-size: 14px !important; font-weight: 600; line-height: 1.25; }
body.s7-framework.s7-surface-game .s7-game-purchase :is(.w-iconbox-icon, .w-iconbox-meta, .w-iconbox-title, .w-iconbox-link, i) { transition: none !important; }
body.s7-framework.s7-surface-game .s7-game-purchase .w-iconbox-link { text-decoration: none; }
body.s7-framework.s7-surface-game .s7-game-purchase .w-iconbox-title > .w-iconbox-link::after { position: absolute; inset: 0; z-index: 2; content: ""; }
body.s7-framework.s7-surface-game .s7-game-comments-island {
min-width: 0;
border: 1px solid var(--s7-border);
border-radius: var(--s7-game-radius);
background: var(--s7-surface);
color: var(--s7-ink);
color-scheme: light;
overflow: hidden;
}
body.s7-framework.s7-surface-game .s7-game-comments-island > .s7-game-supplement {
padding: clamp(20px, 2.6vw, 34px);
border: 0;
border-radius: 0;
background: transparent;
}
body.s7-framework.s7-surface-game .s7-game-comments-island :is(.comments-area, #mc-container) { width: 100%; min-width: 0; background: transparent; color: var(--s7-ink); }
body.s7-framework.s7-surface-game .s7-game-comments-island #mc-link { color: var(--s7-muted) !important; }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game .s7-game-comments-island,
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game .s7-game-comments-island { border-color: color-mix(in srgb, var(--s7-border) 72%, var(--s7-surface-elevated)); background: var(--s7-surface-elevated); color-scheme: dark; }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game .s7-game-comments-island :is(input,textarea,select),
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game .s7-game-comments-island :is(input,textarea,select) { border-color: var(--s7-border) !important; background: var(--s7-surface-muted) !important; color: var(--s7-ink) !important; }
body.s7-framework.s7-surface-game .l-section.for_comments {
box-sizing: border-box;
width: min(calc(100% - 2 * var(--s7-container-gutter)), 1340px);
margin: 28px auto 0;
padding: 0;
background: transparent;
}
body.s7-framework.s7-surface-game .l-section.for_comments > .l-section-h {
width: 100%;
max-width: none;
padding: clamp(18px, 2.4vw, 28px);
border: 1px solid var(--s7-border);
border-radius: var(--s7-radius-lg);
background: var(--s7-surface);
box-shadow: var(--s7-shadow-ambient);
}
body.s7-framework.s7-surface-game .l-section.for_comments :is(#mc-container, .comments-area) { min-width: 0; color-scheme: light; }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game .l-section.for_comments #mc-container,
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game .l-section.for_comments #mc-container,
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game .l-section.for_comments .comments-area,
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game .l-section.for_comments .comments-area { color-scheme: dark; }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game .l-section.for_comments > .l-section-h,
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game .l-section.for_comments > .l-section-h { border-color: color-mix(in srgb, var(--s7-border) 72%, var(--s7-surface-elevated)); background: var(--s7-surface-elevated); }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game #mc-container .cc.mc-c,
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game #mc-container .cc.mc-c,
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game #mc-container :is(.mc-head, .mc-form, .mc-comments, .mc-comment, .mc-comment-info, .mc-comment-head, .mc-comment-body, .mc-comment-inner, .mc-comment-msgcnt, .mc-comment-msg, .mc-comment-child),
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game #mc-container :is(.mc-head, .mc-form, .mc-comments, .mc-comment, .mc-comment-info, .mc-comment-head, .mc-comment-body, .mc-comment-inner, .mc-comment-msgcnt, .mc-comment-msg, .mc-comment-child) { color: var(--s7-ink) !important; }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game #mc-container :is(.mc-comment-username, .mc-comment-parent),
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game #mc-container :is(.mc-comment-username, .mc-comment-parent) { color: var(--s7-heading) !important; }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game #mc-container :is(.mc-menu-toggle, .mc-username, .mc-attach-toggle, .mc-h6, .mc-sort-toggle, .mc-sort-label, .mc-comment-count, .mc-subscr-toggle, .mc-navlabel, .mc-share-toggle, .mc-comment-time, .mc-star-count),
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game #mc-container :is(.mc-menu-toggle, .mc-username, .mc-attach-toggle, .mc-h6, .mc-sort-toggle, .mc-sort-label, .mc-comment-count, .mc-subscr-toggle, .mc-navlabel, .mc-share-toggle, .mc-comment-time, .mc-star-count) { color: var(--s7-muted) !important; }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game #mc-container :is(.mc-nav, .mc-nav a),
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game #mc-container :is(.mc-nav, .mc-nav a) { color: var(--s7-muted) !important; }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game #mc-container .mc-nav .mc-active,
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game #mc-container .mc-nav .mc-active { color: var(--s7-brand-accent) !important; }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game #mc-container :is(.mc-text-wrap, .mc-dropdown-menu, .mc-anonym-name, .mc-anonym-email),
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game #mc-container :is(.mc-text-wrap, .mc-dropdown-menu, .mc-anonym-name, .mc-anonym-email) { border-color: var(--s7-border) !important; background: var(--s7-surface-muted) !important; color: var(--s7-ink) !important; }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game #mc-container .mc-menu,
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game #mc-container .mc-menu { border-bottom-color: var(--s7-border) !important; }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game #mc-container .mc-textarea,
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game #mc-container .mc-textarea { background: transparent !important; color: var(--s7-ink) !important; }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game #mc-container .mc-textarea::placeholder,
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game #mc-container .mc-textarea::placeholder { color: var(--s7-placeholder) !important; opacity: 1; }
body.s7-framework.s7-surface-game .s7-game-supplement .w-tabs-section-header {
display: block !important;
cursor: default;
}
body.s7-framework.s7-surface-game .s7-game-supplement .w-tabs-section-content {
display: block !important;
height: auto !important;
max-height: none !important;
overflow: visible !important;
}
body.s7-framework.s7-surface-game .s7-game-supplement .w-tabs-section-title {
margin: 0 0 18px;
color: var(--s7-heading);
font: 800 var(--s7-title-size)/1.2 var(--s7-font-display);
}
body.s7-framework.s7-surface-game .s7-game-supplement--media :is(.w-gallery-list, .w-grid-list) {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
gap: 12px;
}
body.s7-framework.s7-surface-game .s7-game-supplement--media .owl-carousel { position: relative; }
body.s7-framework.s7-surface-game .s7-game-supplement--media .owl-stage { display: flex; align-items: stretch; }
body.s7-framework.s7-surface-game .s7-game-supplement--media :is(.owl-prev, .owl-next) {
width: var(--s7-touch-min);
min-width: var(--s7-touch-min);
height: var(--s7-touch-min);
min-height: var(--s7-touch-min);
border: 1px solid color-mix(in srgb, var(--s7-border) 76%, transparent) !important;
border-radius: 12px !important;
background: color-mix(in srgb, var(--s7-surface-elevated) 92%, transparent) !important;
box-shadow: var(--s7-shadow-ambient);
color: var(--s7-heading) !important;
transition: border-color 180ms var(--s7-ease-out), background-color 180ms var(--s7-ease-out), color 180ms var(--s7-ease-out);
}
body.s7-framework.s7-surface-game .s7-game-supplement--media .w-separator { display: none; }
body.s7-framework.s7-surface-game .s7-game-supplement--media :is(h2, h3, .w-tabs-section-title) { color: var(--s7-heading) !important; }
body.s7-framework.s7-surface-game .s7-game-supplement--media :is(.w-grid-item-anchor, .w-gallery-item, a):hover { background: transparent !important; }
body.s7-framework.s7-surface-game .s7-game-supplement :is(img, video, iframe) {
max-width: 100%;
height: auto;
border-radius: 14px;
}
body.s7-framework.s7-surface-game .s7-game-page--composed [data-s7-game-role="main"] { display: none; }
body.s7-framework.s7-surface-game .s7-game-page--composed .s7-game-page__source > section:not(.s7-game-hero):empty { display: none; }
body.s7-framework.s7-surface-game .s7-game-download-counter-unavailable { display: none; }
body.s7-framework.s7-surface-game .s7-game-tabs__tab:focus-visible,
body.s7-framework.s7-surface-game .s7-game-action-island a:focus-visible,
body.s7-framework.s7-surface-game [role="tabpanel"]:focus-visible {
outline: 3px solid var(--s7-focus);
outline-offset: 3px;
}
body.s7-framework.s7-surface-game .s7-game-tabs__tab:active { transform: scale(.98); }
@media (hover: hover) and (pointer: fine) {
body.s7-framework.s7-surface-game .s7-game-tabs__tab:hover { color: var(--s7-heading); }
body.s7-framework.s7-surface-game .s7-game-facts__genre:hover { border-color: var(--s7-accent); color: var(--s7-accent); }
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game .s7-game-facts__genre:hover,
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game .s7-game-facts__genre:hover,
html[data-s7-theme-resolved="dark"] body.s7-framework.s7-surface-game .s7-game-languages__disclosure > summary:hover,
html[data-s7-theme="dark"] body.s7-framework.s7-surface-game .s7-game-languages__disclosure > summary:hover { background: color-mix(in srgb, var(--s7-accent) 16%, transparent); color: var(--s7-accent); }
body.s7-framework.s7-surface-game .s7-game-native-stream > .vc_column-inner a:hover { color: var(--s7-accent-strong) !important; }
body.s7-framework.s7-surface-game .s7-game-native-stream--news .w-grid .post_title a:hover { color: var(--s7-brand-accent) !important; }
body.s7-framework.s7-surface-game .s7-game-languages__disclosure > summary:hover { border-color: var(--s7-accent); background: var(--s7-surface-muted); color: var(--s7-accent); }
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-download-button:hover::after { opacity: 1; }
body.s7-framework.s7-surface-game .s7-game-supplement--media :is(.owl-prev, .owl-next):hover { border-color: var(--s7-brand-accent) !important; color: var(--s7-brand-accent) !important; }
body.s7-framework.s7-surface-game .s7-game-supplement--download .s7-game-purchase:hover { border-color: var(--s7-brand-accent); background: var(--s7-surface-muted); color: var(--s7-brand-accent) !important; }
}
body.s7-game-hero-rounded.s7-framework.s7-surface-game .s7-game-hero { border-radius: var(--s7-game-radius); }
body.s7-game-hero-rounded.s7-framework.s7-surface-game .s7-game-shell { margin-top: 18px; border-top: 1px solid var(--s7-border); border-radius: var(--s7-game-radius); }
@media (min-width: 981px) {
body.s7-framework.s7-surface-game .s7-game-sidebar {
position: sticky;
top: calc(var(--s7-header-sticky-offset, 70px) + 18px);
}
}
@media (max-width: 980px) {
body.s7-framework.s7-surface-game .s7-game-page { --s7-game-poster-overlap: 108px; }
body.s7-framework.s7-surface-game .s7-game-shell { margin-top: 0; }
body.s7-framework.s7-surface-game .s7-game-primary {
grid-template-columns: minmax(0, 1fr) 250px;
gap: 26px;
}
body.s7-framework.s7-surface-game .s7-game-supplements { width: 100%; order: 2; }
body.s7-framework.s7-surface-game .s7-game-sidebar { margin-top: -108px; padding-inline: 8px; }
body.s7-framework.s7-surface-game .s7-game-primary-action { padding-inline: 14px !important; font-size: 14px !important; }
body.s7-framework.s7-surface-game .s7-game-hero-title {
top: calc(100% + var(--s7-game-shell-inset) - var(--s7-game-poster-overlap));
right: 278px;
bottom: auto;
left: var(--s7-game-title-inset);
}
body.s7-framework.s7-surface-game .s7-game-hero-title [data-s7-game-role="title"] { font-size: clamp(25px, 3.4vw, 32px); }
}
@media (min-width: 701px) and (max-width: 980px) {
body.s7-framework.s7-surface-game .s7-game-primary-action > i { display: none !important; }
}
@media (max-width: 700px) {
body.s7-framework.s7-surface-game .s7-game-page {
--s7-game-canvas: calc(100vw - 32px);
--s7-game-tabs-height: 50px;
--s7-game-radius: 16px;
--s7-game-hero-gap: 12px;
--s7-game-shell-inset: 18px;
--s7-game-title-inset: calc(var(--s7-game-shell-inset) + 13px);
}
body.s7-framework.s7-surface-game .s7-game-hero { min-height: 240px; }
body.s7-framework.s7-surface-game .s7-game-hero-title {
top: auto;
right: var(--s7-game-title-inset);
bottom: var(--s7-game-title-inset);
left: var(--s7-game-title-inset);
padding: 15px;
-webkit-backdrop-filter: blur(22px) saturate(1.12);
backdrop-filter: blur(22px) saturate(1.12);
}
body.s7-framework.s7-surface-game .s7-game-hero-title [data-s7-game-role="title"] { max-width: none; font-size: clamp(23px, 7vw, 32px); white-space: normal; }
body.s7-framework.s7-surface-game .s7-game-shell {
margin-top: 0;
padding: var(--s7-game-shell-inset);
}
body.s7-framework.s7-surface-game .s7-game-primary { display: flex; flex-direction: column; }
body.s7-framework.s7-surface-game .s7-game-sidebar {
display: grid;
width: 100%;
grid-template-columns: 132px minmax(0, 1fr);
align-items: start;
gap: 14px;
margin-top: 0;
padding-inline: 0;
order: 0;
}
body.s7-framework.s7-surface-game .s7-game-poster-slot { grid-column: 1; grid-row: 1; }
body.s7-framework.s7-surface-game .s7-game-action-island { grid-column: 2; grid-row: 1; }
body.s7-framework.s7-surface-game .s7-game-action-island {
gap: 7px;
margin: 0 0 2px;
padding: 0;
}
body.s7-framework.s7-surface-game .s7-game-main { width: 100%; padding-top: 20px; order: 1; }
body.s7-framework.s7-surface-game .s7-game-tabs {
top: var(--s7-header-sticky-offset, 58px);
margin-inline: 0;
gap: 24px;
padding: 10px 12px 0;
}
body.s7-framework.s7-surface-game .s7-game-tabs::after { left: 12px; }
body.s7-framework.s7-surface-game .s7-game-tabs__tab { min-height: var(--s7-touch-min); font-size: 13px; }
body.s7-framework.s7-surface-game .s7-game-panels > [role="tabpanel"] { padding: 16px 12px 8px; }
body.s7-framework.s7-surface-game [data-s7-game-panel="about"] .s7-game-facts {
grid-template-columns: repeat(auto-fit, minmax(min(160px, 100%), 1fr));
gap: 14px 20px;
}
body.s7-framework.s7-surface-game .s7-game-facts__row--genre,
body.s7-framework.s7-surface-game .s7-game-facts__row--languages { grid-column: 1 / -1; }
body.s7-framework.s7-surface-game .s7-game-facts dd.s7-game-languages__body { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; }
body.s7-framework.s7-surface-game .s7-game-languages__overview,
body.s7-framework.s7-surface-game .s7-game-languages__disclosure > summary,
body.s7-framework.s7-surface-game .s7-game-languages__table-wrap { min-width: 0; max-width: 100%; grid-column: 1; }
body.s7-framework.s7-surface-game .s7-game-languages__overview,
body.s7-framework.s7-surface-game .s7-game-languages__table-wrap { width: 100%; }
body.s7-framework.s7-surface-game .s7-game-languages__overview { flex-basis: auto; }
body.s7-framework.s7-surface-game .s7-game-languages__value { white-space: normal; }
body.s7-framework.s7-surface-game .s7-game-languages table { min-width: 460px; }
body.s7-framework.s7-surface-game .s7-game-requirements { grid-template-columns: minmax(0, 1fr); }
body.s7-framework.s7-surface-game .s7-game-streams { grid-template-columns: minmax(0, 1fr); }
body.s7-framework.s7-surface-game .s7-game-native-streams > .l-section-h > .g-cols { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 460px) {
body.s7-framework.s7-surface-game .s7-game-sidebar { grid-template-columns: 116px minmax(0, 1fr); gap: 10px; }
body.s7-framework.s7-surface-game .s7-game-action-island { padding: 0; }
body.s7-framework.s7-surface-game .s7-game-primary-action > i { display: none !important; }
body.s7-framework.s7-surface-game .s7-game-action-island .w-iconbox { padding-top: 8px; font-size: 12px; }
}
@media print {
body.s7-framework.s7-surface-game .s7-game-tabs { display: none; }
body.s7-framework.s7-surface-game .s7-game-shell { display: block; margin-top: 0; }
body.s7-framework.s7-surface-game .s7-game-primary { display: block; }
body.s7-framework.s7-surface-game .s7-game-sidebar { float: right; width: 28%; margin-left: 24px; }
body.s7-framework.s7-surface-game .s7-game-main { padding-top: 0; }
body.s7-framework.s7-surface-game .s7-game-tabs-ready [role="tabpanel"][hidden] { display: block !important; }
}
@media (prefers-reduced-transparency: reduce) {
body.s7-framework.s7-surface-game .s7-game-hero-title { background: var(--s7-game-title-glass-opaque); -webkit-backdrop-filter: none; backdrop-filter: none; }
}
@media (prefers-reduced-motion: reduce) {
body.s7-framework.s7-surface-game .s7-game-tabs__tab,
body.s7-framework.s7-surface-game .s7-game-tabs__tab::after,
body.s7-framework.s7-surface-game .s7-game-facts__genre,
body.s7-framework.s7-surface-game .s7-game-languages__disclosure > summary,
body.s7-framework.s7-surface-game .s7-game-purchase,
body.s7-framework.s7-surface-game .s7-game-download-button,
body.s7-framework.s7-surface-game .s7-game-download-button::after { transition-duration: .01ms; }
body.s7-framework.s7-surface-game .s7-game-hero > .l-section-img { transform: none; }
}