.page-game-bai{--bg-color:#0A0A0A;--card-bg-color:#111111;--main-text-color:#FFF6D6;--button-bg:linear-gradient(180deg, #FFD86A 0%, #DDA11D 100%);--border-color:#3A2A12;--glow-color:#FFD36B;--heading-color:#F2C14E; color:var(--main-text-color); background-color:var(--bg-color); font-family:'Segoe UI',Roboto,Helvetica,Arial,sans-serif; line-height:1.6;}
.page-game-bai__hero-section{display:flex; flex-direction:column; align-items:center; gap:16px; padding:16px 16px 0; max-width:1200px; margin:0 auto;}
.page-game-bai__hero-image-wrapper{width:100%; max-width:1200px;}
.page-game-bai__hero-image{width:100%; height:auto; aspect-ratio:17/6; object-fit:cover; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.5);}
.page-game-bai__hero-content{text-align:center; width:100%; max-width:800px; padding-bottom:8px;}
.page-game-bai__hero-title{ color:var(--heading-color); font-weight:800; line-height:1.3; letter-spacing:0.5px; max-width:100%; text-shadow:0 2px 4px rgba(0,0,0,0.5);}
.page-game-bai__hero-description{ margin-bottom:24px; max-width:65ch; margin-left:auto;margin-right:auto; color:var(--main-text-color);}
.page-game-bai__hero-buttons{display:flex; gap:16px; flex-wrap:wrap; justify-content:center; width:100%; max-width:100%; box-sizing:border-box;}
.page-game-bai__button{ display:inline-block; padding:14px 36px; border-radius:50px; font-weight:700; text-decoration:none; border:none; cursor:pointer; transition:transform .2s ease, box-shadow .2s ease, color .2s; box-sizing:border-box; max-width:100%; white-space:normal; word-wrap:break-word; text-align:center;}
.page-game-bai__button--primary{ background:var(--button-bg); color:var(--bg-color); box-shadow:0 4px 15px rgba(255,211,107,0.3);}
.page-game-bai__button--secondary{ background:transparent; color:var(--heading-color); border:2px solid var(--heading-color);}
.page-game-bai__button--primary:hover,.page-game-bai__button--secondary:hover{transform:translateY(-3px); box-shadow:0 6px 20px 0 var(--glow-color);}
.page-game-bai__button--secondary:hover{background:var(--heading-color); color:var(--bg-color);}
.page-game-bai__games-section{padding:60px 20px; max-width:1200px; margin:0 auto;}
.page-game-bai__section-title{ text-align:center; font-size:clamp(1.8rem, 4vw, 2.5rem); margin-bottom:16px; color:var(--heading-color); font-weight:800;}
.page-game-bai__section-subtitle{ text-align:center; max-width: 70ch; margin: 0 auto 40px; color:var(--main-text-color);}
.page-game-bai__games-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:20px;}
.page-game-bai__game-card{background-color:var(--card-bg-color); border:1px solid var(--border-color); border-radius:12px; overflow:hidden; text-decoration:none; color:var(--main-text-color); display:flex; flex-direction:column; transition:transform .3s ease, box-shadow .3s ease;}
.page-game-bai__game-card:hover{transform:translateY(-5px); box-shadow:0 10px 30px -5px var(--glow-color);}
.page-game-bai__game-image{width:100%; aspect-ratio:16/9; object-fit:cover; display:block;}
.page-game-bai__game-info{padding:20px; flex-grow:1; display:flex; flex-direction:column; gap:10px;}
.page-game-bai__game-name{color:var(--heading-color); margin:0; font-size:1.25rem; font-weight:700;}
.page-game-bai__game-desc{margin:0; font-size:0.95rem; line-height:1.5;}
.page-game-bai__features-section{padding:60px 20px; background: transparent;}
.page-game-bai__features-grid{max-width:1200px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:30px;}
.page-game-bai__feature-item{background-color:var(--card-bg-color); border:1px solid var(--border-color); border-radius:12px; padding:16px; text-align:center; transition:box-shadow .3s ease;}
.page-game-bai__feature-item:hover{box-shadow:0 4px 20px 0 rgba(242,193,78,0.3);}
.page-game-bai__feature-image{width:600px; max-width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:8px; margin-bottom:16px;}
.page-game-bai__feature-title{ color:var(--heading-color); margin:0 0 10px 0; font-size:1.5rem; font-weight:700;}
.page-game-bai__feature-text{ max-width:500px; margin:0 auto; font-size : 1rem; color:var(--main-text-color);}
.page-game-bai__guide-section{ padding-bottom:60px;}
.page-game-bai__guide-inner{max-width:1000px; margin:0 auto; padding:16px;}
.page-game-bai__guide-title{ text-align:center; color:var(--heading-color); font-size:clamp(1.8rem, 4vw, 2.5rem); margin-bottom:16px;}
.page-game-bai__guide-intro{text-align:center; max-width:60ch; margin:0 auto 30px; font-size:1.2rem; color:var(--main-text-color);}
.page-game-bai__guide-item{background-color:var(--card-bg-color); border:1px solid var(--border-color); border-radius:8px; margin-bottom:16px; padding:0 24px; box-sizing:border-box; overflow:hidden;}
.page-game-bai__guide-item summary{font-weight:600; color:var(--main-text-color); padding:20px 0; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap: wrap;}
.page-game-bai__guide-item summary::-webkit-details-marker{display:none;}
.page-game-bai__guide-item[open] summary{ border-bottom:1px solid var(--border-color);}
.page-game-bai__guide-item summary span{color:var(--heading-color); font-size:1.5rem; font-weight:bold; line-height:1;}
.page-game-bai__guide-step-content{ padding:20px 0; color:var(--main-text-color); margin:0;}
@media (max-width: 1200px){
    .page-game-bai__games-grid{ grid-template-columns:repeat(2,1fr); }
    .page-game-bai__features-grid{ grid-template-columns:repeat(1,1fr); max-width:700px; }
}
@media (max-width: 768px){ 
    .page-game-bai__hero-section{ padding:10px 12px 0; }
    .page-game-bai__hero-image{ aspect-ratio:4/3; max-width:100% !important; height:auto !important;}
    .page-game-bai__hero-title{text-align:center;}    
    .page-game-bai__button{ display:block; width:100%; max-width:100%; box-sizing:border-box;}
    .page-game-bai__games-section {padding:40px 12px;}
    .page-game-bai__games-grid{ grid-template-columns:1fr; }
    .page-game-bai__game-image{ max-width:100% !important; height:auto !important;}
    .page-game-bai__features-section {padding:40px 12px;}
    .page-game-bai__features-grid{ grid-template-columns:1fr; }
    .page-game-bai__feature-image{ max-width:100% !important; height:auto !important;}
    .page-game-bai__guide-section{padding-bottom:40px;}
    .page-game-bai__guide-item{padding:0 16px;}
    .page-game-bai__guide-item summary{flex-wrap: wrap;}
    .page-game-bai img{max-width:100% !important; height:auto !important;}
}