:root {
  font-size: 62.5%;
  --we456-primary: #E0FFFF;
  --we456-secondary: #FFEBCD;
  --we456-bg: #0F0F23;
  --we456-panel: #171734;
  --we456-card: #202049;
  --we456-accent: #39ffb6;
  --we456-gold: #ffd166;
  --we456-coral: #ff6b8a;
  --we456-text: #f6ffff;
  --we456-muted: #b8c8d8;
  --we456-line: rgba(224, 255, 255, .16);
  --we456-shadow: 0 1.8rem 4rem rgba(0, 0, 0, .38);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background:
    radial-gradient(circle at top left, rgba(57,255,182,.16), transparent 30rem),
    radial-gradient(circle at 85% 12%, rgba(255,209,102,.16), transparent 24rem),
    linear-gradient(180deg, #0F0F23 0%, #11112b 52%, #080814 100%);
  color: var(--we456-text);
  font-family: "Noto Sans Bengali", "Hind Siliguri", system-ui, sans-serif;
  font-size: 1.55rem;
  line-height: 1.5rem;
  overflow-x: hidden;
}
a { color: var(--we456-primary); text-decoration: none; }
img { max-width: 100%; display: block; }
button { font-family: inherit; }
main { padding-top: 8.2rem; }
.we456-page { max-width: 430px; margin: 0 auto; min-height: 100vh; position: relative; }
.we456-container { width: min(100%, 430px); margin: 0 auto; padding: 0 1.4rem; }
.we456-wrapper { padding: 1.2rem 0; }
.we456-grid { display: grid; gap: 1.2rem; }
.we456-header {
  position: fixed; top: 0; left: 50%; transform: translateX(-50%); z-index: 1000;
  width: min(100%, 430px); background: rgba(15,15,35,.94); backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--we456-line); box-shadow: 0 .8rem 2.2rem rgba(0,0,0,.3);
}
.we456-headbar { display: flex; align-items: center; gap: .8rem; min-height: 6.8rem; padding: .8rem 1rem; }
.we456-brand { display: flex; align-items: center; gap: .8rem; min-width: 0; flex: 1; color: var(--we456-text); font-weight: 900; }
.we456-logo { width: 3.2rem; height: 3.2rem; border-radius: 1rem; box-shadow: 0 0 0 .2rem rgba(224,255,255,.14); }
.we456-brand-text { display: flex; flex-direction: column; line-height: 1.05; }
.we456-brand-name { font-size: 1.7rem; letter-spacing: .02em; }
.we456-brand-sub { font-size: 1.05rem; color: var(--we456-secondary); font-weight: 600; }
.we456-actions { display: flex; align-items: center; gap: .55rem; }
.we456-btn {
  border: 0; min-height: 4.4rem; min-width: 4.4rem; border-radius: 1.4rem; cursor: pointer;
  color: #09091a; font-weight: 900; background: linear-gradient(135deg, var(--we456-accent), var(--we456-primary));
  box-shadow: 0 .8rem 1.8rem rgba(57,255,182,.2); transition: transform .18s ease, filter .18s ease;
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: 0 1.1rem;
}
.we456-btn:hover, .we456-btn:focus { transform: translateY(-.1rem) scale(1.02); filter: brightness(1.08); }
.we456-btn-alt { background: linear-gradient(135deg, var(--we456-gold), var(--we456-secondary)); color: #201405; }
.we456-btn-small { min-height: 3.8rem; min-width: auto; font-size: 1.2rem; padding: 0 .9rem; }
.we456-menu-btn { width: 4.4rem; padding: 0; background: linear-gradient(135deg, #232352, #34346e); color: var(--we456-primary); }
.we456-menu {
  position: fixed; inset: 0; z-index: 9999; width: min(100%, 430px); margin: 0 auto;
  background: rgba(8,8,20,.96); transform: translateY(-105%); transition: transform .28s ease;
  padding: 8rem 1.4rem 2rem; overflow-y: auto;
}
.we456-menu-active { transform: translateY(0); }
.we456-menu-panel { background: linear-gradient(180deg, #171734, #101026); border: 1px solid var(--we456-line); border-radius: 2.2rem; padding: 1.4rem; box-shadow: var(--we456-shadow); }
.we456-menu-title { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; color: var(--we456-secondary); font-weight: 900; }
.we456-menu-links { display: grid; gap: .8rem; }
.we456-menu-links a { display: flex; align-items: center; gap: .8rem; min-height: 4.6rem; padding: .9rem 1rem; border-radius: 1.4rem; background: rgba(224,255,255,.06); color: var(--we456-text); font-weight: 800; }
.we456-menu-links i, .we456-menu-links span.material-icons { color: var(--we456-accent); font-size: 2.2rem; }
.we456-card { background: linear-gradient(180deg, rgba(32,32,73,.96), rgba(20,20,48,.96)); border: 1px solid var(--we456-line); border-radius: 2rem; padding: 1.5rem; box-shadow: var(--we456-shadow); }
.we456-hero { padding: 1rem 0 0; }
.we456-slider { position: relative; overflow: hidden; border-radius: 2.4rem; border: 1px solid rgba(255,235,205,.18); min-height: 17rem; background: #171734; }
.we456-slide { display: none; position: relative; min-height: 17rem; cursor: pointer; }
.we456-slide-active { display: block; animation: we456Fade .5s ease; }
.we456-slide img { width: 100%; height: 17rem; object-fit: cover; opacity: .78; }
.we456-slide-copy { position: absolute; inset: auto 1.2rem 1.2rem 1.2rem; padding: 1rem; border-radius: 1.6rem; background: rgba(15,15,35,.72); backdrop-filter: blur(8px); }
.we456-slide-copy strong { display: block; color: var(--we456-secondary); font-size: 1.7rem; margin-bottom: .3rem; }
.we456-dots { position: absolute; right: 1.2rem; top: 1.2rem; display: flex; gap: .5rem; }
.we456-dot { width: .9rem; height: .9rem; border-radius: 50%; border: 0; background: rgba(255,255,255,.42); padding: 0; }
.we456-dot-active { background: var(--we456-accent); width: 2rem; border-radius: 1rem; }
.we456-title { font-size: 2.8rem; line-height: 1.15; margin: 1.4rem 0 .8rem; color: var(--we456-primary); letter-spacing: -.02em; }
.we456-subtitle { color: var(--we456-muted); margin: 0 0 1rem; line-height: 1.7; }
.we456-section { margin: 1.4rem 0; }
.we456-section-title { font-size: 2.1rem; line-height: 1.25; margin: 0 0 1rem; color: var(--we456-secondary); }
.we456-section-kicker { display: inline-flex; align-items: center; gap: .5rem; color: var(--we456-accent); font-weight: 900; font-size: 1.2rem; text-transform: uppercase; letter-spacing: .08em; margin-bottom: .7rem; }
.we456-promo-link { color: var(--we456-gold); font-weight: 900; text-decoration: underline; text-decoration-thickness: .15rem; cursor: pointer; }
.we456-internal { color: var(--we456-primary); font-weight: 800; border-bottom: 1px dashed rgba(224,255,255,.5); }
.we456-game-category { margin: 1.6rem 0; }
.we456-category-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .9rem; }
.we456-category-head h2 { margin: 0; font-size: 1.9rem; color: var(--we456-secondary); }
.we456-category-count { color: var(--we456-accent); font-size: 1.15rem; font-weight: 900; }
.we456-game-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem; }
.we456-game { min-width: 0; text-align: center; color: var(--we456-text); }
.we456-game img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 1.2rem; border: 1px solid rgba(224,255,255,.14); background: #0f0f23; box-shadow: 0 .7rem 1.4rem rgba(0,0,0,.28); }
.we456-game span { display: block; margin-top: .45rem; font-size: 1.08rem; line-height: 1.25; font-weight: 800; min-height: 2.8rem; }
.we456-split { display: grid; gap: 1rem; }
.we456-stat-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .9rem; }
.we456-stat { padding: 1rem; border-radius: 1.6rem; background: rgba(224,255,255,.07); border: 1px solid var(--we456-line); }
.we456-stat strong { display: block; color: var(--we456-accent); font-size: 2rem; line-height: 1.2; }
.we456-badge-row { display: flex; flex-wrap: wrap; gap: .7rem; }
.we456-badge { display: inline-flex; align-items: center; min-height: 3.2rem; padding: .5rem .9rem; border-radius: 999px; color: #0f0f23; background: var(--we456-secondary); font-weight: 900; font-size: 1.2rem; }
.we456-step { display: grid; grid-template-columns: 3.6rem 1fr; gap: 1rem; margin: 1rem 0; }
.we456-step-num { width: 3.6rem; height: 3.6rem; border-radius: 1.2rem; display: grid; place-items: center; background: var(--we456-accent); color: #0f0f23; font-weight: 900; }
.we456-review { border-left: .4rem solid var(--we456-gold); padding: .9rem 1rem; background: rgba(255,235,205,.06); border-radius: 0 1.4rem 1.4rem 0; margin: .8rem 0; }
.we456-payment { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; }
.we456-pay { min-height: 4.4rem; display: grid; place-items: center; border-radius: 1.3rem; background: rgba(57,255,182,.1); border: 1px solid rgba(57,255,182,.18); font-weight: 900; }
.we456-winner { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: .8rem 0; border-bottom: 1px solid var(--we456-line); }
.we456-footer { margin-top: 2rem; padding: 2rem 1.4rem 8.4rem; background: #090917; border-top: 1px solid var(--we456-line); }
.we456-footer-logo { display: flex; align-items: center; gap: .8rem; color: var(--we456-secondary); font-weight: 900; margin-bottom: 1rem; }
.we456-footer-logo img { width: 3rem; height: 3rem; border-radius: .9rem; }
.we456-footer-buttons { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem; margin: 1.2rem 0; }
.we456-footer-links { display: flex; flex-wrap: wrap; gap: .8rem 1.2rem; margin: 1rem 0; }
.we456-footer-links a { color: var(--we456-muted); font-size: 1.25rem; font-weight: 700; }
.we456-partners { display: flex; gap: .7rem; flex-wrap: wrap; margin: 1rem 0; }
.we456-partner { padding: .5rem .8rem; border-radius: .8rem; background: rgba(255,255,255,.08); color: var(--we456-primary); font-size: 1.1rem; font-weight: 800; }
.we456-copy { color: var(--we456-muted); font-size: 1.15rem; }
.we456-bottom-nav {
  position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 1000;
  width: min(100%, 430px); height: 6.2rem; display: flex; justify-content: space-around; align-items: center;
  background: #12122e; border-top: 1px solid rgba(224,255,255,.22); box-shadow: 0 -1rem 2.4rem rgba(0,0,0,.42);
}
.we456-bottom-item { min-width: 6rem; min-height: 6rem; border: 0; background: transparent; color: var(--we456-muted); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .25rem; font-size: 1.05rem; font-weight: 900; cursor: pointer; transition: transform .16s ease, color .16s ease; position: relative; }
.we456-bottom-item i, .we456-bottom-item ion-icon, .we456-bottom-item .material-icons, .we456-bottom-item svg { font-size: 2.35rem; width: 2.6rem; height: 2.6rem; }
.we456-bottom-item:active { transform: scale(.92); }
.we456-bottom-active { color: var(--we456-accent); }
.we456-bottom-active::before { content: ""; position: absolute; top: .35rem; width: 2.8rem; height: .25rem; border-radius: 999px; background: var(--we456-accent); }
.we456-bonus-dot { position: absolute; top: .7rem; right: 1.5rem; width: .85rem; height: .85rem; border-radius: 50%; background: var(--we456-coral); box-shadow: 0 0 0 .3rem rgba(255,107,138,.22); }
.we456-faq-item { margin: 1rem 0; padding: 1rem; border-radius: 1.4rem; background: rgba(224,255,255,.06); }
.we456-faq-item h3 { margin: 0 0 .6rem; color: var(--we456-secondary); font-size: 1.55rem; line-height: 1.35; }
.we456-cta-band { padding: 1.4rem; border-radius: 2rem; background: linear-gradient(135deg, rgba(57,255,182,.2), rgba(255,209,102,.16)); border: 1px solid rgba(255,235,205,.2); text-align: center; }
.we456-cta-band h2 { margin-top: 0; color: var(--we456-primary); }
@keyframes we456Fade { from { opacity: .35; transform: scale(1.02); } to { opacity: 1; transform: scale(1); } }
@media (min-width: 769px) {
  .we456-bottom-nav { display: none; }
  .we456-footer { padding-bottom: 2rem; }
}
@media (max-width: 768px) {
  main { padding-bottom: 8rem; }
}
@media (max-width: 360px) {
  .we456-actions .we456-btn-small { padding: 0 .7rem; font-size: 1.1rem; }
  .we456-game-grid { gap: .6rem; }
  .we456-game span { font-size: 1rem; }
}