/* Reference-inspired presentation; all content and destinations are retained. */
:root{--blue:#1019e8;--orange:#ff8900;--ink:#121212;--muted:#656565;--line:#dedee5;color-scheme:light}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:#fff;color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.65}img{max-width:100%;height:auto;display:block}a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--orange);outline-offset:5px}h1,h2,h3{line-height:1.25}figure{margin:0}.wrap,.page-content{width:min(1320px,calc(100% - 64px));margin-inline:auto}.skip-link{position:fixed;top:-70px;left:16px;z-index:100;background:#fff;padding:10px 20px}.skip-link:focus{top:10px}
/* White masthead above the full-width royal-blue navigation. */
header.site{background:linear-gradient(to bottom,#fff 112px,var(--blue) 112px);position:relative;z-index:10}header.site>.wrap{width:100%}.header-masthead{height:112px;max-width:1240px;width:calc(100% - 64px);margin:auto;display:flex;align-items:center;justify-content:space-between}.brand{display:inline-flex;align-items:center}.brand-logo{width:230px!important;height:auto!important;max-height:88px;object-fit:contain}.header-cta,.btn,.rf-pop-cta{display:inline-flex;align-items:center;justify-content:center;padding:10px 34px;border-radius:7px;background:var(--orange);color:#fff;font-size:18px;font-weight:700;min-height:46px}.header-cta:hover,.btn:hover,.rf-pop-cta:hover{filter:brightness(.96);text-decoration:none}.header-right{background:var(--blue);min-height:62px}.main{max-width:1240px;margin:auto;display:flex;justify-content:space-between;align-items:center;min-height:62px;gap:20px;padding:0 24px}.main>a,.nav-item>a{display:block;color:#fff;padding:18px 22px;font-size:15px;font-weight:600}.main>a:hover,.nav-item>a:hover{background:#ffffff18;text-decoration:none}.nav-item{position:relative}.submenu{display:none;position:absolute;top:100%;left:0;background:#fff;border:1px solid var(--line);box-shadow:0 10px 25px #15154b15;min-width:180px;border-radius:0 0 8px 8px;padding:8px}.submenu a{display:block;padding:10px 14px}.nav-item:hover .submenu,.nav-item:focus-within .submenu{display:block}.nav-toggle{display:none}
/* Existing promotional art stays uncropped so its text remains legible. */
.welcome-banner{background:#ff7900;width:100%;overflow:hidden}.welcome-banner>a{display:block;max-width:1000px;margin:auto}.welcome-banner img{width:100%;max-height:570px;object-fit:contain}.page-content{padding-top:34px}.game-showcase{margin:0 0 38px}.game-showcase img{width:100%;height:auto;border-radius:14px}.promotion-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:8px 0 64px}.widget-banner{margin:0;overflow:hidden;border-radius:12px}.widget-banner img{width:100%;transition:transform .2s}.widget-banner a:hover img{transform:scale(1.025)}
/* Fine blue borders and spacious editorial typography echo the reference. */
.editorial-panel{border:1px solid var(--blue);border-radius:24px;padding:40px 36px 44px}.article-intro{text-align:center;margin-bottom:36px}.article-intro h1{font-size:clamp(28px,3.2vw,46px);margin:0 auto 22px;max-width:1100px;letter-spacing:-1px}.article-intro p{font-size:18px;margin:16px auto;max-width:1040px}.article-intro .home-byline{font-size:14px;color:var(--muted)}.article-intro .btn{background:var(--blue);margin:4px 0 12px}.article-intro>p:last-child{text-align:left;max-width:none;margin-top:26px}.prose{font-size:18px;overflow-wrap:break-word}.prose h2{font-size:28px;margin:40px 0 16px}.prose h3{font-size:21px;margin:24px 0 14px}.prose p{margin:0 0 24px}.prose a{color:#d66b00;text-decoration:underline;text-underline-offset:3px}.prose li{margin:8px 0}.prose ul{padding-left:25px;margin:16px 0 28px}.prose table{width:100%;border-collapse:collapse;margin:24px 0 36px;table-layout:fixed;font-size:17px}.prose th,.prose td{border:1px solid var(--blue);padding:16px 18px;text-align:left;vertical-align:middle;overflow-wrap:anywhere}.prose th{background:#f6f6ff;font-weight:700}.prose td:first-child{font-weight:600}
#articles{margin-top:60px;border-top:1px solid #e8e8f2;padding-top:36px}.composition-heading{text-align:center;margin-bottom:28px}.composition-kicker{color:var(--muted);font-size:13px;letter-spacing:1.5px;text-transform:uppercase}.composition-heading h2{font-size:36px;margin:7px 0}.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}.card{display:flex;flex-direction:column;border:2px solid var(--blue);border-radius:13px;overflow:hidden;box-shadow:0 2px 4px #12125215;transition:transform .2s,box-shadow .2s}.card:hover{transform:translateY(-4px);box-shadow:0 8px 20px #12125218;text-decoration:none}.thumb{width:100%;aspect-ratio:1;object-fit:cover}.card-body{display:block;padding:20px;text-align:center}.chip{display:inline-block;color:var(--blue);background:#eeeeff;border-radius:30px;padding:3px 13px;font-size:12px}.card h3{font-size:19px;font-weight:600;line-height:1.55;margin:12px 0}.card p{font-size:14px;color:var(--muted);margin:0;line-height:1.65}#topics{text-align:center;padding:36px 0 46px}#topics h2{font-size:23px;margin:0 0 12px}.cat-nav .chip{font-size:15px;padding:6px 25px}
footer.site{border-top:4px solid var(--blue);background:#f7f7f9;padding:38px 0 20px;font-size:14px}.footer-brand{display:flex;gap:40px;align-items:center}.footer-brand .brand{flex:0 0 230px}.footer-brand p{max-width:820px;color:var(--muted)}.footer-links{display:flex;flex-wrap:wrap;gap:12px 24px;border-block:1px solid var(--line);padding:22px 0;margin:24px 0}.ai-disclosure{font-size:13px;color:var(--muted)}.ai-disclosure p{margin:8px 0}.foot-copy{margin-top:24px;color:var(--muted)}
#rf-pop[hidden]{display:none!important}#rf-pop{position:fixed;inset:0;z-index:80;background:#080d3266;display:flex;align-items:center;justify-content:center;padding:20px}.rf-pop-card{position:relative;max-width:420px;width:100%;padding:36px;border:1px solid var(--blue);background:#fff;border-radius:20px;text-align:center;box-shadow:0 24px 70px #0003}.rf-pop-card h3{font-size:26px;margin:0 0 12px}.rf-pop-card p{margin-bottom:24px}#rf-pop-x{position:absolute;right:12px;top:6px;background:none;border:0;font-size:28px;cursor:pointer}
@media(min-width:1700px){.wrap,.page-content{width:min(1600px,calc(100% - 100px))}.welcome-banner img{max-height:640px}.welcome-banner>a{max-width:1200px}}
@media(max-width:760px){.wrap,.page-content{width:calc(100% - 32px)}header.site{background:#fff}.header-masthead{height:86px;width:calc(100% - 32px);padding-right:54px}.brand-logo{width:170px!important;max-height:70px}.header-cta{font-size:14px;padding:8px 18px;min-height:40px}.header-right{min-height:0}.nav-toggle{position:absolute;right:16px;top:23px;display:flex;flex-direction:column;gap:5px;justify-content:center;background:#fff;border:1px solid #dedee5;border-radius:7px;width:40px;height:40px;padding:9px}.nav-toggle span{height:2px;background:var(--blue);width:100%;display:block}.main{display:none;padding:8px 16px;gap:0}.main.open{display:flex;flex-direction:column;align-items:stretch}.main>a,.nav-item>a{padding:12px 10px}.submenu{position:static;box-shadow:none;background:transparent;border:0;padding:0 0 0 20px}.submenu a{color:#fff}.main.open .submenu{display:block}.page-content{padding-top:20px}.game-showcase{margin-bottom:20px}.game-showcase img{border-radius:8px}.promotion-grid{gap:12px;margin-bottom:32px;grid-template-columns:repeat(2,minmax(0,1fr))}.widget-banner:last-child{grid-column:1/-1;width:calc(50% - 6px);justify-self:center}.editorial-panel{padding:24px 18px;border-radius:16px}.article-intro h1{letter-spacing:-.5px}.article-intro p,.prose{font-size:16px}.prose h2{font-size:24px;margin-top:30px}.prose table{font-size:14px}.prose th,.prose td{padding:10px 8px}.product-grid{gap:16px;grid-template-columns:1fr}.card{display:grid;grid-template-columns:35% minmax(0,1fr);align-items:start}.card-body{padding:12px;text-align:left}.card h3{font-size:16px;margin:8px 0}.card p{font-size:13px}.thumb{height:100%;object-fit:cover}.composition-heading h2{font-size:29px}.footer-brand{display:block}.footer-links{gap:10px 18px}#articles{margin-top:36px}.welcome-banner img{max-height:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}

/* Welcome promotion artwork in the smart pop-up. */
.rf-pop-card{max-width:560px;padding:0 0 24px;overflow:auto;max-height:calc(100dvh - 40px)}
.rf-pop-image{width:100%;height:auto;border-radius:19px 19px 0 0;margin-bottom:22px}
.rf-pop-card h3,.rf-pop-card p{padding-inline:20px}
#rf-pop-x{top:10px;right:10px;width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#1019e8;box-shadow:0 2px 10px #0003;line-height:1;z-index:1}
/* One promotion at a time, with touch and keyboard navigation. */
.promotion-carousel{max-width:800px;margin:8px auto 64px}
.promotion-track{overflow:hidden;border-radius:18px}
.promotion-carousel .widget-banner{width:100%;margin:0;border-radius:0}
.promotion-carousel .widget-banner[hidden]{display:none}
.promotion-carousel .widget-banner img{width:100%;aspect-ratio:800/533;object-fit:contain}
.promotion-carousel .widget-banner a:hover img{transform:none}
.promotion-controls{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:16px}
.promotion-controls button{border:0;cursor:pointer;color:var(--blue);background:#eeeeff}
.promotion-prev,.promotion-next{width:44px;height:44px;border-radius:50%;font-size:18px}
.promotion-dots{display:flex;align-items:center;gap:4px}
.promotion-dots button{width:44px;height:44px;background:transparent;border-radius:50%;display:grid;place-items:center;padding:0}
.promotion-dots button::before{content:"";width:10px;height:10px;border-radius:20px;background:#ccc}
.promotion-dots button[aria-current="true"]::before{width:28px;background:var(--blue)}
@media(max-width:760px){.promotion-carousel{margin-bottom:32px}.promotion-track{border-radius:12px}}

/* App artwork directly below the promotion carousel. */
.app-banner{width:80%;margin:0 auto 64px;overflow:hidden;border-radius:18px}
.app-banner img{display:block;width:100%;height:auto}
@media(max-width:760px){.app-banner{margin-bottom:32px;border-radius:12px}}
.featured-image-link{display:block;min-width:0;overflow:hidden}
.card>a.card-body{color:var(--blue);text-decoration:none}
.card>a.card-body:hover h3{text-decoration:underline}