@charset "utf-8";

*, ::before, ::after { box-sizing: border-box; margin: 0px; padding: 0px; }

@media (max-width: 768px) {
  body { font-family: Roboto, sans-serif; background: var(--bg); color: var(--grey1); min-height: 100vh; padding-bottom: 40px; max-width: 430px; margin: 0px auto; }
}

.mob-fullscreen { width: 100%; background: var(--bg); box-sizing: border-box; }

.mob-fullscreen .breadcrumb { display: flex; padding: 12px 0px 0px 12px; align-items: center; gap: 6px; }

.mob-fullscreen .crumb-label { font-size: 16px; font-weight: 400; color: rgb(219, 219, 219); }

.mob-fullscreen .breadcrumb .arrow { display: inline-flex; align-items: center; }

.mob-fullscreen .breadcrumb .arrow svg { width: 8px; height: 10px; }

.mob-fullscreen .crumb-current { font-size: 16px; font-weight: 500; color: rgb(242, 242, 242); }

.mob-fullscreen .hero-banner { background: url("/assets/19bb15af60f7899f.png") center center / cover no-repeat; margin: 24px 12px; border-radius: 12px; aspect-ratio: 373 / 216; }

.mob-fullscreen .tabs-wrapper { position: sticky; top: 0px; z-index: 100; overflow-x: auto; scrollbar-width: none; background: rgba(23, 24, 34, 0.95); height: 48px; margin-bottom: 12px; }

.mob-fullscreen .tabs-wrapper::-webkit-scrollbar { display: none; }

.mob-fullscreen .tabs-inner { display: flex; width: max-content; height: 48px; gap: 16px; padding: 0px 16px; }

.mob-fullscreen a.tab-item, .mob-fullscreen a.tab-item:link, .mob-fullscreen a.tab-item:visited { height: 48px; display: flex; align-items: center; white-space: nowrap; font-size: 14px; font-weight: 500; cursor: pointer; border-bottom: 2px solid transparent; transition: color 0.2s, border-color 0.2s; color: rgb(219, 219, 219) !important; text-decoration: none !important; }

.mob-fullscreen a.tab-item.active { border-bottom-color: transparent; color: rgb(219, 219, 219) !important; text-decoration: none !important; }

.mob-fullscreen .page-content { display: flex; flex-direction: column; gap: 44px; padding: 0px 12px; }

.mob-fullscreen .section-panel { display: flex; flex-direction: column; align-items: stretch; gap: 4px; }

.mob-fullscreen .section-inner { display: flex; flex-direction: column; align-items: stretch; gap: 20px; }

.mob-fullscreen .section-title { color: rgb(255, 255, 255); line-height: normal; text-transform: uppercase; font-size: 16px !important; font-weight: 700 !important; }

.mob-fullscreen .about-title-block { display: flex; flex-direction: column; gap: 16px; }

.mob-fullscreen .about-subtitle { font-size: 16px; font-weight: 700; color: var(--grey1); line-height: normal; text-transform: uppercase; }

.mob-fullscreen .about-desc { font-size: 14px; font-weight: 400; color: rgb(219, 219, 219); line-height: 20px; }

.mob-fullscreen .stats-grid { display: flex; flex-direction: column; gap: 12px; }

.mob-fullscreen .stats-row { display: flex; gap: 12px; }

.mob-fullscreen .stat-card { flex: 1 1 0%; height: 80px; padding: 10px 16px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; background: rgba(47, 47, 48, 0.5); border: 1px solid var(--grey11); border-radius: 8px; box-shadow: rgba(254, 82, 1, 0.04) 0px 4px 100px 0px inset; }

.mob-fullscreen .stat-label { font-size: 12px; font-weight: 400; color: var(--grey6); text-align: center; text-transform: uppercase; }

.mob-fullscreen .stat-value { font-size: 20px; font-weight: 700; color: var(--color1); text-align: center; }

.mob-fullscreen .stat-sub { font-size: 12px; font-weight: 400; color: var(--grey6); text-align: center; }

.mob-fullscreen .section-header { display: flex; align-items: center; gap: 12px; }

.mob-fullscreen .section-header-label { font-size: 14px; font-weight: 700; color: rgb(254, 124, 0); white-space: nowrap; text-transform: uppercase; }

.mob-fullscreen .section-divider { flex: 1 1 0%; height: 1px; background: rgba(59, 59, 59, 0.4); }

.mob-fullscreen .bullet-list { display: flex; flex-direction: column; gap: 8px; }

.mob-fullscreen .bullet-item { display: flex; align-items: flex-start; gap: 8px; }

.mob-fullscreen .bullet-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--gradient-orange-dot); flex-shrink: 0; margin-top: 7px; }

.mob-fullscreen .bullet-text { font-size: 14px; font-weight: 400; color: var(--grey3); line-height: 20px; }

.mob-fullscreen .how-card { display: flex; flex-direction: column; align-items: stretch; gap: 20px; padding: 24px 16px; background: rgba(47, 47, 48, 0.5); border: 0.5px solid var(--color1); border-radius: 12px; box-shadow: rgba(254, 82, 1, 0.04) 0px 4px 200px 0px inset; }

.mob-fullscreen .steps-visual { display: flex; flex-direction: row; align-items: flex-start; width: 100%; }

.mob-fullscreen .step-col { flex: 1 1 0%; display: flex; flex-direction: column; align-items: center; gap: 8px; }

.mob-fullscreen .step-circle-inactive { width: 32px; height: 32px; border-radius: 20px; background: var(--gradient-black); border: 1px solid var(--grey8); display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 700; color: rgb(255, 255, 255); flex-shrink: 0; }

.mob-fullscreen .step-connector { flex-shrink: 0; width: 24px; height: 1px; background: var(--grey10); margin-top: 16px; }

.mob-fullscreen .step-title { font-size: 11px; font-weight: 600; color: var(--grey1); text-align: center; line-height: 1.3; }

.mob-fullscreen .step-title-inactive { color: var(--grey4); }

.mob-fullscreen .step-subtitle { font-size: 9px; font-weight: 500; color: var(--grey6); text-align: center; line-height: 1.3; }

.mob-fullscreen .cta-area { display: flex; flex-direction: column; align-items: center; gap: 8px; }

.mob-fullscreen .cta-btn { display: flex; padding: 8px 12px; justify-content: center; align-items: center; align-self: stretch; border-radius: 20px; background: linear-gradient(rgb(255, 153, 0) 0%, rgb(255, 42, 0) 100%); font-size: 14px; font-weight: 500; color: rgb(255, 255, 255); border-width: medium; border-style: none; border-color: currentcolor; border-image: none; cursor: pointer; transition: background 0.2s; }

.mob-fullscreen .cta-btn:hover { border-radius: var(--24, 24px); background: var(--Gradient, linear-gradient(180deg, #F90 0%, #FF2A00 100%)); box-shadow: rgba(0, 0, 0, 0.32) 0px 4px 24px 0px, rgba(254, 82, 1, 0.38) 0px 4px 24px 0px; }

.mob-fullscreen .terms-table { display: flex; flex-direction: column; gap: 4px; }

.mob-fullscreen .terms-row { display: flex; align-items: center; min-height: 48px; background: var(--surface); border: 1px solid var(--grey11); border-radius: 6px; }

.mob-fullscreen .terms-key { width: 160px; min-height: 48px; padding: 12px; display: flex; align-items: center; flex-shrink: 0; font-size: 14px; font-weight: 500; color: var(--grey4); line-height: normal; }

.mob-fullscreen .terms-val { flex: 1 1 0%; min-height: 48px; padding: 12px; display: flex; align-items: center; justify-content: flex-end; font-size: 14px; font-weight: 500; line-height: normal; text-align: right; }

.mob-fullscreen .terms-val.orange { color: var(--color1); }

.mob-fullscreen .terms-val.orange2 { color: var(--color2); }

.mob-fullscreen .terms-val.white { color: var(--grey1); }

.mob-fullscreen .other-promos-section { display: flex; flex-direction: column; gap: 12px; padding: 24px 12px 40px; }

.mob-fullscreen .other-promos-header { display: flex; justify-content: space-between; align-items: center; }

.mob-fullscreen .other-promos-title { color: rgb(255, 255, 255); text-transform: uppercase; font-size: 16px !important; font-weight: 700 !important; }

.mob-fullscreen .more-btn { display: flex; height: 32px; padding: 6px 16px; align-items: center; border-radius: 24px; background: rgb(32, 32, 32); cursor: pointer; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; }

.mob-fullscreen .more-label { font-size: 12px; font-weight: 500; color: rgb(254, 124, 0); }

.mob-fullscreen .promos-scroll { display: flex; gap: 12px; overflow-x: auto; scrollbar-width: none; }

.mob-fullscreen .promos-scroll::-webkit-scrollbar { display: none; }

.mob-fullscreen .promo-card { min-width: 216px; width: 216px; height: 125px; border-radius: 12px; flex-shrink: 0; background-size: cover; background-position: center center; background-repeat: no-repeat; }

.mob-fullscreen:has(#about:target) .tab-item[href="#about"], .mob-fullscreen:has(#how:target) .tab-item[href="#how"], .mob-fullscreen:has(#why:target) .tab-item[href="#why"], .mob-fullscreen:has(#terms:target) .tab-item[href="#terms"], .mob-fullscreen:has(#spins:target) .tab-item[href="#spins"] { border-bottom-color: transparent; color: rgb(219, 219, 219) !important; text-decoration: none !important; }

.mob-fullscreen:has(#how:target) .tab-item[href="#about"], .mob-fullscreen:has(#why:target) .tab-item[href="#about"], .mob-fullscreen:has(#terms:target) .tab-item[href="#about"], .mob-fullscreen:has(#spins:target) .tab-item[href="#about"] { border-bottom-color: transparent; color: rgb(219, 219, 219) !important; text-decoration: none !important; }

.mob-fullscreen .hero-banner, .mob-fullscreen .breadcrumb { display: none !important; }

.mob-fullscreen .promotion-details-info a { color: rgb(255, 255, 255); }