/* Small, independent additions. Existing page and logo motion stay intact. */
/* Hide only the page scrollbar; preserve native scrolling and nested controls. */
html { scrollbar-width: none; }
html::-webkit-scrollbar { display: none; width: 0; height: 0; }
body { -webkit-user-select: none; user-select: none; }
input, textarea, [contenteditable="true"] { -webkit-user-select: text; user-select: text; }
/* Fade the fixed HTML window, never the moving SVG ribbons. The percentages
   preserve the original logo coordinates; transparent padding protects both edges. */
.hero-signature { position: relative; }
.hero-signature > .games-viewport {
 position: absolute; display: block; pointer-events: none;
 left: 28.5451306413%; top: 72.5818181818%; width: 42.5700712589%; height: 26.2181818182%;
 overflow: hidden; contain: paint;
 -webkit-mask-image: linear-gradient(to bottom,transparent 4.76190476%,#000 19.04761905%,#000 80.95238095%,transparent 95.23809524%);
 mask-image: linear-gradient(to bottom,transparent 4.76190476%,#000 19.04761905%,#000 80.95238095%,transparent 95.23809524%);
 -webkit-mask-size: 100% 100%; mask-size: 100% 100%;
 -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; mask-mode: alpha;
}
.games-reels-svg { display: block; width: 100%; height: 100%; overflow: hidden; }
.header-actions { position: relative; }
.download-status { color: #b8d1df; font-size: 11px; letter-spacing: 0; font-weight: 400; }
.download-status[data-state="error"] { color: #f0b9b5; }
.header-download-status { position: absolute; right: 0; top: calc(100% + 10px); width: max-content; max-width: min(285px,82vw); margin: 0; text-align: left; line-height: 1.5; pointer-events: none; }
.header-download-status:not(:empty) { padding: 11px 14px; background: #101c24; border: 1px solid #9dc8df30; border-radius: 7px; box-shadow: 0 8px 24px #0005; }
.release { position: relative; }
.release .download-status { position: absolute; inset: 0; font-size: inherit; }
.release:has(.download-status:not(:empty)) [data-release] { visibility: hidden; }
.hero-foot .scroll-cue { color: #d4e5ef; font-size: 9px; letter-spacing: .21em; padding: 12px 20px 0; text-shadow: 0 2px 10px #0009; }
/* Two staggered descents: their invisible endpoints make the loop seamless. */
.hero-foot .scroll-cue { min-width: 44px; gap: 12px; }
.scroll-signal {
 display: block; position: relative; width: 34px; height: 50px;
 border: 1px solid #b7ddeb29; border-radius: 17px;
 background: linear-gradient(160deg,#b6e4ff0a,#07131a36);
 transition: transform .35s cubic-bezier(.2,.8,.2,1),border-color .35s,background-color .35s;
}
.scroll-signal svg { display: block; width: 100%; height: 100%; }
.scroll-descent {
 stroke: url(#scroll-signal-ink); stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round;
 animation: scroll-descent-flow 3.2s linear infinite; opacity: 0;
}
.scroll-descent-follow { animation-delay: -1.6s; }
@keyframes scroll-descent-flow {
 0% { transform: translateY(-11px); opacity: 0; }
 18% { opacity: .25; }
 42% { opacity: 1; }
 65% { opacity: .65; }
 84% { opacity: .18; }
 100% { transform: translateY(11px); opacity: 0; }
}
@media (hover:hover) and (pointer:fine) {
 .scroll-cue:hover .scroll-signal { transform: translateY(3px); border-color: #26bbff80; background-color: #26bbff0d; }
}
.scroll-cue:focus-visible .scroll-signal { border-color: #26bbffb3; background-color: #26bbff12; }
.scroll-cue:active .scroll-signal { transform: translateY(4px) scale(.94); transition-duration: .15s; }
:is(.page-hidden,.hero-out,.panel-active) .scroll-descent { animation-play-state: paused; }
@media (prefers-reduced-motion:reduce) {
 .hero-foot .scroll-cue { transform: translateX(-50%); }
 .scroll-descent { animation: none; opacity: .85; transform: translateY(-5px); }
 .scroll-descent-follow { opacity: .45; transform: translateY(4px); }
}
/* The hover owns a wrapper; the existing scroll reveal keeps its own transform. */
.launcher-tilt { --tilt-x: 0deg; --tilt-y: 0deg; --lift-x: 0px; --lift-y: 0px; --light-x: 50%; --light-y: 50%; transform: translate3d(var(--lift-x),var(--lift-y),0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); transform-style: preserve-3d; transition: transform .6s cubic-bezier(.2,.75,.25,1); pointer-events: none; }
.launcher-window { position: relative; }
.launcher-window::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: radial-gradient(ellipse at var(--light-x) var(--light-y),#c2eaff19,transparent 60%); opacity: 0; transition: opacity .5s; }
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .launcher-tilt.is-tracking { transition-duration: .16s; will-change: transform; }
  .launcher-tilt.is-tracking .launcher-window::after { opacity: 1; }
}
@media(hover:none), (pointer:coarse), (prefers-reduced-motion:reduce) { .launcher-tilt { transform: none; } .launcher-window::after { display: none; } }
/* Centre the screenshot itself; its caption stays inside the lower spacing. */
.download-section { min-height: 52svh; padding: 40px 6%; text-align: center; }
.download-layout { width: min(100%,1100px); max-width: 1100px; margin-inline: auto; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); justify-items: center; gap: clamp(28px,4vw,64px); }
.download-content { width: 100%; min-width: 0; }
.download-heading { justify-content: center; }
.download-heading .app-mark { width: 36px; height: 36px; border-radius: 11px; }
.download-content h2 { font-size: clamp(34px,3vw,44px); margin: 16px 0 12px; }
.download-content .intro { margin-bottom: 18px; }
.launcher-preview { position: relative; width: min(100%,560px); margin: 0 auto; justify-self: center; }
.launcher-preview figcaption { position: absolute; top: 100%; left: 0; right: 0; }
@media(max-width:900px) {
  .download-section { min-height: 0; }
  .download-layout { max-width: 370px; grid-template-columns: 1fr; gap: 40px; }
  .launcher-preview { width: min(100%,290px); }
}
@media(max-width:650px) {
  .download-section { padding: 40px 7%; }
  .download-layout { max-width: 370px; gap: 40px; }
  .download-heading .app-mark { width: 34px; height: 34px; border-radius: 10px; }
  .download-content h2 { font-size: 34px; }
  .launcher-preview { width: min(100%,290px); }
}
@media(max-width:360px) { .download-content h2 { font-size: 30px; } }
@media(max-width:650px) and (max-height:700px) { .launcher-preview { width: 210px; } }
/* The hidden scrollbar needs no reserved gutter when a dialog locks the page. */
html.modal-open { overflow: hidden; scrollbar-gutter: auto; }
.site-dialog { color: #f7f8f9; background: #10181e; border: 1px solid #b3d4e32c; border-radius: 14px; padding: 0; box-shadow: 0 30px 100px #0008; width: min(1180px,calc(100% - 48px)); max-width: none; max-height: calc(100dvh - 40px); overflow: auto; overscroll-behavior: contain; }
.site-dialog::backdrop { background: #030a10e6; }
.site-dialog[open] { animation: dialog-enter .25s cubic-bezier(.2,.7,.2,1); }
.site-dialog[open]::backdrop { animation: backdrop-enter .25s ease; }
.site-dialog.is-closing { animation: dialog-leave .16s ease forwards; }
.site-dialog.is-closing::backdrop { animation: backdrop-leave .16s ease forwards; }
.dialog-eyebrow { display: block; font-size: 9px; letter-spacing: .2em; color: #8daab9; }
.site-dialog h2 { margin: 4px 0 0; font-size: 21px; font-weight: 500; letter-spacing: -.025em; line-height: 1.25; }
.dialog-close { display: grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; border-radius: 7px; border: 1px solid #bed5e124; background: #ffffff04; color: #d0e1e9; cursor: pointer; }
.dialog-close:hover { background: #ffffff0b; border-color: #bed5e152; }
.site-dialog svg { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.pc-dialog { width: min(430px,calc(100% - 32px)); padding: 36px 30px 24px; text-align: center; }
.pc-dialog > .dialog-close { position: absolute; right: 12px; top: 12px; }
.pc-dialog-mark { display: block; margin: 5px auto 26px; }
.pc-dialog h2 { font-size: 28px; margin-top: 13px; }
.pc-dialog p { font-size: 13px; line-height: 1.65; color: #9cb0bc; }
.pc-dialog #pc-dialog-description { margin: 16px 0 24px; }
.copy-pc-link { display: flex; justify-content: center; align-items: center; gap: 12px; width: 100%; min-height: 51px; padding: 13px 14px; background: #e5f4fc; color: #10202b; border: 1px solid #e5f4fc; border-radius: 7px; cursor: pointer; font-size: 13px; font-weight: 550; }
.copy-pc-link:hover { background: #fff; }
.pc-dialog .copy-feedback { min-height: 20px; margin: 10px 0 0; font-size: 11px; color: #b8d1df; }
.pc-link { width: 100%; margin: 7px 0; padding: 12px; border: 1px solid #a8c9df48; border-radius: 7px; background: #091117; color: #d6e9f3; font: inherit; font-size: 13px; }
.pc-link:focus-visible { outline: 2px solid #26bbff; outline-offset: 2px; }
.download-anyway { display: inline-flex; justify-content: center; align-items: center; gap: 9px; width: 100%; min-height: 44px; padding: 12px 0; background: none; border: 0; color: #9cb0bc; font-size: 11px; cursor: pointer; }
.download-anyway:hover { color: #d9eaf4; }
.download-anyway:disabled { opacity: .6; cursor: wait; }
.pc-dialog .mobile-download-status { margin: 0; font-size: 11px; }
@keyframes dialog-enter { from { opacity: 0; transform: translateY(14px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes dialog-leave { to { opacity: 0; transform: translateY(8px) scale(.99); } }
@keyframes backdrop-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes backdrop-leave { to { opacity: 0; } }
@media(max-width:650px) {
  .hero-foot .scroll-cue { font-size: 8px; letter-spacing: .15em; }
  .site-dialog { width: calc(100% - 24px); max-height: calc(100dvh - 24px); }
  .site-dialog h2 { font-size: 18px; }
  .pc-dialog { padding: 32px 22px 18px; }
  .pc-dialog h2 { font-size: 27px; }
  .pc-link { font-size: 16px; }
}
@media(prefers-reduced-motion:reduce) { .site-dialog[open],.site-dialog[open]::backdrop { animation: none; } }