:root {
  font-size: 62.5%;
  --ui30-bg: #2C2C2C;
  --ui30-bg-soft: #3a3029;
  --ui30-panel: #4a3426;
  --ui30-panel-2: #5b4636;
  --ui30-primary: #FFB74D;
  --ui30-secondary: #CD853F;
  --ui30-accent: #A0522D;
  --ui30-muted: #8B7355;
  --ui30-text: #F8F9FA;
  --ui30-text-soft: #f5ddbd;
  --ui30-line: rgba(255, 183, 77, .28);
  --ui30-shadow: 0 1.4rem 3.2rem rgba(0, 0, 0, .32);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: radial-gradient(circle at 20% 0%, rgba(255,183,77,.24), transparent 30%), linear-gradient(160deg, #2C2C2C 0%, #3b281f 55%, #1f1f1f 100%);
  color: var(--ui30-text);
  font-family: 'Noto Sans Bengali', 'Hind Siliguri', system-ui, sans-serif;
  font-size: 1.6rem;
  line-height: 1.5rem;
  overflow-x: hidden;
}
a { color: var(--ui30-primary); text-decoration: none; }
img { max-width: 100%; display: block; }
button { font: inherit; }
.ui30-page {
  width: 100%;
  max-width: 430px;
  margin: 0 auto;
  min-height: 100vh;
  background: linear-gradient(180deg, rgba(44,44,44,.92), rgba(69,45,30,.96));
  box-shadow: var(--ui30-shadow);
}
.ui30-container { width: min(100% - 2.4rem, 406px); margin: 0 auto; }
.ui30-main { padding-top: 7.4rem; }
.ui30-header {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
  width: 100%;
  max-width: 430px;
  background: rgba(44, 44, 44, .94);
  border-bottom: .1rem solid var(--ui30-line);
  backdrop-filter: blur(1.4rem);
}
.ui30-topbar { min-height: 6.4rem; display: flex; align-items: center; gap: .8rem; padding: .8rem 1.2rem; }
.ui30-brand { display: flex; align-items: center; gap: .8rem; min-width: 0; margin-right: auto; color: var(--ui30-text); }
.ui30-logo { width: 3.2rem; height: 3.2rem; border-radius: 1rem; border: .1rem solid var(--ui30-primary); }
.ui30-brand-text { font-weight: 900; font-size: 1.7rem; white-space: nowrap; letter-spacing: .02em; }
.ui30-actions { display: flex; gap: .6rem; align-items: center; }
.ui30-btn {
  border: 0;
  border-radius: 999px;
  min-height: 4.4rem;
  min-width: 4.4rem;
  padding: .9rem 1.2rem;
  cursor: pointer;
  font-weight: 800;
  transition: transform .18s ease, filter .18s ease, background .18s ease;
}
.ui30-btn:active, .ui30-bottom-item:active, .ui30-game:active { transform: scale(.95); }
.ui30-btn-primary { background: linear-gradient(135deg, var(--ui30-primary), #ffe2a8); color: #2C2C2C; }
.ui30-btn-ghost { background: rgba(248,249,250,.1); color: var(--ui30-text); border: .1rem solid var(--ui30-line); }
.ui30-menu-btn { width: 4.4rem; padding: 0; display: grid; place-items: center; font-size: 2.2rem; }
.ui30-menu {
  position: fixed;
  top: 6.4rem;
  right: 1rem;
  z-index: 9999;
  width: min(31rem, calc(100% - 2rem));
  max-height: calc(100vh - 8rem);
  overflow-y: auto;
  padding: 1rem;
  border: .1rem solid var(--ui30-line);
  border-radius: 1.8rem;
  background: rgba(44, 44, 44, .98);
  box-shadow: var(--ui30-shadow);
  transform: translateY(-1rem) scale(.98);
  opacity: 0;
  pointer-events: none;
  transition: .2s ease;
}
.ui30-menu-open { transform: translateY(0) scale(1); opacity: 1; pointer-events: auto; }
.ui30-menu-link { display: flex; align-items: center; gap: .8rem; padding: 1.1rem; color: var(--ui30-text); border-radius: 1.2rem; }
.ui30-menu-link:hover, .ui30-nav-current { background: rgba(255,183,77,.16); color: var(--ui30-primary); }
.ui30-desktop-nav { display: none; }
.ui30-hero { padding: 1.4rem 0 0; }
.ui30-slider { position: relative; overflow: hidden; border-radius: 2.4rem; border: .1rem solid var(--ui30-line); background: var(--ui30-panel); }
.ui30-slide { display: none; position: relative; min-height: 19rem; cursor: pointer; }
.ui30-slide-active { display: block; }
.ui30-slide img { width: 100%; height: 20rem; object-fit: cover; opacity: .82; }
.ui30-slide-copy { position: absolute; inset: auto 1.2rem 1.2rem 1.2rem; padding: 1.2rem; border-radius: 1.6rem; background: rgba(44,44,44,.78); }
.ui30-slide-copy strong { display: block; color: var(--ui30-primary); font-size: 2.1rem; line-height: 2.4rem; }
.ui30-slider-controls { display: flex; justify-content: center; gap: .6rem; padding: .8rem; }
.ui30-dot { width: .9rem; height: .9rem; border-radius: 50%; border: 0; background: var(--ui30-muted); }
.ui30-dot-active { width: 2.2rem; border-radius: 1rem; background: var(--ui30-primary); }
.ui30-section { padding: 1.4rem 0; }
.ui30-section-title { margin: 0 0 1rem; font-size: 2.2rem; line-height: 2.8rem; color: var(--ui30-primary); }
.ui30-lead { color: var(--ui30-text-soft); line-height: 2.4rem; }
.ui30-card { background: linear-gradient(145deg, rgba(255,183,77,.12), rgba(160,82,45,.2)); border: .1rem solid var(--ui30-line); border-radius: 2rem; padding: 1.4rem; margin: 1rem 0; }
.ui30-card h3 { margin: 0 0 .8rem; color: #ffe2a8; line-height: 2.3rem; }
.ui30-card p, .ui30-card li { line-height: 2.4rem; color: var(--ui30-text-soft); }
.ui30-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.ui30-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; }
.ui30-game { min-height: 9.4rem; padding: .8rem; border-radius: 1.4rem; background: rgba(248,249,250,.07); border: .1rem solid rgba(255,183,77,.18); text-align: center; color: var(--ui30-text); transition: .18s ease; }
.ui30-game:hover { border-color: var(--ui30-primary); background: rgba(255,183,77,.12); }
.ui30-game img { width: 5.2rem; height: 5.2rem; object-fit: cover; margin: 0 auto .5rem; border-radius: 1.2rem; }
.ui30-game span { display: block; font-size: 1.2rem; line-height: 1.5rem; font-weight: 800; }
.ui30-kicker { display: inline-flex; gap: .5rem; align-items: center; padding: .5rem .9rem; border-radius: 999px; color: #2C2C2C; background: var(--ui30-primary); font-weight: 900; }
.ui30-promo-link { color: var(--ui30-primary); font-weight: 900; text-decoration: underline; cursor: pointer; }
.ui30-cta-row { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1rem; }
.ui30-stat-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; }
.ui30-stat { padding: 1rem; border-radius: 1.4rem; background: rgba(44,44,44,.42); border: .1rem solid var(--ui30-line); }
.ui30-stat strong { color: var(--ui30-primary); font-size: 2rem; display: block; line-height: 2.4rem; }
.ui30-steps { counter-reset: ui30-step; padding: 0; margin: 0; list-style: none; }
.ui30-step { counter-increment: ui30-step; display: flex; gap: 1rem; margin: 1rem 0; align-items: flex-start; }
.ui30-step::before { content: counter(ui30-step); flex: 0 0 3rem; height: 3rem; display: grid; place-items: center; border-radius: 50%; background: var(--ui30-primary); color: #2C2C2C; font-weight: 900; }
.ui30-footer { padding: 2rem 0 8.4rem; border-top: .1rem solid var(--ui30-line); background: rgba(0,0,0,.16); }
.ui30-footer-links { display: flex; flex-wrap: wrap; gap: .8rem; margin: 1rem 0; }
.ui30-footer-link { padding: .8rem 1rem; border: .1rem solid var(--ui30-line); border-radius: 999px; color: var(--ui30-text-soft); }
.ui30-partners { display: flex; gap: .8rem; flex-wrap: wrap; margin: 1rem 0; }
.ui30-partner { padding: .7rem 1rem; border-radius: .9rem; background: rgba(255,255,255,.08); color: var(--ui30-primary); font-weight: 800; }
.ui30-bottom-nav {
  position: fixed;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  z-index: 1000;
  width: 100%;
  max-width: 430px;
  height: 6.2rem;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background: #2C2C2C;
  border-top: .1rem solid var(--ui30-line);
  box-shadow: 0 -.8rem 2rem rgba(0,0,0,.28);
}
.ui30-bottom-item { min-width: 6rem; min-height: 6rem; border: 0; background: transparent; color: var(--ui30-text-soft); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .2rem; cursor: pointer; transition: .18s ease; }
.ui30-bottom-item i, .ui30-bottom-item ion-icon, .ui30-bottom-item .material-icons { font-size: 2.3rem; line-height: 2.6rem; }
.ui30-bottom-item span { font-size: 1.1rem; line-height: 1.2rem; font-weight: 800; }
.ui30-bottom-item:hover, .ui30-bottom-item.ui30-nav-current { color: var(--ui30-primary); transform: translateY(-.2rem); }
.ui30-badge { position: absolute; margin: -3.2rem 0 0 2.4rem; min-width: 1.7rem; height: 1.7rem; border-radius: 999px; background: #ff4d4d; color: white; font-size: 1rem; display: grid; place-items: center; }
.ui30-table { width: 100%; border-collapse: collapse; overflow: hidden; border-radius: 1.4rem; }
.ui30-table th, .ui30-table td { padding: .9rem; border-bottom: .1rem solid rgba(255,183,77,.16); text-align: left; line-height: 2rem; }
.ui30-table th { color: var(--ui30-primary); }
.ui30-review { display: flex; gap: 1rem; align-items: flex-start; }
.ui30-avatar { width: 4rem; height: 4rem; border-radius: 50%; background: linear-gradient(135deg, var(--ui30-primary), var(--ui30-accent)); display: grid; place-items: center; color: #2C2C2C; font-weight: 900; }
.ui30-note { border-left: .4rem solid var(--ui30-primary); padding: 1rem; background: rgba(255,183,77,.1); border-radius: 0 1.2rem 1.2rem 0; }
@media (min-width: 769px) {
  .ui30-bottom-nav { display: none; }
  .ui30-page, .ui30-header { max-width: 1000px; }
  .ui30-container { width: min(100% - 4rem, 960px); }
  .ui30-desktop-nav { display: flex; gap: 1rem; align-items: center; }
  .ui30-menu-btn { display: none; }
  .ui30-main { padding-top: 7.2rem; }
  .ui30-grid-3 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .ui30-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ui30-footer { padding-bottom: 2rem; }
}
@media (max-width: 768px) {
  .ui30-main { padding-bottom: 8rem; }
}