*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#08070d;color:#f8f7ff;font-family:Inter,Arial,sans-serif;overflow-x:hidden}.noise{position:fixed;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");z-index:20}.nav{height:78px;max-width:1240px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid #171522}.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-size:12px;font-weight:800;letter-spacing:.8px}.brand b{color:#a875ff}.brand-mark{width:34px;height:34px;border:1px solid #a875ff;border-radius:10px;display:grid;place-items:center;color:#fff;font-size:20px;box-shadow:0 0 24px #7d3cff55}.nav nav,.nav-actions,footer div:last-child{display:flex;align-items:center;gap:28px}.nav nav a,.nav-actions a,footer a{color:#aaa6b8;text-decoration:none;font-size:13px}.nav nav a:hover,.nav-actions a:hover,footer a:hover{color:#fff}.lang{background:none;border:0;color:#aaa6b8}.login{margin-left:8px}.download{display:inline-flex;align-items:center;gap:18px;background:#9657ff;color:white!important;text-decoration:none;padding:14px 19px;border-radius:11px;font-size:13px;font-weight:700;box-shadow:0 10px 35px #813cff38;transition:.2s}.download:hover{transform:translateY(-2px);background:#a96cff}.download > span:not([data-i18n]){font-size:17px}.download.small{padding:10px 14px;gap:8px}.hero{max-width:1240px;margin:auto;min-height:650px;padding:95px 24px 80px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:60px}.eyebrow{font-size:11px;letter-spacing:2.2px;font-weight:800;color:#a875ff;margin-bottom:20px}.dot,.live-dot{display:inline-block;width:6px;height:6px;background:#b873ff;border-radius:50%;margin-right:7px;box-shadow:0 0 12px #a65cff}.hero h1{font-size:clamp(48px,6vw,78px);line-height:.98;letter-spacing:-4px;margin:0 0 26px;max-width:650px}.hero h1 span,h2 span{color:#a875ff}.hero-copy>p{color:#9e99aa;line-height:1.7;max-width:560px;font-size:16px}.hero-actions{display:flex;gap:12px;margin-top:34px}.ghost{padding:14px 19px;border:1px solid #292534;border-radius:11px;color:#ddd;text-decoration:none;font-size:13px}.stats{display:flex;gap:42px;margin-top:58px}.stats strong{display:block;font-size:20px}.stats small{color:#747080;margin-top:4px;display:block}.hero-visual{position:relative;height:450px;display:grid;place-items:center}.glow{position:absolute;width:370px;height:370px;background:#7d3cff55;filter:blur(90px);border-radius:50%}.screen{position:relative;width:min(490px,100%);height:330px;border:1px solid #393044;border-radius:22px;background:#100d18;box-shadow:0 35px 90px #000,0 0 80px #783cff22;overflow:hidden;transform:perspective(1000px) rotateY(-5deg) rotateX(2deg)}.screen-top,.screen-bottom{height:43px;padding:0 18px;display:flex;align-items:center;gap:8px;color:#b9b4c2;font-size:11px;background:#0d0b13}.viewers{margin-left:auto}.arena{height:244px;position:relative;background:radial-gradient(circle at 50% 45%,#47216c,#17102a 50%,#0b0910)}.orb{position:absolute;border-radius:50%;filter:blur(1px);background:#9c54ff;box-shadow:0 0 35px #9c54ff}.orb-a{width:20px;height:20px;left:18%;top:28%}.orb-b{width:10px;height:10px;right:23%;top:20%}.player{position:absolute;left:47%;top:36%;width:58px;height:58px;border-radius:17px;background:linear-gradient(135deg,#c694ff,#6c2fd1);display:grid;place-items:center;font-size:28px;font-weight:800;box-shadow:0 0 45px #a14fff99}.target{position:absolute;right:28%;bottom:25%;font-size:40px;color:#e6d0ff;text-shadow:0 0 30px #a95cff}.chat{position:absolute;left:15px;bottom:14px;font-size:9px;color:#d1ccd8}.chat p{margin:5px 0}.chat b{color:#c391ff}.screen-bottom{justify-content:space-around}.marquee{border-block:1px solid #191621;padding:22px;display:flex;justify-content:center;gap:35px;align-items:center;color:#696474;font-size:11px;font-weight:800;letter-spacing:2px}.marquee i{color:#985bff;font-style:normal}.section,.how,.features{max-width:1240px;margin:auto;padding:125px 24px}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:55px}.section-head h2,.features h2,.download-section h2{font-size:52px;line-height:1.03;letter-spacing:-2.5px;margin:0}.section-head>p{max-width:380px;color:#898491;font-size:14px;line-height:1.7;margin:0}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.game-card{border:1px solid #211d29;border-radius:18px;overflow:hidden;background:#0d0b12;transition:.25s}.game-card:hover{transform:translateY(-5px);border-color:#5e3a86}.card-art{height:290px;position:relative;overflow:hidden}.art-one{background:radial-gradient(circle at 70% 20%,#aa5fff,#29123e 35%,#0b0810 75%)}.art-two{background:radial-gradient(circle at 30% 30%,#7138c5,#181126 42%,#0b0810 80%)}.art-three{background:radial-gradient(circle at 55% 50%,#c26dff,#24102e 35%,#09070c 80%)}.big-letter{position:absolute;left:32px;top:50px;font-size:120px;font-weight:800;color:#fff;opacity:.92;text-shadow:0 15px 50px #000}.pill{position:absolute;top:18px;left:18px;background:#fff;color:#18121f;padding:6px 9px;border-radius:20px;font-size:9px;font-weight:800}.art-caption{position:absolute;right:20px;bottom:18px;text-align:right;font-size:10px;line-height:1.4;letter-spacing:2px;color:#d9cce5}.art-caption b{font-size:20px;color:#fff}.card-info{padding:24px}.card-info h3{margin:0 0 8px;font-size:18px}.card-info p{color:#7f7a88;font-size:12px;line-height:1.6;min-height:38px}.card-info a{color:#b17bff;text-decoration:none;font-size:12px;font-weight:700}.how{max-width:none;background:#0b0910;border-block:1px solid #17131f}.center{max-width:1240px;margin:auto;display:block;text-align:center}.center .eyebrow{margin-bottom:15px}.steps{max-width:1100px;margin:65px auto 0;display:flex;align-items:center;justify-content:center}.step{width:250px;text-align:center}.step>b{font-size:10px;color:#716b79}.step-icon{margin:18px auto;width:58px;height:58px;border:1px solid #3a3048;border-radius:17px;display:grid;place-items:center;color:#b277ff;font-size:22px;background:#120d19}.step h3{font-size:15px}.step p{font-size:12px;color:#797482;line-height:1.6}.line{height:1px;width:100px;background:linear-gradient(90deg,#2d2537,#7843a6,#2d2537)}.features{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px}.feature-main p{color:#85808d;line-height:1.7;max-width:410px;margin:24px 0 32px;font-size:14px}.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#24202a;border:1px solid #24202a}.feature-grid>div{background:#0d0b12;padding:32px;min-height:185px}.feature-grid strong{color:#8350bd;font-size:10px}.feature-grid h3{font-size:16px;margin:20px 0 8px}.feature-grid p{font-size:12px;color:#797481;line-height:1.6}.download-section{margin:30px 24px 100px;padding:90px 20px;text-align:center;border:1px solid #2a2135;border-radius:24px;background:radial-gradient(circle at 50% 0,#33164e,#0e0b13 48%)}.download-section h2{margin-bottom:20px}.download-section p{color:#88838f;font-size:14px;margin-bottom:28px}.download-section small{display:block;color:#625e69;font-size:10px;margin-top:16px}footer{max-width:1240px;margin:auto;padding:30px 24px 45px;border-top:1px solid #171522;display:flex;align-items:center;justify-content:space-between;color:#625e69;font-size:10px}footer div:last-child{gap:18px} @media(max-width:850px){.nav nav,.nav-actions .login{display:none}.hero{grid-template-columns:1fr;padding-top:60px}.hero-visual{height:350px}.cards{grid-template-columns:1fr}.section-head,.features{display:block}.section-head>p{margin-top:25px}.steps{flex-direction:column}.line{width:1px;height:45px}.features{padding-top:80px}.feature-grid{margin-top:45px}.hero h1{font-size:54px}.section-head h2,.features h2,.download-section h2{font-size:40px}.marquee{overflow:hidden;white-space:nowrap}.marquee span:nth-of-type(2),.marquee span:nth-of-type(3),.marquee span:nth-of-type(4){display:none}footer{gap:20px;flex-wrap:wrap}.nav{height:70px}.download.small{display:none}}
/* Larp Games Stream uploaded logo */
.brand-logo{
  width:48px;
  height:48px;
  object-fit:cover;
  border-radius:12px;
  display:block;
  box-shadow:0 0 24px rgba(155,80,255,.28);
  flex-shrink:0;
}
footer .brand-logo{
  width:44px;
  height:44px;
}
@media(max-width:850px){
  .brand-logo{width:44px;height:44px}
  footer .brand-logo{width:40px;height:40px}
}

/* Wordmark next to the icon (header + footer) */
.brand{gap:12px}
.brand-word{display:flex;flex-direction:column;line-height:1;font-size:15px;font-weight:800;letter-spacing:1px;color:#f8f7ff}
.brand-word b{font-size:8px;font-weight:700;letter-spacing:2.2px;color:#a875ff;margin-top:4px}
footer .brand{display:flex;align-items:center}

/* Mobile hamburger + menu */
.burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:34px;height:34px;background:none;border:1px solid #292534;border-radius:9px;cursor:pointer}
.burger span{display:block;width:16px;height:2px;background:#e8e4f0;margin:0 auto;border-radius:2px}
.mobile-menu{display:none;flex-direction:column;gap:4px;max-width:1240px;margin:auto;padding:0 24px;overflow:hidden;max-height:0;transition:max-height .25s ease}
.mobile-menu.open{max-height:320px;padding:10px 24px 22px}
.mobile-menu a{color:#cfc9da;text-decoration:none;font-size:14px;padding:12px 4px;border-bottom:1px solid #171522}
.mobile-menu a.download{border:0;color:#fff!important;text-align:center;margin-top:10px;border-radius:11px}
@media(max-width:850px){
  .burger{display:flex}
  .mobile-menu{display:flex}
}

/* Logo watermark behind the hero mock-up screen, reinforcing brand identity */
.hero-visual{overflow:visible}
.watermark{position:absolute;width:340px;height:340px;object-fit:contain;opacity:.08;filter:blur(1px);pointer-events:none;z-index:0}
.hero-visual .screen,.hero-visual .glow{position:relative;z-index:1}

/* Small logo mark inside the live mock-up top bar */
.screen-logo{width:16px;height:16px;border-radius:4px;object-fit:cover;margin-right:2px}

/* Player avatar now shows the logo mark instead of a plain letter */
.player{overflow:hidden;padding:0}
.player img{width:100%;height:100%;object-fit:cover;border-radius:17px}

/* Small logo above the final CTA */
.download-logo{width:56px;height:56px;object-fit:cover;border-radius:14px;margin:0 auto 18px;display:block;box-shadow:0 0 30px rgba(155,80,255,.35)}

@media(max-width:850px){
  .watermark{width:220px;height:220px}
  .brand-word{font-size:13px}
}

/* Game cards with real cover art */
.card-art{height:auto;aspect-ratio:3/4;position:relative;overflow:hidden;background:#0d0b12}
.card-art img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block;transition:.35s}
.game-card:hover .card-art img{transform:scale(1.05)}
.pill{z-index:2}
.card-info{position:relative}
.tag{display:inline-block;background:#1c1726;color:#b17bff;border:1px solid #3a2f52;font-size:9px;font-weight:800;letter-spacing:1.2px;padding:5px 9px;border-radius:20px;margin-bottom:12px}
.tag.vital{background:#241a10;color:#e0a45c;border-color:#4a3319}

/* Community banner with real crowd photo */
.community{position:relative;max-width:1240px;margin:0 auto 40px;border-radius:24px;overflow:hidden;border:1px solid #211d29}
.community img{width:100%;display:block;max-height:420px;object-fit:cover;object-position:center 15%}
.community::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#08070d 5%,rgba(8,7,13,.15) 55%)}
.community-copy{position:absolute;left:0;right:0;bottom:0;padding:34px 40px;z-index:1;text-align:center}
.community-copy h2{margin:6px 0 0;font-size:30px;letter-spacing:-1px}
.community-copy h2 span{color:#c391ff}
@media(max-width:850px){
  .community{margin:0 16px 30px;border-radius:18px}
  .community img{max-height:260px}
  .community-copy{padding:20px}
  .community-copy h2{font-size:22px}
}

/* Roblox + Discord compatibility badge under the download CTA */
.compat{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:26px}
.compat img{width:64px;height:36px;object-fit:cover;border-radius:8px;border:1px solid #2a2135}
.compat span{color:#8f899a;font-size:11px;text-align:left;max-width:140px;line-height:1.4}

/* Small logo icon placed inside the download buttons */
.btn-logo{width:18px;height:18px;object-fit:cover;border-radius:5px;display:inline-block;vertical-align:middle}
.download.small .btn-logo{margin-right:2px}
.download:not(.small) .btn-logo{margin-left:4px}

/* Simulated reviews section */
.reviews{max-width:1240px;margin:auto;padding:60px 24px 125px}
.review-grid{max-width:1140px;margin:55px auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.review-card{border:1px solid #211d29;border-radius:16px;background:#0d0b12;padding:22px}
.review-card .stars{color:#e0a45c;font-size:13px;letter-spacing:2px;margin-bottom:12px}
.review-card p{font-size:13px;color:#c9c4d1;line-height:1.6;margin:0 0 20px;min-height:78px}
.reviewer{display:flex;align-items:center;gap:10px}
.reviewer .avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#18121f;font-size:11px;font-weight:800;flex-shrink:0}
.reviewer b{display:block;font-size:12px;color:#f0eef5}
.reviewer small{color:#767083;font-size:10px}
@media(max-width:850px){
  .review-grid{grid-template-columns:1fr;gap:14px}
  .reviews{padding:20px 24px 80px}
}

/* Language switcher */
.lang-wrap{position:relative}
.lang{background:none;border:1px solid #292534;border-radius:9px;color:#aaa6b8;cursor:pointer;font-size:12px;font-weight:600;padding:8px 12px;display:inline-flex;align-items:center;gap:6px;transition:.15s}
.lang:hover{color:#fff;border-color:#3a3548}
.lang span:last-child{font-size:10px;opacity:.7}
.lang-dropdown{display:none;position:absolute;top:calc(100% + 8px);right:0;min-width:140px;background:#12101a;border:1px solid #2a2535;border-radius:12px;padding:6px;z-index:50;box-shadow:0 16px 40px rgba(0,0,0,.55)}
.lang-dropdown.open{display:block}
.lang-option{display:block;width:100%;text-align:left;background:none;border:0;color:#cfc9da;font-size:13px;padding:10px 12px;border-radius:8px;cursor:pointer;font-family:inherit}
.lang-option:hover{background:#1c1826;color:#fff}
.lang-option.active{color:#b17bff;font-weight:600}
.nav-actions{gap:16px}
@media(max-width:850px){
  .lang-wrap{margin-right:4px}
}

/* Game cards as full clickable links */
a.game-card{display:block;color:inherit;text-decoration:none;cursor:pointer}
a.game-card .demo-link{color:#b17bff;font-size:12px;font-weight:700}

/* Scroll reveal animations */
.reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1);
  will-change:opacity,transform;
}
.reveal.visible{
  opacity:1;
  transform:translateY(0);
}
.reveal-delay-1{transition-delay:.08s}
.reveal-delay-2{transition-delay:.16s}
.reveal-delay-3{transition-delay:.24s}
.reveal-delay-4{transition-delay:.32s}
.cards .game-card.reveal{transition-delay:0s}
.cards .game-card.reveal:nth-child(1){transition-delay:.05s}
.cards .game-card.reveal:nth-child(2){transition-delay:.1s}
.cards .game-card.reveal:nth-child(3){transition-delay:.15s}
.cards .game-card.reveal:nth-child(4){transition-delay:.05s}
.cards .game-card.reveal:nth-child(5){transition-delay:.1s}
.cards .game-card.reveal:nth-child(6){transition-delay:.15s}
.cards .game-card.reveal:nth-child(7){transition-delay:.2s}
.review-grid .review-card.reveal:nth-child(1){transition-delay:.05s}
.review-grid .review-card.reveal:nth-child(2){transition-delay:.12s}
.review-grid .review-card.reveal:nth-child(3){transition-delay:.18s}
.review-grid .review-card.reveal:nth-child(4){transition-delay:.24s}
.steps .step.reveal:nth-child(1){transition-delay:.05s}
.steps .step.reveal:nth-child(3){transition-delay:.15s}
.steps .step.reveal:nth-child(5){transition-delay:.25s}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none}
}

/* Pricing */
.hero-price{margin-top:28px;max-width:430px;padding:22px 24px;border:1px solid #2b2337;border-radius:18px;background:linear-gradient(180deg,rgba(25,19,35,.95),rgba(13,11,18,.98));box-shadow:0 18px 45px rgba(0,0,0,.28)}
.price-chip,.pricing-card-badge{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border:1px solid #45315f;border-radius:999px;background:#171121;color:#cdaeff;font-size:10px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase}
.price-line,.pricing-value{display:flex;align-items:end;gap:10px;margin-top:14px}
.price-line strong,.pricing-value strong{font-size:42px;line-height:1;letter-spacing:-2px}
.price-line span,.pricing-value span{color:#9f98ae;font-size:15px;margin-bottom:4px}
.hero-price p,.pricing-preview-copy p,.pricing-note{color:#938ca1;font-size:14px;line-height:1.7}
.pricing-preview{max-width:1240px;margin:90px auto 20px;padding:0 24px;display:grid;grid-template-columns:1fr 420px;gap:26px;align-items:stretch}
.pricing-preview-copy{padding:20px 0}
.pricing-card-main{padding:30px;border:1px solid #2b2235;border-radius:24px;background:radial-gradient(circle at top,#2a1840,#0d0b12 55%);box-shadow:0 30px 70px rgba(0,0,0,.35)}
.pricing-card-main h3,.pricing-card-main h2{margin:16px 0 0;font-size:29px;line-height:1.1;letter-spacing:-1px}
.pricing-list{list-style:none;padding:0;margin:22px 0 28px;display:flex;flex-direction:column;gap:12px}
.pricing-list li{position:relative;padding-left:24px;color:#d4cedd;font-size:14px;line-height:1.6}
.pricing-list li::before{content:"+";position:absolute;left:0;top:0;color:#b17bff;font-weight:800}
.pricing-page{max-width:1240px;margin:auto;padding:95px 24px 110px;display:grid;grid-template-columns:1fr 430px;gap:36px;align-items:start}
.pricing-page h1{font-size:clamp(42px,6vw,72px);line-height:1;letter-spacing:-3px;margin:12px 0 24px}
.pricing-highlights{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.pricing-highlights span{padding:10px 14px;border:1px solid #2c2537;border-radius:999px;background:#120f18;color:#d5d0de;font-size:12px}
.pricing-card-page{position:sticky;top:32px}
.pricing-note{margin:16px 0 0}
.pricing-card-page small{display:block;color:#817b8d;font-size:11px;margin-top:16px}
.back{display:inline-flex;color:#b4acd0;text-decoration:none;font-size:13px;margin-bottom:10px}
.back:hover{color:#fff}

@media(max-width:850px){
  .hero-price{max-width:none}
  .pricing-preview,.pricing-page{grid-template-columns:1fr;padding-left:24px;padding-right:24px}
  .pricing-preview{margin-top:50px}
  .pricing-card-page{position:static}
  .price-line strong,.pricing-value strong{font-size:36px}
}

/* Pricing auth */
.auth-card{margin:22px 0 26px;padding:18px;border:1px solid #2d2539;border-radius:18px;background:#130f1b}
.auth-copy strong{display:block;font-size:15px;margin-bottom:6px}
.auth-copy p,.auth-status,.account-access{color:#938ca1;font-size:13px;line-height:1.6;margin:0}
.auth-status{margin-top:12px}
.discord-wrap{margin-top:16px}
.discord-login-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:260px;padding:14px 18px;border:1px solid #3e3561;border-radius:999px;background:#5865f2;color:#fff;font:inherit;font-size:14px;font-weight:700;cursor:pointer;box-shadow:0 12px 30px rgba(88,101,242,.28);transition:.18s}
.discord-login-button:hover{transform:translateY(-1px);background:#6b76f7}
.discord-login-button.is-disabled,.discord-login-button:disabled{cursor:not-allowed;opacity:.6;transform:none}
.discord-login-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.16);font-size:11px;font-weight:800;letter-spacing:.4px}
.account-panel{margin-top:16px;padding-top:16px;border-top:1px solid #241d2f}
.account-row{display:flex;align-items:center;gap:12px}
.account-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;flex-shrink:0}
.account-copy{display:flex;flex-direction:column;gap:4px;min-width:0}
.account-copy strong{font-size:14px}
.account-copy small{color:#938ca1;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.account-logout{margin-left:auto;background:none}
.account-access{margin-top:12px}
.download.is-disabled{pointer-events:none;opacity:.6}
@media(max-width:850px){
  .account-row{align-items:flex-start;flex-wrap:wrap}
  .account-logout{margin-left:0}
}