/* Round 2 design layer. Loaded last on every page by scripts/apply_chrome.py. See CHANGES-redesign-r2.md. */
:root{--container:1180px;--gut:32px}

/* One container: header, content and footer share a left edge. */
.wrap,.site-header>.wrap,.launch-main .wrap,.game-product .wrap,.games-directory .wrap,.launch-page-head.wrap,.info-page>.launch-section>.wrap,.legal-document .pagehead .wrap,.site-footer>.wrap{width:min(var(--container),calc(100% - 2*var(--gut)));max-width:none;margin-inline:auto;padding-inline:0}
.info-content,.legal-document .info-content{width:min(var(--container),calc(100% - 2*var(--gut)));max-width:none;margin-inline:auto;padding:12px 0 64px}
.info-content>*{max-width:760px}
.product-faq{max-width:none}.product-faq>*{max-width:860px}

/* Type: tracking, and the size scale 12/14/16/20/24/32/52. */
h1,h2,h3,h4,.launch-main h1,.launch-main h2,.launch-main h3,.game-product h1,.game-product h2,.game-product h3,.world-section .world-plan h3,.directory-heading h1,.directory-card h2,.preview-main .preview-title{letter-spacing:-.01em}
p,li,dd,h1,h2,h3,a{overflow-wrap:break-word}
small{font-size:.75rem}code{font-size:.875em}
.game-product h2{font-size:2rem}.product-plan strong{font-size:1.5rem}.product-plan small,.product-status,.directory-card .product-status{font-size:.75rem}
.product-guides a,.product-faq details p,.directory-controls label,.directory-card p{font-size:.875rem}.directory-card h2{font-size:1.25rem}.game-menu__status{font-size:.75rem}.site-header .game-menu__footer a{font-size:.875rem}
.game-menu__status{color:#b3afc9}.game-menu__status.is-launching{color:#dcc391}

/* Heading and body rhythm. */
main h2{margin:0 0 16px}main h2+p,main h2+ul,main h2+dl,main h2+table,main h2+form{margin-top:0}main h3{margin:24px 0 8px}
.launch-section .wrap>p{margin:0 0 16px}.launch-section .wrap>p:last-child{margin-bottom:0}
.launch-section .wrap>a:not(.btn){display:inline-block;margin-top:8px}
main p+.btn,main p+.core-actions,main ul+.btn,main p+.inline-links,main ul+.inline-links{margin-top:20px}
.core-actions{margin:20px 0 0}.inline-links{display:flex;flex-wrap:wrap;gap:8px 24px;font-size:.875rem}
.wrap>details+h2{margin-top:40px}

/* One accent, one card colour, one secondary button. */
.btn,.btn--primary,.launch-main .btn,.site-header .nav-cta,.game-product .btn,.world-section .world-plan .btn{background:#6C5CE7;border-color:transparent}
.btn:hover,.launch-main .btn:hover,.game-product .btn:hover{background:#5a4ad6}
.btn--secondary,.launch-main .btn--secondary{background:transparent;border:1px solid var(--line-2);color:var(--text)}
.btn--secondary:hover,.launch-main .btn--secondary:hover{background:#ffffff0d}
.world-section .world-plan,.world-section .world-plan:nth-child(2),.world-section .world-plan-modded,.world-section .world-plan-custom,.launch-plan:nth-child(3){background:var(--bg);border-color:var(--line-2);box-shadow:none}
.world-section .world-plan .btn--closed{background:#ffffff07!important;width:100%}
.world-plan h3 span{white-space:nowrap}

/* Header row: same height for links and buttons. */
.site-header .nav__list>li>a,.site-header .nav-dropdown__toggle{display:inline-flex;align-items:center;min-height:40px;padding:0 10px;line-height:1}
.site-header .nav-account{min-height:40px}
.site-header a.nav-account:hover{color:var(--text);text-decoration:none}
.locale-menu a[aria-current="true"]{font-weight:600;color:var(--text)}

/* Home hero: the product shot is the visual. */
.launch-hero{padding:48px 0 56px}
.hero-copy{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:end;margin-bottom:32px}
.hero-copy h1{margin:8px 0 0}.hero-copy__body p{margin:0}.hero-copy__body .core-actions{margin:16px 0}
.hero-copy__body>p:last-child{font-size:.875rem;color:var(--muted)}
.panel-shot,.launch-hero .panel-shot{margin:0;border:1px solid var(--line-2);border-radius:8px;overflow:hidden;background:#100e25}
.panel-shot img{display:block;width:100%;height:auto}
.panel-shot figcaption{padding:10px 16px;border-top:1px solid var(--line);font-size:.75rem;color:var(--muted)}
.launch-section .panel-shot{margin:24px 0 0}

/* Game cards at the art's native 16:10, never wider than 320px source. */
.catalog-grid,.catalog-grid:has(>.catalog-card:nth-child(16)){grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.catalog-card{display:flex;flex-direction:column;align-items:stretch;padding:0 0 16px;text-align:left}
.catalog-card img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;margin:0 0 12px}
.catalog-card h3,.launch-main .catalog-card h3{margin:0 16px 4px;font-size:1rem!important;line-height:1.3}
.catalog-card .catalog-status{margin:0 16px 8px}.catalog-card>span:last-child{margin:auto 16px 0;font-size:.875rem}
.product-hero__grid{grid-template-columns:minmax(0,1fr) 320px}
.product-art{max-width:320px}
.directory-card img{max-width:100%}
.product-status{color:#dcc391}

/* Game pages. */
.product-plans{grid-template-columns:repeat(6,minmax(0,1fr))}.product-plan{text-align:left;padding:16px}
.product-setup{grid-template-columns:minmax(0,1fr);gap:16px}.product-setup dl{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;row-gap:20px}
.product-setup dl>div,.product-setup dl>div:last-child{padding:0 0 20px;border-bottom:1px solid #39354f}

/* Pricing: rows are plans, columns are the facts that differ. */
.plan-table{width:100%;border-collapse:collapse;font-size:.875rem;margin:8px 0 0}
.plan-table th,.plan-table td{padding:14px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.plan-table thead th{color:var(--lilac);font-weight:500}
.plan-table tbody th{font-weight:600;white-space:nowrap}.plan-table tbody th a{color:var(--text)}
.plan-table .col-use{color:var(--muted)}
.plan-table th:first-child,.plan-table td:first-child{padding-left:0}
.plan-includes-h{margin:40px 0 16px}
.plan-includes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 32px;margin:0 0 20px}
.plan-includes>div{border-left:2px solid var(--accent);padding-left:16px}
.plan-includes dt{font-size:.875rem;color:var(--muted)}.plan-includes dd{margin:4px 0 0}
.plan-includes~p{font-size:.875rem;color:var(--muted);margin-bottom:8px}

/* Plan pages. */
.plan-head{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:56px;align-items:start}
.plan-head h2{font-size:1.5rem!important;margin:28px 0 8px}
.plan-summary{border:1px solid var(--line-2);border-radius:8px;background:var(--bg-2);padding:24px}
.pagehead .plan-summary p{margin:0;color:var(--text);font-size:1rem}
.pagehead .plan-summary .plan-summary__name{font:600 1.25rem/1.3 var(--font-h)}
.pagehead .plan-summary .plan-summary__use{color:var(--muted);font-size:.875rem;margin:16px 0}
.plan-summary dl{margin:12px 0 0}.plan-summary dl>div{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--line)}
.plan-summary dt{color:var(--muted);font-size:.875rem}.plan-summary dd{margin:0;font-weight:600}
.plan-summary .btn{width:100%;margin:0}.plan-summary .inline-links{margin-top:16px;justify-content:space-between}

/* Contact. */
.contact-rows{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:8px}
.contact-row{display:flex;align-items:center;gap:16px;padding:20px;border:1px solid var(--line-2);border-radius:8px;background:var(--bg-2);color:var(--text)}
.contact-row:hover{border-color:var(--lilac);text-decoration:none}
.contact-row svg{width:24px;height:24px;flex:none;color:var(--lilac)}
.contact-row__text{display:flex;flex-direction:column;min-width:0}
.contact-row__label{font-size:.875rem;color:var(--muted)}.contact-row__value{font:600 1.25rem/1.3 var(--font-h)}
.contact-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:56px;align-items:start}
.contact-layout .compose-helper{max-width:none}
.contact-aside .btn{margin-top:24px}
.compose-helper form{gap:20px}.compose-helper label{margin:0 0 6px}.compose-helper label small{margin-left:8px;color:var(--muted)}
.compose-helper p{margin:0 0 16px}.compose-helper form p{margin:8px 0 0}#form-status[hidden]{display:none}
select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23A99BFF' stroke-width='1.5'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:16px;padding-right:36px!important}

/* FAQ disclosure, same control everywhere in page content. */
main details{padding:0}
main details>summary,.product-faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;padding:12px 0;font-weight:500;line-height:1.4}
main details>summary::-webkit-details-marker{display:none}
main details>summary::after{content:"";flex:none;width:9px;height:9px;margin-right:6px;border-right:1.5px solid var(--lilac);border-bottom:1.5px solid var(--lilac);transform:rotate(45deg)}
main details[open]>summary::after{transform:rotate(-135deg)}
main details>p{margin:0 0 16px}

/* Legal, guides. */
.legal-document .pagehead{padding-bottom:12px}
.guide-card,.guide-card__title,.guide-card a{text-align:left}

@media(max-width:1100px){.catalog-grid,.catalog-grid:has(>.catalog-card:nth-child(16)){grid-template-columns:repeat(3,minmax(0,1fr))}.product-plans{grid-template-columns:repeat(3,minmax(0,1fr))}.contact-rows{grid-template-columns:1fr}.contact-layout,.plan-head{grid-template-columns:1fr;gap:32px}.plan-summary{max-width:520px}}

/* Phones and small tablets: bar stays pinned, the open menu scrolls with the page, no inner scroll box. */
@media(max-width:899px){
 :root{--gut:20px}
 .site-header,.site-header.is-scrolled{position:sticky;top:0;z-index:90}
 .nav-open .site-header{position:relative}
 .site-header .navbar,.site-header.is-scrolled .navbar{display:grid;grid-template-columns:minmax(0,1fr) auto auto;grid-template-rows:60px auto;column-gap:10px;min-height:60px;padding:0;background:none;align-items:start}
 .site-header .navbar::before{content:""!important;display:block!important;grid-column:1/-1;grid-row:1/3;position:sticky;top:0;height:60px;margin-inline:calc(-1*var(--gut));background:var(--bg);border-bottom:1px solid var(--line);z-index:1}
 .site-header .brand,.site-header .nav-cta,.site-header .nav-toggle{grid-row:1/3;position:sticky;align-self:start;z-index:2}
 .site-header .brand{grid-column:1;top:0;height:60px;min-height:60px;display:inline-flex;align-items:center;justify-self:start}
 .site-header .brand img{width:136px}
 .site-header .nav-cta{grid-column:2;top:10px;margin:10px 0 0;min-height:40px;padding:8px 14px}
 .site-header .nav-toggle{grid-column:3;top:8px;margin:8px 0 0;min-height:44px;min-width:44px}
 .site-header .nav{grid-column:1/-1;grid-row:2;order:0;position:static;padding:8px 0 16px;border:0}
 .site-header .nav__list>li>a,.site-header .nav-dropdown__toggle{display:flex;width:100%;justify-content:space-between;min-height:46px;padding:0;font-size:1rem}
 .site-header .nav-dropdown__menu.game-menu{border:0;border-radius:0;background:none;margin:0}
 .site-header .help-menu,.site-header .locale-menu{border:0;background:none;box-shadow:none;padding:0}
 .site-header .help-menu a,.site-header .locale-menu a{padding-inline:0}
 .game-menu__body{padding:0}.game-menu__footer{flex-direction:column;align-items:stretch;gap:0;padding:8px 0 0;border-top:0}
 .site-header .game-menu__footer a{display:flex;align-items:center;min-height:44px}
 .site-header .nav__right{display:flex;flex-direction:column;align-items:stretch;gap:0;width:100%}
 .site-header .nav-account{display:flex;min-height:46px;padding:0;font-size:1rem}.site-header .nav-account .nav-icon{width:18px;height:18px}
 .product-hero__grid{grid-template-columns:minmax(0,1fr)}
 .hero-copy{grid-template-columns:1fr;gap:16px;margin-bottom:24px}
 .launch-hero{padding:32px 0 40px}
 .contact-row__value{font-size:1.25rem}
}
@media(max-width:600px){
 .game-product .wrap,.games-directory .wrap{width:calc(100% - 40px)}
 .game-product h2{font-size:1.75rem}
 .catalog-grid,.catalog-grid:has(>.catalog-card:nth-child(16)){grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .catalog-card{display:flex;padding:0 0 12px}
 .catalog-card img{width:100%;height:auto;margin:0 0 10px}
 .catalog-card h3,.launch-main .catalog-card h3{margin:0 12px 4px}.catalog-card .catalog-status{margin:0 12px 6px}.catalog-card>span:last-child{margin:auto 12px 0;grid-column:auto}
 .product-plans{grid-template-columns:repeat(2,minmax(0,1fr))}
 .product-setup dl{grid-template-columns:1fr}
 .plan-table,.plan-table thead,.plan-table tbody{display:block}
 .plan-table tr{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr));column-gap:8px;padding:12px 0;border-bottom:1px solid var(--line)}
 .plan-table th,.plan-table td{padding:0;border:0}
 .plan-table thead th{font-size:.75rem;line-height:1.3}.plan-table thead .col-use{display:none}
 .plan-table tbody th{white-space:normal}
 .plan-table td.col-use{grid-column:1/-1;margin-top:6px}
 .plan-includes{grid-template-columns:1fr;gap:12px}
 .world-section .world-plan{padding:16px}
 .launch-section,.contact-content{padding:32px 0}
 .contact-row{padding:16px}
}
@media(max-width:420px){
 .directory-grid{grid-template-columns:1fr;gap:12px}
 .directory-card{display:grid;grid-template-columns:120px minmax(0,1fr);align-items:start}
 .directory-card img{height:auto;min-height:0;aspect-ratio:1.6}
 .directory-card>div{padding:10px 12px}.directory-card h2{margin:2px 0 4px}
}
@media(max-width:359px){.site-header .nav-cta{display:none}}

/* Screenshot frame belongs to the figure only. */
.launch-hero figure.panel-shot img,.panel-shot img{border:0;border-radius:0;box-shadow:none}

/* Guides on phones: long commands wrap and tables stack, so nothing scrolls inside the page. */
@media(max-width:767px){
 pre{white-space:pre-wrap;overflow-x:visible;overflow-wrap:anywhere}
 pre code{white-space:inherit;overflow-wrap:anywhere}
 .table-scroll{overflow:visible}
 .guide table,.guide tbody,.guide tr,.guide td,.guide tbody th{display:block;width:auto;min-width:0}
 .guide thead{display:none}
 .guide tr{padding:12px 0;border-bottom:1px solid var(--line)}
 .guide td,.guide tbody th{padding:3px 0;border:0;text-align:left;white-space:normal}
 .guide [data-label]::before{content:attr(data-label);display:block;font-size:.75rem;font-weight:500;color:var(--muted)}
}

/* Compact plan cards on phones: name and price on one line, button and details link on another. */
@media(max-width:600px){
 .world-section .world-plan{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:none;column-gap:12px;row-gap:6px;padding:16px;align-items:start}
 .world-section .world-plan .world-plan-heading{grid-column:1;grid-row:1;min-height:0;margin:0}
 .world-section .world-plan h3{font-size:1.25rem!important}
 .world-section .world-plan .world-price{grid-column:2;grid-row:1;border:0;padding:0;min-height:0;margin:0;font-size:1.25rem;text-align:right;justify-content:flex-end;white-space:nowrap}
 .world-section .world-plan>p:not(.launch-price):not(.launch-offer){grid-column:1;grid-row:2;margin:0;font-size:.875rem;line-height:1.4}
 .world-section .world-plan .launch-offer{grid-column:2;grid-row:2;margin:0;font-size:.75rem;text-align:right;white-space:nowrap}
 .world-section .world-plan .btn{grid-column:1;grid-row:3;min-height:44px;margin-top:6px;padding:8px;font-size:.875rem}
 .world-section .world-plan>a:not(.btn){grid-column:2;grid-row:3;margin:6px 0 0;min-height:44px;display:inline-flex;align-items:center;justify-content:flex-end;font-size:.875rem}
 .launch-plans,.world-section .launch-plans{gap:12px}
}

.table-scroll:has(.plan-table){border:0;border-radius:0;background:none;box-shadow:none}

@media(max-width:600px){
 /* The plan cards directly above carry the suggested use, so the table stays four tight columns. */
 .plan-table tr{grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));align-items:baseline}
 .plan-table .col-use,.plan-table td.col-use{display:none}
 main .plan-table a{display:inline;min-height:0;min-width:0}
 .plan-includes>div{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:8px;border-left:0;padding:8px 0;border-top:1px solid var(--line)}
 .plan-includes{gap:0}.plan-includes dd{margin:0;font-size:.875rem}
 .plan-includes-h{margin-top:32px}
}

/* Small fixes from the visual pass. */
@media(min-width:1280px){html[lang="tr"] .site-header .nav-account>span{display:inline}}
.world-section .world-plan .world-price,.launch-main .launch-price{letter-spacing:-.01em}
.world-plan h3 span,.plan-summary__name{word-spacing:.06em}
@media(max-width:899px){.game-menu__group summary{padding-inline:0}}
.offline-page{display:block;place-items:normal;min-height:0;padding:0}