/* Static product illustrations. No player requests, video, canvas, timers or animation. */
.cs-page{--cs-cyan:#7fe8ff;--cs-violet:#b6a0ff;--cs-line:#63849c47;max-width:1280px;padding-block:34px 70px;overflow-wrap:anywhere}
.cs-page h1,.cs-page h2,.cs-page h3{color:#edf7ff;letter-spacing:-.035em;line-height:1.15}.cs-page p{color:#aec3d5;line-height:1.85}.cs-page .cs-eyebrow{font-size:11px;font-weight:800;letter-spacing:.16em;color:#92d9f1;margin:0 0 18px}.cs-page .primary-button{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:48px;padding:12px 20px;border-radius:12px;border:1px solid #a6d5f4;font-size:14px;font-weight:800;text-decoration:none}.cs-page .primary-button:focus-visible,.cs-secondary:focus-visible{outline:2px solid #b8ecff;outline-offset:5px}
.cs-hero{display:grid;grid-template-columns:minmax(0, .82fr) minmax(0,1.18fr);gap:36px;align-items:center;padding:44px 0 70px;border-bottom:1px solid var(--cs-line)}.cs-hero h1{font-size:clamp(34px,4.4vw,62px);margin:0 0 24px;font-weight:850;max-width:15ch}.cs-hero .seo-integrated-intro{font-size:16px;margin:0 0 28px;max-width:43ch}.cs-actions{display:flex;flex-wrap:wrap;align-items:center;gap:20px}.cs-secondary{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-size:13px;color:#c9e3f4;text-decoration:none}.cs-secondary:hover{color:#fff}.cs-hero .cs-signin-note{font-size:12px;line-height:1.7;margin:18px 0}.cs-capabilities{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:11px;color:#849bb0}.cs-capabilities span+span{border-inline-start:1px solid #526c8355;padding-inline-start:16px}
.cs-hero-visual{position:relative;margin:0;min-width:0;padding:36px 60px 58px 0;direction:ltr;isolation:isolate}.cs-hero-visual::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 40% 45%,#3182b32b,transparent 65%),radial-gradient(ellipse at 85% 80%,#8562ce32,transparent 60%)}.cs-desktop{border:1px solid #7198b066;border-radius:15px;overflow:hidden;background:#102232;box-shadow:0 20px 35px #0006;transform:perspective(1300px) rotateY(-7deg) rotateX(2deg)}.cs-window-bar{display:flex;align-items:center;gap:5px;padding:10px;background:#101f30;border-bottom:1px solid #3e607855}.cs-window-bar i{width:5px;height:5px;background:#7a91ab;border-radius:50%}.cs-window-bar i:first-child{background:#ba92f3}.cs-window-bar span{margin-inline-start:10px;color:#8cb4cf;font-size:7px;letter-spacing:.15em}.cs-hero-visual>figcaption{position:absolute;bottom:0;inset-inline:0;text-align:center;color:#8babc3;font-size:10px;line-height:1.6}.cs-phone-preview{width:29%;position:absolute;right:0;top:0;border:5px solid #0b1420;border-radius:23px;overflow:hidden;box-shadow:0 12px 30px #000a;outline:1px solid #7d93b780;background:#000}
.cs-overlay{position:relative;container-type:inline-size;aspect-ratio:16/9;background:#07111f url('/assets/creator-showcase/N2.webp') center/cover;color:#edf9ff;font-family:system-ui,sans-serif;text-align:left;direction:ltr;overflow:hidden}.cs-overlay *{box-sizing:border-box}.cs-overlay .cs-stream-id{position:absolute;left:81%;top:3%;width:18%}.cs-stream-id small{display:block;color:#a8e7ff;font-size:1.1cqw;line-height:1.4}.cs-stream-id strong{display:block;font-size:2cqw;line-height:1.2;font-weight:900}.cs-camera{position:absolute;left:81%;top:16%;width:18%;height:20%;border:1px solid #ae9bf9;border-radius:5px;overflow:hidden;background:#101a32}.cs-camera img{display:block!important;max-width:none!important;width:100%!important;height:100%!important;object-fit:cover!important}.cs-camera span{position:absolute;left:4px;bottom:2px;font-size:.8cqw;color:#e3ecff;background:#081628b3;padding:1px 3px;border-radius:3px}.cs-score{position:absolute;left:81%;top:39%;width:18%;height:13%;border:1px solid #8aa3d077;border-radius:4px;background:#0b182ce8;display:grid;grid-template-columns:20% 1fr 1fr;align-items:center;padding:2%;gap:3px;padding:4px}.cs-score img{width:100%;height:auto;grid-row:1/3}.cs-score span{grid-column:2/4}.cs-score small{font-size:.7cqw;color:#99b9d0;display:none}.cs-score span strong{font-size:1.3cqw;display:block;line-height:1}.cs-score b{grid-column:2;font-size:1.55cqw;line-height:1}.cs-score em{font:800 1.2cqw/1 system-ui;color:#7ff8d1;grid-column:3}.cs-record{position:absolute;left:81%;top:55%;width:18%;display:grid;gap:3px}.cs-record>div{display:flex;align-items:center;justify-content:space-between;gap:2px;padding:3px 5px;border:1px solid #8f94dc6b;border-radius:3px;background:#0c1835e6}.cs-record small{font-size:1cqw}.cs-record b{font-size:1.4cqw;color:#7dffd9;line-height:1}.cs-record>div:nth-child(2) b{color:#ff9dba}.cs-record>div:nth-child(3) b{color:#bdabff}.cs-game{position:absolute;left:1%;top:1.5%;width:78.5%;height:97%;border:1px solid #83d9f5;border-radius:6px;background:radial-gradient(ellipse at 50% 45%,#23395b,#080e20 72%);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px}.cs-game img{width:43%!important;max-width:none!important;height:auto!important;object-fit:contain}.cs-game small{font-size:1.1cqw;color:#91afc7}.cs-ticker{position:absolute;left:81%;top:77%;width:18%;font-size:1cqw;line-height:1.5;font-weight:750;padding:4px;border-inline-start:2px solid #80def6;background:#0b182ddb}.cs-portrait{aspect-ratio:9/16;background-image:url('/assets/creator-showcase/B1.webp')}.cs-portrait .cs-stream-id{left:5%;top:3%;width:33%;z-index:1}.cs-portrait .cs-stream-id small{font-size:3cqw}.cs-portrait .cs-stream-id strong{font-size:4.8cqw}.cs-portrait .cs-camera{left:39%;top:2%;width:58%;height:14%;border-radius:6px}.cs-portrait .cs-camera span{font-size:1.8cqw}.cs-portrait .cs-score{left:3%;top:18%;width:94%;height:7%;grid-template-columns:8% 1fr 1fr 18%;padding:4px;gap:3px}.cs-portrait .cs-score img{grid-row:auto}.cs-portrait .cs-score span{grid-column:auto}.cs-portrait .cs-score span strong{font-size:4cqw}.cs-portrait .cs-score b{grid-column:auto;font-size:5cqw}.cs-portrait .cs-score em{grid-column:auto;font-size:4.3cqw}.cs-portrait .cs-record{left:3%;top:26%;width:94%;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}.cs-portrait .cs-record>div{padding:4px 3px;flex-direction:column}.cs-portrait .cs-record small{font-size:2.6cqw}.cs-portrait .cs-record b{font-size:5cqw}.cs-portrait .cs-game{left:3%;top:33%;width:94%;height:40%;border-radius:6px}.cs-portrait .cs-game img{width:64%!important}.cs-portrait .cs-game small{font-size:2.1cqw;text-align:center}.cs-portrait .cs-ticker{left:3%;top:75%;width:94%;font-size:3cqw}.cs-comments{position:absolute;top:88%;left:10%;width:80%;text-align:center;color:#93a7b8;font-size:2.8cqw;line-height:1.5}
.cs-section-heading{max-width:660px;margin-bottom:32px}.cs-section-heading h2,.cs-start h2{font-size:clamp(27px,3.5vw,41px);margin:0 0 16px}.cs-section-heading>p:last-child{font-size:15px;margin:0}.cs-experience,.cs-gallery{padding:64px 0;border-bottom:1px solid var(--cs-line)}.cs-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.cs-feature-grid>article{min-width:0;border-inline-start:1px solid var(--cs-line);padding-inline-start:22px}.cs-feature-number{font-size:12px;font-weight:800;color:#9da8ed}.cs-feature-grid h3{font-size:20px;margin:15px 0}.cs-feature-grid p{font-size:13px;margin:0 0 18px}.cs-feature-grid>article>small{font-size:10px;color:#7f9db7}.cs-data-example{background:linear-gradient(120deg,#16354d,#1b2140);padding:14px;border:1px solid #567a9866;border-radius:12px;display:flex;justify-content:space-between;align-items:center;gap:8px;margin:28px 0 8px;text-align:left}.cs-data-example span{font-size:10px;color:#a6c1d8}.cs-data-example b{display:block;font-size:25px;color:#e6f5ff;line-height:1.3}.cs-data-example>strong{font-size:24px;color:#7ce7be}.cs-mini-layout{display:grid;grid-template-columns:1fr 1.4fr;grid-template-rows:42px 22px 66px;gap:6px;background:#0c2033;border:1px solid #5e76945e;border-radius:12px;padding:12px;color:#8ed9f0;font:700 10px/1 system-ui;text-align:center}.cs-mini-layout>*{display:grid;place-items:center;border:1px solid #789bd266;border-radius:4px}.cs-mini-layout span{grid-row:1/3;background:#324366}.cs-mini-layout i{font-style:normal;color:#8ef6d1}.cs-mini-layout b{grid-column:1/3;background:linear-gradient(120deg,#232c50,#16394b)}.cs-phone-control{width:210px;max-width:100%;margin-inline:auto;border:4px solid #22324a;border-radius:18px;padding:15px;background:#0b1b2a;box-shadow:0 9px 14px #0004;font-size:10px}.cs-phone-control>div:first-child{display:flex;justify-content:space-between;color:#b8d6e9;margin-bottom:20px}.cs-phone-control>div:first-child span{color:#7fe8c1}.cs-phone-control>b{font-size:10px}.cs-phone-swatches{display:flex;gap:8px;margin:10px 0}.cs-phone-swatches i{width:32px;height:32px;border-radius:7px;background:linear-gradient(125deg,#18a8b8,#253b69);border:1px solid #8ceaff}.cs-phone-swatches i:nth-child(2){background:linear-gradient(125deg,#8952c6,#3e213f);border-color:#8e79c9}.cs-phone-swatches i:nth-child(3){background:#151e2b;border-color:#566675}.cs-phone-swatches i:nth-child(4){background:linear-gradient(125deg,#54372f,#8d3a7a);border-color:#9d6c8f}.cs-phone-control p{font-size:10px;margin:14px 0 0}
.cs-background-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.cs-background-grid figure{position:relative;margin:0;border:1px solid #627f9a66;border-radius:15px;overflow:hidden;background:#0b182a;aspect-ratio:4/5;box-shadow:0 9px 20px #0003}.cs-background-grid img{display:block;width:100%;height:100%;object-fit:cover}.cs-background-grid figcaption{position:absolute;inset:auto 0 0;padding:50px 16px 18px;background:linear-gradient(transparent,#06101af5)}.cs-background-grid small{display:block;font-size:11px;color:#b0cae1;margin-bottom:6px}.cs-background-grid strong{font-size:12px;color:#edf8ff;letter-spacing:.04em}
.cs-start{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.7fr);gap:65px;padding:64px 0}.cs-start ol{list-style:none;counter-reset:start;display:grid;gap:24px;padding:0;margin:28px 0}.cs-start li{counter-increment:start;position:relative;padding-inline-start:45px;display:grid;gap:6px}.cs-start li::before{content:counter(start);position:absolute;inset-inline-start:0;top:0;display:grid;place-items:center;width:28px;height:28px;border:1px solid #6295b077;border-radius:9px;color:#a4dff5;background:#133147;font:750 12px/1 system-ui}.cs-start li>b{font-size:15px}.cs-start li>span{font-size:13px;color:#a7bed2;line-height:1.8}.cs-start aside{align-self:center;padding:28px;border:1px solid #6776a466;border-radius:20px;background:linear-gradient(145deg,#173b4a44,#3a245044)}.cs-aside-icon{display:grid;place-items:center;width:42px;height:42px;border:1px solid #9f9dd080;border-radius:12px;font-size:27px;color:#b2caff}.cs-start aside h3{font-size:22px;margin:22px 0 14px}.cs-start aside p{font-size:13px;margin:0}.cs-more{border-top:1px solid var(--cs-line);padding-top:32px}.cs-more>h2{font-size:23px;margin:0 0 18px}.cs-more .seo-integrated-help{margin:0}
html[dir=rtl] .cs-page :is(h1,h2,h3,.cs-eyebrow){letter-spacing:0}html[dir=rtl] .cs-hero-visual{direction:ltr}html[dir=rtl] .cs-overlay *{direction:ltr}
@media(max-width:1000px){.cs-hero{grid-template-columns:minmax(0,1fr);gap:30px}.cs-hero h1{max-width:22ch;font-size:48px}.cs-hero-copy{max-width:780px}.cs-hero-visual{width:min(760px,100%);margin:auto;padding-block:30px 72px}.cs-feature-grid{gap:18px}.cs-feature-grid>article{padding-inline-start:16px}.cs-start{gap:32px}}
@media(max-width:640px){.cs-page{padding-block:18px 44px}.cs-hero{padding:24px 0 40px;gap:24px}.cs-hero h1{font-size:36px;max-width:18ch}.cs-hero .seo-integrated-intro{font-size:14px}.cs-actions{gap:12px}.cs-hero-visual{padding:20px 28px 54px 0}.cs-phone-preview{border-width:3px;border-radius:13px}.cs-desktop{border-radius:9px;transform:none}.cs-window-bar{padding:6px;gap:3px}.cs-window-bar i{width:3px;height:3px}.cs-window-bar span{font-size:5px}.cs-hero-visual>figcaption{font-size:10px;bottom:0}.cs-experience,.cs-gallery{padding:40px 0}.cs-feature-grid{grid-template-columns:minmax(0,1fr);gap:32px}.cs-feature-grid>article{padding-inline-start:18px}.cs-feature-grid h3{font-size:22px}.cs-feature-grid p{font-size:14px}.cs-data-example,.cs-mini-layout{max-width:360px}.cs-phone-control{margin-inline:0}.cs-background-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.cs-background-grid figcaption{padding:40px 12px 14px}.cs-background-grid strong{font-size:10px}.cs-start{grid-template-columns:minmax(0,1fr);gap:30px;padding:40px 0}.cs-start aside{padding:22px}.cs-section-heading h2,.cs-start h2{font-size:30px}.cs-overlay .cs-camera span{display:none}}
/* Keep the landscape camera and statistics visible beside the portrait preview. */
.cs-hero-visual{padding:18px 0 130px 22px}.cs-phone-preview{right:auto;left:0;top:40%;width:28%}
@media(max-width:1000px){.cs-hero-visual{padding:18px 0 150px 22px}}
@media(max-width:640px){.cs-hero-visual{padding:12px 0 95px 12px}.cs-phone-preview{left:0;top:40%;width:29%}}
.cs-score b,.cs-score em{white-space:nowrap}.cs-landscape .cs-score{grid-template-columns:18% minmax(0,1fr)}.cs-landscape .cs-score span{grid-column:2}.cs-landscape .cs-score b{grid-column:1/3;font-size:1.55cqw}.cs-landscape .cs-score em{position:absolute;right:4px;bottom:5px;font-size:1.05cqw}

/* Existing official game artwork, decorative alongside explicit text labels. */
.cs-data-example .cs-data-label{display:flex;align-items:center;gap:7px;font-size:11px;line-height:1.5}.cs-data-label img{width:22px;height:22px;object-fit:contain;flex:none}.cs-game-symbols{display:flex;align-items:center;gap:10px;margin-block:14px 0;min-height:36px}.cs-game-symbols img{object-fit:contain;max-width:36px;max-height:36px}.cs-background-grid .cs-game-category{display:flex;align-items:center;gap:7px}.cs-background-grid .cs-game-category img{position:static;width:20px;height:23px;object-fit:contain;flex:none}

.cs-score>svg{flex:none;filter:drop-shadow(0 3px 3px #0006)}.cs-game-symbols>svg{vertical-align:middle}