/* Styling for page content carried over word for word from the live site (public-*, s27-*, guide-*, ui29-* markup).
   Layout and look only. The words are not ours to change here, least of all on legal pages. */
.sc-legacy{display:grid;gap:var(--sc-5);min-width:0}
.sc-legacy>*{min-width:0}
.sc-legacy img{max-width:100%;height:auto;border-radius:var(--sc-r-md)}
.sc-legacy :is(.public-breadcrumb,.s27-crumbs){display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:var(--sc-fs-13);color:var(--sc-ink-3)}
.sc-legacy :is(.public-breadcrumb,.s27-crumbs) a{color:var(--sc-ink-2);font-weight:700;text-decoration:none}
.sc-legacy :is(.public-breadcrumb,.s27-crumbs) a:hover{text-decoration:underline}
.sc-legacy h1{font:900 clamp(30px,2.2vw + 20px,48px)/1.02 var(--sc-display);letter-spacing:.2px;text-transform:uppercase;color:var(--sc-navy-900);text-wrap:balance}
.sc-legacy h1 small{display:block;margin-top:6px;font:800 var(--sc-fs-18)/1.3 var(--sc-body);letter-spacing:0;text-transform:none;color:var(--sc-ink-2)}
.sc-legacy :is(h2,.s27-h2){font:800 var(--sc-fs-22)/1.25 var(--sc-body);color:var(--sc-navy-900);scroll-margin-top:var(--sc-4)}
.sc-legacy h3{font:800 var(--sc-fs-18)/1.3 var(--sc-body);color:var(--sc-ink)}
.sc-legacy :is(.eyebrow,.guide-kicker){display:block;font:800 var(--sc-fs-13)/1.2 var(--sc-body);color:var(--sc-orange-700);letter-spacing:.2px}
.sc-legacy>.s27-sub:first-child,.sc-legacy main>.s27-sub:first-child{font:800 var(--sc-fs-13)/1.2 var(--sc-body);color:var(--sc-orange-700)}
.sc-legacy :is(.public-lead,.s27-lead,.guide-index-header>p){max-width:68ch;font-size:clamp(16px,.4vw + 14.5px,19px);line-height:1.5;color:var(--sc-ink-2)}
.sc-legacy :is(.public-updated,.s27-note){font-size:var(--sc-fs-13);color:var(--sc-ink-3)}
.sc-legacy :is(.public-hero,.guide-index-header,.s27-hero-body){display:grid;gap:var(--sc-2);justify-items:start}
/* columns: text plus a contents box */
.sc-legacy .public-columns{display:grid;gap:var(--sc-6);align-items:start}
.sc-legacy .public-columns>*{min-width:0}
@media(min-width:1024px){.sc-legacy .public-columns:has(>.public-toc){grid-template-columns:minmax(0,1fr) 300px}.sc-legacy .public-columns>.public-toc{grid-column:2;grid-row:1;position:sticky;top:var(--sc-4)}.sc-legacy .public-columns>:not(.public-toc){grid-column:1}}
.sc-legacy .public-toc{display:grid;gap:var(--sc-2);padding:var(--sc-4);background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md);font-size:var(--sc-fs-14)}
.sc-legacy .public-toc :is(ul,ol){margin:0;padding:0;list-style:none;display:grid;gap:2px}
.sc-legacy .public-toc a{display:block;padding:5px 0;font-weight:700;text-decoration:none}
.sc-legacy .public-toc a:hover{text-decoration:underline}
.sc-legacy .public-toc :is(strong,h2,b){font:900 15px/1 var(--sc-display);letter-spacing:.9px;text-transform:uppercase;color:var(--sc-navy-900)}
.sc-legacy .r4-toc-toggle{display:none}
/* running text */
.sc-legacy :is(.public-prose,.s27-prose,.guide-reading,.s27-card,.public-section){font-size:17px;line-height:1.65;color:var(--sc-ink)}
.sc-legacy :is(.public-prose,.s27-prose,.guide-reading)>*,.sc-legacy :is(.public-prose,.s27-prose,.guide-reading) section>*{max-width:72ch}
.sc-legacy :is(.public-prose,.s27-prose,.guide-reading,.s27-card,.s27-section,.public-section) :is(p,ul,ol,dl,figure,table,h3)+:is(p,ul,ol,dl,figure,table,div,a){margin-top:var(--sc-4)}
.sc-legacy :is(.public-prose,.s27-prose,.guide-reading,.s27-section) :is(h2,.s27-h2){margin-top:var(--sc-6)}
.sc-legacy :is(.public-prose,.s27-prose,.guide-reading,.s27-section,.s27-card) :is(h2,h3,.s27-h2)+*{margin-top:var(--sc-2)}
.sc-legacy :is(.public-prose,.s27-prose,.guide-reading) section:first-child>h2:first-child,.sc-legacy .s27-card>:first-child{margin-top:0}
.sc-legacy :is(.public-prose,.s27-prose,.guide-reading,.s27-card,.s27-section) :is(ul,ol):not([class]),.sc-legacy .s27-list{padding-left:1.25em;list-style:revert}
.sc-legacy :is(.public-prose,.s27-prose,.guide-reading,.s27-card,.s27-section) li+li{margin-top:var(--sc-2)}
.sc-legacy section+section{margin-top:var(--sc-5)}
.sc-legacy table{width:100%;border-collapse:collapse;font-size:var(--sc-fs-14)}
.sc-legacy :is(th,td){text-align:left;padding:var(--sc-2) var(--sc-3);border-bottom:1px solid var(--sc-line-2);vertical-align:top}
.sc-legacy figcaption{font-size:var(--sc-fs-13);color:var(--sc-ink-3);margin-top:6px}
.sc-legacy--legal .public-prose{padding:var(--sc-5);background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md)}
@media(min-width:700px){.sc-legacy--legal .public-prose{padding:var(--sc-6)}}
/* buttons and tags */
.sc-legacy :is(.button,.s27-btn){display:inline-flex;align-items:center;justify-content:center;gap:var(--sc-2);min-height:44px;padding:0 var(--sc-4);border:1px solid var(--sc-navy-700);border-radius:var(--sc-r-md);background:#fff;color:var(--sc-navy-700)!important;font:800 var(--sc-fs-14)/1 var(--sc-body);text-decoration:none;white-space:nowrap}
.sc-legacy :is(.button,.s27-btn):hover{background:var(--sc-navy-100)}
.sc-legacy :is(.button-orange,.s27-btn-primary){background:var(--sc-orange-600);border-color:var(--sc-orange-600);color:#fff!important}
.sc-legacy :is(.button-orange,.s27-btn-primary):hover{background:var(--sc-orange-700)}
.sc-legacy :is(.button-dark,.s27-btn-navy){background:var(--sc-navy-700);color:#fff!important}
.sc-legacy :is(.button-dark,.s27-btn-navy):hover{background:var(--sc-navy-900)}
.sc-legacy :is(.s27-ctas,.ui29-actions){display:flex;flex-wrap:wrap;gap:var(--sc-2);align-items:center}
.sc-legacy :is(.public-facts,.s27-kicker,.s27-facts,.ui29-meta){display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.sc-legacy :is(.public-facts>span,.s27-tag,.s27-facts>li,.ui29-badge){display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border-radius:var(--sc-r-sm);background:var(--sc-navy-100);color:var(--sc-navy-800);font-size:12px;font-weight:700;white-space:nowrap}
.sc-legacy .s27-tag.is-hot{background:var(--sc-orange-600);color:#fff}
.sc-legacy .s27-tag.is-age{background:var(--sc-ink);color:#fff}
.sc-legacy kbd{font:400 .88em/1.4 "IBM Plex Mono",ui-monospace,Menlo,monospace;background:var(--sc-surface-2);border:1px solid var(--sc-line);border-radius:var(--sc-r-sm);padding:1px 6px;white-space:nowrap}
.sc-legacy .public-controls{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:0 var(--sc-5);max-width:none}
.sc-legacy .public-controls>div{display:flex;justify-content:space-between;gap:var(--sc-3);padding:var(--sc-2) 0;border-bottom:1px solid var(--sc-line-2);font-size:var(--sc-fs-14)}
.sc-legacy .public-controls dd{color:var(--sc-ink-2);text-align:right}
/* heroes with a picture */
.sc-legacy :is(.public-game-hero,.s27-hero){display:grid;gap:var(--sc-5);align-items:center}
.sc-legacy .s27-hero>.s27-wrap{display:grid;gap:var(--sc-3)}
.sc-legacy :is(.public-game-hero>img,.s27-hero-media img){display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.sc-legacy .public-game-hero>div{display:grid;gap:var(--sc-2);justify-items:start}
@media(min-width:1024px){.sc-legacy :is(.public-game-hero,.s27-hero){grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}.sc-legacy .s27-hero>.s27-hero-media{order:2}}
.sc-legacy .sc-legacy-trailer{display:grid;gap:var(--sc-2)}
.sc-legacy .sc-legacy-trailer .sc-video{border-radius:var(--sc-r-md)}
.sc-legacy .sc-legacy-trailer .sc-video img{border-radius:0;aspect-ratio:auto;height:100%}
.sc-legacy .s27-age{display:flex;gap:var(--sc-3);align-items:flex-start;padding:var(--sc-4);border-left:4px solid var(--sc-ink);background:var(--sc-surface);border-radius:0 var(--sc-r-md) var(--sc-r-md) 0}
.sc-legacy .s27-age strong{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--sc-ink);color:#fff;font-weight:900}
/* boxes and grids */
.sc-legacy :is(.s27-card,.s27-tile,.guide-story,.ui29-card,.browser-choice,.s27-ac-strip,.guide-creator-note){background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md);box-shadow:var(--sc-sh-1);overflow:hidden;min-width:0}
.sc-legacy :is(.s27-card,.s27-ac-strip,.guide-creator-note,.browser-choice){padding:var(--sc-5)}
.sc-legacy :is(.s27-grid2,.s27-tiles){display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:var(--sc-4)}
.sc-legacy :is(.guide-story-grid,.ui29-grid,.browser-choice-grid,.guide-index-stories){display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:var(--sc-4)}
.sc-legacy :is(.s27-tile,.guide-story,.ui29-card){display:flex;flex-direction:column;color:var(--sc-ink);text-decoration:none}
.sc-legacy :is(.s27-tile-art,.guide-story-image,.ui29-card-art){position:relative;display:block;aspect-ratio:16/9;background:var(--sc-navy-900);overflow:hidden}
.sc-legacy :is(.s27-tile-art,.guide-story-image,.ui29-card-art) img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0}
.sc-legacy .guide-story-image.is-contain img{object-fit:contain}
.sc-legacy .s27-tile-art .s27-kicker{position:absolute;left:var(--sc-2);top:var(--sc-2)}
.sc-legacy :is(.s27-tile-body,.guide-story-copy,.ui29-card-body){display:grid;gap:var(--sc-2);padding:var(--sc-4);align-content:start}
.sc-legacy :is(.s27-tile-body,.guide-story-copy,.ui29-card-body) :is(h2,h3){font:800 var(--sc-fs-18)/1.25 var(--sc-body);margin:0}
.sc-legacy :is(.s27-tile-body,.guide-story-copy,.ui29-card-body) :is(h2,h3) a{color:var(--sc-ink);text-decoration:none}
.sc-legacy :is(.s27-tile-body,.guide-story-copy,.ui29-card-body) p{font-size:var(--sc-fs-14);line-height:1.45;color:var(--sc-ink-2)}
.sc-legacy .guide-featured{grid-column:1/-1}
@media(min-width:760px){.sc-legacy .guide-featured{flex-direction:row}.sc-legacy .guide-featured .guide-story-image{flex:0 0 52%;aspect-ratio:auto;min-height:260px}.sc-legacy .guide-featured .guide-story-copy{align-content:center;padding:var(--sc-5)}}
.sc-legacy :is(.a8-shots,.s27-shots,.s27-gallery,.public-creator-gallery){display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:var(--sc-3);margin:0;padding:0;list-style:none;max-width:none}
.sc-legacy :is(.s27-gallery,.public-creator-gallery) :is(figure,a){margin:0;display:grid;gap:6px;font-weight:700;text-decoration:none;color:var(--sc-ink)}
.sc-legacy .public-creator-gallery small{display:block;font-weight:400;color:var(--sc-ink-3)}
.sc-legacy :is(.a8-shots,.s27-shots,.s27-gallery,.public-creator-gallery) img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.sc-legacy .guide-section-heading{margin-top:var(--sc-5)}
/* r10b: article + "On this page" box (Steam guides, anti-cheat). Was a row of pills under the article ending in a blank white pill
   (the Wishlist button lost its colour to the pill rule). A sticky side box from 1024 px, a plain box under the article below. */
.sc-legacy .s27-guide{display:grid;gap:var(--sc-5);align-items:start}
.sc-legacy .s27-guide>*{min-width:0}
@media(min-width:1024px){.sc-legacy .s27-guide{grid-template-columns:minmax(0,1fr) 280px;gap:var(--sc-6)}.sc-legacy .s27-guide>.s27-toc{position:sticky;top:var(--sc-4)}}
.sc-legacy .s27-toc{display:grid;gap:2px;padding:var(--sc-4);background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md);box-shadow:var(--sc-sh-1);font-size:var(--sc-fs-14)}
.sc-legacy .s27-toc>strong{margin:0 0 4px;font:800 var(--sc-fs-13)/1.2 var(--sc-body);color:var(--sc-navy-900)}
.sc-legacy .s27-toc>a:not(.s27-btn){display:block;padding:5px 0 5px 10px;border-left:2px solid var(--sc-line);color:var(--sc-ink-2);font-weight:700;text-decoration:none;line-height:1.35}
.sc-legacy .s27-toc>a:not(.s27-btn):hover,.sc-legacy .s27-toc>a[aria-current="page"]{border-left-color:var(--sc-orange-600);color:var(--sc-navy-900)}
.sc-legacy .s27-toc hr{width:100%;margin:var(--sc-2) 0;border:0;border-top:1px solid var(--sc-line-2)}
.sc-legacy .s27-toc>.s27-btn{width:100%;margin-top:var(--sc-1)}
.sc-legacy .s27-hero:not(:has(.s27-hero-media)){grid-template-columns:1fr}
.sc-legacy :is(.s27-mail,.s27-addr){font-weight:700}
/* creator profile */
.sc-legacy .ui29-profile{display:flex;flex-wrap:wrap;gap:var(--sc-4);align-items:center;padding:var(--sc-5);background:var(--sc-navy-900);color:#fff;border-radius:var(--sc-r-lg)}
.sc-legacy .ui29-profile :is(h1,.ui29-name){color:#fff}
.sc-legacy .ui29-profile :is(p,.ui29-bio,.ui29-joined,.ui29-id){color:var(--sc-navy-100)}
.sc-legacy .ui29-avatar{flex:none;display:grid;place-items:center;width:88px;height:88px;border-radius:50%;background:var(--sc-orange-600);color:#fff;overflow:hidden}
.sc-legacy .ui29-stats{display:flex;gap:var(--sc-5);margin:0;padding:0;list-style:none}
.sc-legacy .ui29-count{font:900 28px/1 var(--sc-display)}
.sc-legacy .ui29-band{display:grid;gap:var(--sc-3)}
.sc-legacy-add{margin-top:var(--sc-5)}
.sc-legacy .sc-quote p{font-size:var(--sc-fs-18);line-height:1.5;color:var(--sc-ink)}
.sc-legacy :is(.s27-modes,.s27-streaks,.s27-loadouts){display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:var(--sc-3)}
.sc-legacy :is(.s27-mode,.s27-streak){padding:var(--sc-4);background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md);display:grid;gap:var(--sc-1);align-content:start}
.sc-legacy .s27-meta{font-size:var(--sc-fs-13);font-weight:800;color:var(--sc-orange-700)}
.sc-legacy .s27-sub{color:var(--sc-ink-2)}
.sc-legacy .s27-section>.s27-wrap{display:grid;gap:var(--sc-3)}
.sc-legacy span.guide-reading{font-size:var(--sc-fs-13);line-height:1.3;color:var(--sc-ink-3)}
.sc-legacy figure{margin:0}
.sc-legacy caption{text-align:left;font-weight:800;padding-bottom:var(--sc-2)}
.sc-legacy div:has(>.s27-mode){display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:var(--sc-3)}
.sc-legacy .s27-guide-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--sc-3)}
.sc-legacy .s27-guide-links a{display:grid;gap:2px;padding:var(--sc-4);background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md);text-decoration:none;color:var(--sc-ink-2);font-size:var(--sc-fs-14)}
.sc-legacy .s27-guide-links a :is(b,strong){color:var(--sc-navy-700);font-size:var(--sc-fs-16)}

/* Miniclip pass: the developer guide (words unchanged). Each section is a white box with the navy bar; two columns on wide screens */
.sc-legacy--slopclips .s27-section{break-inside:avoid;margin:0 0 18px;padding:0 18px 16px;background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md);box-shadow:var(--sc-sh-1)}
.sc-legacy--slopclips .s27-section>h2:first-child{margin:-1px -19px 14px;padding:11px 18px;background:var(--sc-navy-800);color:#fff;font:800 var(--sc-fs-18)/1.2 var(--sc-body);text-transform:none;letter-spacing:0;border-radius:var(--sc-r-md) var(--sc-r-md) 0 0}
.sc-legacy--slopclips .s27-section h3{margin-top:12px}
.sc-legacy--slopclips .s27-section table{width:100%}
.sc-legacy--slopclips>p:not(.s27-sub),.sc-legacy--slopclips>h1+p{margin-bottom:18px}
.sc-legacy.sc-legacy--slopclips{display:block}
@media(min-width:1200px){.sc-legacy--slopclips{column-count:2;column-gap:18px}.sc-legacy--slopclips>:not(section){column-span:all}}
.sc-legacy--slopclips>h1{margin:6px 0 8px}
.sc-legacy--slopclips>h1+.s27-sub{margin-bottom:14px}
/* r10b: the small link row under About and Support (links that left the footer) */
.sc-legacy .sc-morelinks{padding:var(--sc-4) var(--sc-5);background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md);box-shadow:var(--sc-sh-1)}
.sc-legacy .sc-morelinks-h{margin:0 0 var(--sc-2);font:800 var(--sc-fs-16)/1.2 var(--sc-body);color:var(--sc-navy-900)}
.sc-legacy .sc-morelinks ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:var(--sc-2) var(--sc-5);margin:0;padding:0;list-style:none}
.sc-legacy .sc-morelinks li{display:grid;gap:2px;font-size:var(--sc-fs-14);line-height:1.4;color:var(--sc-ink-2)}
.sc-legacy .sc-morelinks a{font-weight:800;color:var(--sc-navy-700);text-decoration:none}
.sc-legacy .sc-morelinks a:hover{color:var(--sc-orange-700);text-decoration:underline}
/* r10b: the long-form guide pages (guide-document markup, 11 guides). Their old stylesheet stayed behind when they moved
   into the new shell, so the contents list, the play card and Read next fell apart into one raw column. Words unchanged. */
.sc-legacy--guides .guide-document{display:grid;gap:var(--sc-5);min-width:0}
.sc-legacy--guides .guide-hero{display:grid;gap:var(--sc-4);align-items:center;padding:var(--sc-4);background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md);box-shadow:var(--sc-sh-1)}
@media(min-width:1000px){.sc-legacy--guides .guide-hero{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:var(--sc-6);padding:var(--sc-5)}}
.sc-legacy--guides .guide-heading{display:grid;gap:var(--sc-2);justify-items:start;min-width:0}
.sc-legacy--guides .guide-heading h1{font-size:clamp(28px,1.6vw + 20px,42px)}
.sc-legacy--guides .guide-dek{max-width:60ch;font-size:clamp(16px,.3vw + 14.5px,18px);line-height:1.5;color:var(--sc-ink-2)}
.sc-legacy--guides .guide-byline{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:var(--sc-fs-13);color:var(--sc-ink-3)}
.sc-legacy--guides .guide-hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sc-2) var(--sc-4);margin-top:var(--sc-2)}
.sc-legacy--guides .guide-hero-link{font-weight:800;font-size:var(--sc-fs-14)}
.sc-legacy--guides .guide-cover{margin:0;min-width:0}
.sc-legacy--guides .guide-cover img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--sc-surface-2)}
.sc-legacy--guides .guide-cover figcaption{margin-top:6px}
/* contents rail | body | play card; the rail folds into the "In this guide" drawer below 1200 px, the card drops under the body below 900 px */
.sc-legacy--guides .guide-layout{display:grid;gap:var(--sc-5);align-items:start;min-width:0}
.sc-legacy--guides .guide-layout>*{min-width:0}
.sc-legacy--guides .guide-rail,.sc-legacy--guides .guide-play-link{display:none}
@media(min-width:900px){.sc-legacy--guides .guide-layout{grid-template-columns:minmax(0,1fr) 300px;gap:var(--sc-6)}.sc-legacy--guides .guide-side{position:sticky;top:var(--sc-4)}}
@media(min-width:1200px){
  .sc-legacy--guides .guide-layout{grid-template-columns:190px minmax(0,1fr) 300px}
  .sc-legacy--guides .guide-rail{display:block;position:sticky;top:var(--sc-4);font-size:var(--sc-fs-14)}
  .sc-legacy--guides .guide-mobile-toc{display:none}
}
.sc-legacy--guides .guide-rail-title{margin-bottom:var(--sc-2);font:800 var(--sc-fs-13)/1.2 var(--sc-body);color:var(--sc-navy-900)}
.sc-legacy--guides .guide-rail nav>a{display:block;padding:6px 0 6px 12px;border-left:2px solid var(--sc-line);line-height:1.35;color:var(--sc-ink-2);text-decoration:none}
.sc-legacy--guides .guide-rail nav>a:hover{border-left-color:var(--sc-orange-600);color:var(--sc-navy-700)}
.sc-legacy--guides .guide-mobile-toc{padding:var(--sc-3) var(--sc-4);background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md);font-size:var(--sc-fs-14)}
.sc-legacy--guides .guide-mobile-toc summary{cursor:pointer;font-weight:800;color:var(--sc-navy-900)}
.sc-legacy--guides .guide-mobile-toc nav{display:grid;gap:2px;margin-top:var(--sc-2)}
.sc-legacy--guides .guide-mobile-toc nav a{padding:5px 0;font-weight:700;text-decoration:none}
.sc-legacy--guides .guide-body{font-size:17px;line-height:1.7;color:var(--sc-ink)}
.sc-legacy--guides .guide-body>section{margin-top:var(--sc-6);scroll-margin-top:var(--sc-4)}
.sc-legacy--guides .guide-body>:first-child{margin-top:0}
.sc-legacy--guides .guide-body>.guide-mobile-toc+*{margin-top:var(--sc-4)}
.sc-legacy--guides .guide-body h2{margin-bottom:var(--sc-2)}
.sc-legacy--guides .guide-body :is(p,ul,ol)+:is(p,ul,ol,div,figure){margin-top:var(--sc-3)}
.sc-legacy--guides .guide-body :is(ul,ol):not([class]){padding-left:1.25em;list-style:revert}
.sc-legacy--guides .guide-body .guide-cover{margin:var(--sc-4) 0}
.sc-legacy--guides .guide-short-answer{display:grid;gap:4px;padding:var(--sc-4);background:var(--sc-surface);border:1px solid var(--sc-line);border-left:4px solid var(--sc-orange-600);border-radius:0 var(--sc-r-md) var(--sc-r-md) 0}
.sc-legacy--guides .guide-short-answer>strong{font:800 var(--sc-fs-13)/1.2 var(--sc-body);color:var(--sc-orange-700)}
.sc-legacy--guides .seo-table-wrap{margin-top:var(--sc-4);overflow-x:auto;background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md)}
.sc-legacy--guides .seo-table-wrap caption{padding:var(--sc-2) var(--sc-3);text-align:left;font-weight:800;font-size:var(--sc-fs-13);color:var(--sc-navy-900);background:var(--sc-surface-2)}
.sc-legacy--guides .seo-table-wrap thead th{background:var(--sc-navy-800);color:#fff;font-size:var(--sc-fs-13)}
.sc-legacy--guides .guide-references{font-size:var(--sc-fs-14)}
.sc-legacy--guides .guide-end{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sc-3) var(--sc-4);margin-top:var(--sc-6);padding:var(--sc-4);background:var(--sc-navy-800);border-radius:var(--sc-r-md);color:#fff}
.sc-legacy--guides .guide-end p{flex:1 1 240px;margin:0;font-weight:800;font-size:var(--sc-fs-18);color:#fff}
.sc .sc-legacy--guides .guide-end a:not(.button){color:#dbe4f3;font-weight:700;font-size:var(--sc-fs-14)}
/* play card: a Miniclip box */
.sc-legacy--guides .guide-play-card{background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md);box-shadow:var(--sc-sh-1);overflow:hidden}
.sc-legacy--guides .guide-play-art{display:block;background:var(--sc-surface-2)}
.sc-legacy--guides .guide-play-art img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:0}
.sc-legacy--guides .guide-play-mosaic{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--sc-navy-900)}
.sc-legacy--guides .guide-play-mosaic img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:0}
.sc-legacy--guides .guide-play-copy{display:flex;flex-direction:column;gap:6px;padding:var(--sc-4)}
.sc-legacy--guides .guide-play-kicker{font:800 var(--sc-fs-13)/1.2 var(--sc-body);color:var(--sc-orange-700)}
.sc-legacy--guides .guide-play-copy>strong{font:900 24px/1.05 var(--sc-display);text-transform:uppercase;color:var(--sc-navy-900)}
.sc-legacy--guides .guide-play-copy>p:not([class]){font-size:var(--sc-fs-14);color:var(--sc-ink-2)}
.sc-legacy--guides .guide-play-facts{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 4px;padding:0;list-style:none}
.sc-legacy--guides .guide-play-facts li{min-height:22px;padding:2px 8px;border-radius:var(--sc-r-sm);background:var(--sc-navy-100);color:var(--sc-navy-800);font-size:12px;font-weight:700}
.sc-legacy--guides .guide-keys-title{margin-top:4px;font-weight:800;font-size:var(--sc-fs-13);color:var(--sc-navy-900)}
.sc-legacy--guides .guide-keys{display:grid;gap:4px;margin:0 0 var(--sc-2)}
.sc-legacy--guides .guide-keys>div{display:flex;align-items:center;justify-content:space-between;gap:var(--sc-2);font-size:var(--sc-fs-13)}
.sc-legacy--guides .guide-keys dd{margin:0;color:var(--sc-ink-2);text-align:right}
.sc-legacy--guides .guide-play-copy .button{width:100%}
.sc-legacy--guides .guide-play-more{text-align:center;font-weight:700;font-size:var(--sc-fs-13)}
/* Read next: three cards, picture on top */
.sc-legacy--guides .seo-read-next{display:grid;gap:var(--sc-3)}
.sc-legacy--guides .seo-next-grid{display:grid;gap:var(--sc-3)}
@media(min-width:700px){.sc-legacy--guides .seo-next-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}}
.sc-legacy--guides .seo-next-grid a{display:flex;flex-direction:column;gap:4px;padding:0 0 var(--sc-3);background:var(--sc-surface);border:1px solid var(--sc-line);border-radius:var(--sc-r-md);box-shadow:var(--sc-sh-1);overflow:hidden;color:var(--sc-ink);text-decoration:none}
.sc-legacy--guides .seo-next-grid img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:0;margin-bottom:6px;background:var(--sc-surface-2)}
.sc-legacy--guides .seo-next-grid a>:not(img){padding:0 var(--sc-3)}
.sc-legacy--guides .seo-next-kicker{font:800 var(--sc-fs-13)/1.2 var(--sc-body);color:var(--sc-orange-700)}
.sc-legacy--guides .seo-next-grid strong{font:800 var(--sc-fs-16)/1.25 var(--sc-body);color:var(--sc-navy-900)}
.sc-legacy--guides .seo-next-cta{margin-top:auto;font-weight:700;font-size:var(--sc-fs-13);color:var(--sc-navy-700)}
.sc-legacy--guides .seo-next-grid a:hover strong{color:var(--sc-orange-700);text-decoration:underline}
@media(max-width:699px){.sc-legacy--guides .seo-next-grid a{display:grid;grid-template-columns:120px minmax(0,1fr);grid-template-rows:auto auto 1fr;column-gap:var(--sc-3);padding:var(--sc-2)}.sc-legacy--guides .seo-next-grid img{grid-row:1/4;margin:0;border-radius:var(--sc-r-sm)}.sc-legacy--guides .seo-next-grid a>:not(img){padding:0}.sc-legacy--guides .seo-next-cta{display:none}}
.sc-legacy--guides .seo-next-grid a:not(:has(img)){padding-top:var(--sc-3);border-top:4px solid var(--sc-orange-600)}
@media(max-width:699px){.sc-legacy--guides .seo-next-grid a:not(:has(img)){display:flex}}