/* fa99.homes - Core CSS - English comments only */
/* All custom classes use prefix: ui80- */
/* Palette: #FFBF00 | #FFA500 | #E6E6FA | #0F0F23 | #9400D3 */

:root{
  --ui80-primary:#FFBF00;
  --ui80-accent:#FFA500;
  --ui80-violet:#9400D3;
  --ui80-lav:#E6E6FA;
  --ui80-bg:#0F0F23;
  --ui80-bg2:#15152e;
  --ui80-card:#1c1c3a;
  --ui80-text:#E6E6FA;
  --ui80-muted:#a9a9c8;
  --ui80-line:rgba(255,191,0,.18);
}

*{box-sizing:border-box;margin:0;padding:0}
html{font-size:62.5%}
body{
  font-family:'Segoe UI','Noto Sans Bengali',system-ui,sans-serif;
  background:var(--ui80-bg);
  color:var(--ui80-text);
  line-height:1.5rem;
  font-size:1.5rem;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:var(--ui80-primary);text-decoration:none}
img{max-width:100%;display:block}

.ui80-container{max-width:430px;margin:0 auto;padding:0 1.2rem;width:100%}
.ui80-wrapper{min-height:100vh;max-width:430px;margin:0 auto;background:var(--ui80-bg);position:relative}

/* ===== Header ===== */
.ui80-header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  background:linear-gradient(90deg,#0F0F23 0%,#1a1030 100%);
  border-bottom:2px solid var(--ui80-primary);
  box-shadow:0 .3rem .8rem rgba(0,0,0,.4);
}
.ui80-header-inner{
  max-width:430px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;
  padding:.7rem 1rem;gap:.6rem;
}
.ui80-logo{display:flex;align-items:center;gap:.5rem;color:var(--ui80-primary);font-weight:800;font-size:1.8rem}
.ui80-logo img{width:28px;height:28px;border-radius:.4rem}
.ui80-logo .ui80-sitename{background:linear-gradient(90deg,#FFBF00,#FFA500);-webkit-background-clip:text;background-clip:text;color:transparent}
.ui80-header-actions{display:flex;align-items:center;gap:.5rem}
.ui80-menu-btn{
  background:transparent;border:1px solid var(--ui80-line);color:var(--ui80-primary);
  width:3.4rem;height:3.4rem;border-radius:.5rem;font-size:1.6rem;cursor:pointer;
}
.ui80-btn{
  border:none;border-radius:.55rem;padding:.65rem 1.1rem;font-size:1.35rem;font-weight:700;
  cursor:pointer;min-height:3.4rem;line-height:1;transition:transform .15s,filter .15s;
}
.ui80-btn:active{transform:scale(.96)}
.ui80-btn-register{background:linear-gradient(90deg,#FFBF00,#FFA500);color:#0F0F23}
.ui80-btn-login{background:transparent;border:1.5px solid var(--ui80-violet);color:var(--ui80-lav)}
.ui80-btn-register:hover{filter:brightness(1.08)}
.ui80-btn-login:hover{background:rgba(148,0,211,.15)}

/* ===== Mobile expandable menu ===== */
.ui80-mobile-menu{
  max-height:0;overflow:hidden;transition:max-height .3s ease;
  background:#11112a;border-bottom:1px solid var(--ui80-line);
}
.ui80-mobile-menu.ui80-menu-open{max-height:60rem}
.ui80-mobile-menu-inner{max-width:430px;margin:0 auto;padding:.4rem 1rem 1rem;display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.ui80-mobile-menu-inner a{
  display:block;padding:.7rem .8rem;border-radius:.5rem;background:var(--ui80-card);
  color:var(--ui80-lav);font-size:1.3rem;border:1px solid var(--ui80-line);
}
.ui80-mobile-menu-inner a:hover{color:var(--ui80-primary);border-color:var(--ui80-primary)}

/* ===== Hero / Carousel ===== */
.ui80-main{padding-top:6.2rem}
.ui80-hero{position:relative;margin:.9rem 0 1.2rem;border-radius:1rem;overflow:hidden;border:1px solid var(--ui80-line)}
.ui80-slides{position:relative;height:18rem}
.ui80-slide{
  position:absolute;inset:0;opacity:0;transition:opacity .6s;cursor:pointer;
}
.ui80-slide.ui80-slide-active{opacity:1}
.ui80-slide img{width:100%;height:100%;object-fit:cover}
.ui80-slide-overlay{
  position:absolute;left:0;right:0;bottom:0;padding:1rem 1.2rem;
  background:linear-gradient(0deg,rgba(15,15,35,.9),transparent);
}
.ui80-slide-overlay h2{font-size:1.7rem;color:var(--ui80-primary);margin-bottom:.3rem}
.ui80-slide-overlay p{font-size:1.2rem;color:var(--ui80-lav)}
.ui80-slide-dots{position:absolute;bottom:.8rem;right:1rem;display:flex;gap:.4rem}
.ui80-slide-dots span{width:.7rem;height:.7rem;border-radius:50%;background:rgba(230,230,250,.4)}
.ui80-slide-dots span.ui80-dot-active{background:var(--ui80-primary)}

/* ===== Promo banner ===== */
.ui80-promo-strip{
  display:flex;gap:.5rem;overflow-x:auto;padding:.4rem 0;margin-bottom:.6rem;
  scrollbar-width:none;
}
.ui80-promo-strip::-webkit-scrollbar{display:none}
.ui80-chip{
  flex:0 0 auto;padding:.45rem 1rem;border-radius:2rem;font-size:1.2rem;font-weight:600;
  background:var(--ui80-card);color:var(--ui80-lav);border:1px solid var(--ui80-line);cursor:pointer;
}
.ui80-chip-active{background:linear-gradient(90deg,#9400D3,#FFA500);color:#fff;border-color:transparent}

/* ===== Section titles ===== */
.ui80-sec-title{
  font-size:1.8rem;font-weight:800;margin:1.4rem 0 .8rem;
  display:flex;align-items:center;gap:.5rem;color:#fff;
}
.ui80-sec-title i,.ui80-sec-title .material-icons-outlined{color:var(--ui80-primary)}
.ui80-sec-sub{font-size:1.25rem;color:var(--ui80-muted);margin-bottom:.8rem}

/* ===== Game grid ===== */
.ui80-games-block{margin-bottom:1.4rem}
.ui80-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;
}
.ui80-game-card{
  background:var(--ui80-card);border:1px solid var(--ui80-line);border-radius:.7rem;
  overflow:hidden;cursor:pointer;transition:transform .15s,border-color .15s;text-align:center;
}
.ui80-game-card:active{transform:scale(.95)}
.ui80-game-card:hover{border-color:var(--ui80-primary)}
.ui80-game-card img{width:100%;aspect-ratio:1;object-fit:cover;background:#000}
.ui80-game-card .ui80-game-name{
  font-size:1.05rem;color:var(--ui80-lav);padding:.4rem .25rem .5rem;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.ui80-game-card:hover .ui80-game-name{color:var(--ui80-primary)}

/* ===== Cards / modules ===== */
.ui80-card{
  background:var(--ui80-card);border:1px solid var(--ui80-line);border-radius:.9rem;
  padding:1.1rem;margin-bottom:1rem;
}
.ui80-card h3{font-size:1.5rem;color:var(--ui80-primary);margin-bottom:.5rem}
.ui80-card p{font-size:1.25rem;color:var(--ui80-lav);margin-bottom:.6rem}
.ui80-card .ui80-inline-link{color:var(--ui80-primary);font-weight:700;cursor:pointer}
.ui80-list{list-style:none;padding:0}
.ui80-list li{padding:.5rem 0 .5rem 1.6rem;position:relative;font-size:1.25rem;color:var(--ui80-lav);border-bottom:1px dashed var(--ui80-line)}
.ui80-list li::before{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:0;color:var(--ui80-accent);font-size:1rem}

/* RTP compact bars */
.ui80-rtp-row{display:flex;align-items:center;gap:.6rem;margin-bottom:.5rem}
.ui80-rtp-name{flex:0 0 9rem;font-size:1.15rem;color:var(--ui80-lav)}
.ui80-rtp-bar{flex:1;height:.7rem;background:#2a2a4a;border-radius:.4rem;overflow:hidden}
.ui80-rtp-fill{height:100%;background:linear-gradient(90deg,#FFA500,#FFBF00)}
.ui80-rtp-val{flex:0 0 4rem;text-align:right;font-size:1.15rem;color:var(--ui80-primary);font-weight:700}

/* Testimonials */
.ui80-testi{background:var(--ui80-card);border:1px solid var(--ui80-line);border-radius:.7rem;padding:.9rem;margin-bottom:.6rem}
.ui80-testi .ui80-stars{color:var(--ui80-primary);font-size:1.1rem;margin-bottom:.3rem}
.ui80-testi p{font-size:1.2rem;color:var(--ui80-lav);margin-bottom:.3rem}
.ui80-testi .ui80-author{font-size:1.1rem;color:var(--ui80-muted)}

/* Winners */
.ui80-winner{display:flex;justify-content:space-between;align-items:center;padding:.55rem .2rem;border-bottom:1px dashed var(--ui80-line);font-size:1.2rem}
.ui80-winner span:first-child{color:var(--ui80-lav)}
.ui80-winner .ui80-amount{color:var(--ui80-primary);font-weight:700}

/* Payment chips */
.ui80-pay{display:flex;flex-wrap:wrap;gap:.5rem}
.ui80-pay span{background:#222244;border:1px solid var(--ui80-line);border-radius:.5rem;padding:.5rem .9rem;font-size:1.15rem;color:var(--ui80-lav)}

/* CTA blocks */
.ui80-cta{
  background:linear-gradient(120deg,#9400D3,#FFA500);border-radius:1rem;padding:1.2rem;text-align:center;margin:1rem 0;
}
.ui80-cta h3{color:#fff;font-size:1.6rem;margin-bottom:.4rem}
.ui80-cta p{color:#fff;font-size:1.2rem;margin-bottom:.7rem}
.ui80-cta .ui80-btn{background:#fff;color:#9400D3}

/* App download CTA */
.ui80-appcta{display:flex;gap:1rem;align-items:center;background:var(--ui80-card);border:1px solid var(--ui80-line);border-radius:.9rem;padding:1rem;margin-bottom:1rem}
.ui80-appcta .ui80-app-icon{font-size:3rem;color:var(--ui80-primary)}
.ui80-appcta h3{font-size:1.5rem;color:var(--ui80-primary);margin-bottom:.3rem}
.ui80-appcta p{font-size:1.2rem;color:var(--ui80-lav);margin-bottom:.6rem}

/* Promo link text */
.ui80-promo-text{color:var(--ui80-primary);font-weight:700;cursor:pointer;border-bottom:1px dashed var(--ui80-primary)}

/* ===== Footer ===== */
.ui80-footer{
  background:#0a0a1c;border-top:2px solid var(--ui80-primary);padding:1.4rem 1.2rem 2.4rem;margin-top:1.5rem;
}
.ui80-footer p{font-size:1.2rem;color:var(--ui80-muted);line-height:1.7rem;margin-bottom:.8rem}
.ui80-footer-links{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:1rem}
.ui80-footer-links a{font-size:1.15rem;color:var(--ui80-lav);padding:.4rem 0;border-bottom:1px solid var(--ui80-line)}
.ui80-footer-links a:hover{color:var(--ui80-primary)}
.ui80-footer-promos{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}
.ui80-footer-promos .ui80-btn{flex:0 0 auto;font-size:1.15rem;padding:.5rem .8rem;min-height:auto}
.ui80-copy{font-size:1.1rem;color:var(--ui80-muted);text-align:center;border-top:1px solid var(--ui80-line);padding-top:.8rem}

/* ===== Mobile bottom nav ===== */
.ui80-bottomnav{
  position:fixed;bottom:0;left:0;right:0;z-index:1000;height:62px;
  background:linear-gradient(180deg,#15152e,#0a0a1c);border-top:2px solid var(--ui80-primary);
  display:flex;justify-content:space-around;align-items:stretch;
}
.ui80-bottomnav-inner{max-width:430px;margin:0 auto;display:flex;justify-content:space-around;width:100%}
.ui80-navbtn{
  flex:1;min-width:60px;min-height:60px;background:transparent;border:none;color:var(--ui80-lav);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15rem;
  font-size:1.05rem;cursor:pointer;position:relative;transition:color .15s;
}
.ui80-navbtn i,.ui80-navbtn .material-icons-outlined{font-size:23px}
.ui80-navbtn .ui80-nav-label{font-size:1rem}
.ui80-navbtn:active{transform:scale(.9)}
.ui80-navbtn.ui80-nav-active{color:var(--ui80-primary)}
.ui80-navbtn.ui80-nav-active::before{content:"";position:absolute;top:0;left:25%;right:25%;height:3px;background:var(--ui80-primary);border-radius:0 0 .3rem .3rem}
.ui80-navbtn.ui80-nav-promo{color:var(--ui80-accent)}
.ui80-navbtn:hover{color:var(--ui80-primary)}

/* Desktop: hide bottom nav */
@media (min-width:769px){
  .ui80-bottomnav{display:none}
  .ui80-wrapper,.ui80-header-inner,.ui80-mobile-menu-inner,.ui80-bottomnav-inner{max-width:760px}
}

/* Mobile bottom padding clearance */
@media (max-width:768px){
  main.ui80-main{padding-bottom:80px}
  .ui80-wrapper{padding-bottom:70px}
}

/* Reveal animation */
.ui80-reveal{opacity:0;transform:translateY(18px);transition:opacity .5s,transform .5s}
.ui80-revealed{opacity:1;transform:none}