* {box-sizing: border-box; margin: 0; padding: 0;}
        body {font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; background-color: #0f1218; color: #ffffff; line-height: 1.6; padding-bottom: 70px;}
        a {text-decoration: none; color: inherit;}
        header {background: #1a1d24; padding: 10px 15px; display: flex; justify-content: space-between; align-items: center; position: sticky; top: 0; z-index: 1000; box-shadow: 0 2px 10px rgba(0,0,0,0.5);}
        .header-left {display: flex; align-items: center; gap: 8px;}
        .header-left img {width: 25px; height: 25px; object-fit: contain;}
        .header-left strong {font-size: 16px; font-weight: normal; color: #d4af37;}
        .header-right {display: flex; gap: 8px;}
        .btn {padding: 6px 15px; border-radius: 20px; font-size: 14px; font-weight: 600; cursor: pointer; border: none; transition: transform 0.2s;}
        .btn-login {background: transparent; color: #ffffff; border: 1px solid #d4af37;}
        .btn-register {background: linear-gradient(180deg, #f3d078 0%, #d4af37 100%); color: #000;}
        .banner {width: 100%; aspect-ratio: 2/1; cursor: pointer;}
        .banner img {width: 100%; height: 100%; object-fit: cover;}
        .announcement {background: #1e222b; padding: 8px 15px; display: flex; align-items: center; gap: 10px; font-size: 13px; color: #bdc3c7; border-bottom: 1px solid #2c313c;}
        .announcement i {color: #d4af37;}
        .marquee {overflow: hidden; white-space: nowrap; width: 100%;}
        .marquee p {display: inline-block; animation: scroll 20s linear infinite;}
        @keyframes scroll {0% {transform: translateX(100%);} 100% {transform: translateX(-100%);}}
        .section-title {padding: 20px 15px 10px; font-size: 18px; color: #f1c40f; display: flex; align-items: center; gap: 8px;}
        .game-grid {display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 0 15px 20px;}
        .game-card {background: #1a1d24; border-radius: 12px; overflow: hidden; border: 1px solid #2c313c; transition: 0.3s;}
        .game-card img {width: 100%; aspect-ratio: 1/1; object-fit: cover; display: block;}
        .game-info {padding: 8px; text-align: center;}
        .game-info p {font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #ecf0f1;}
        .intro-card {margin: 15px; padding: 20px; background: linear-gradient(135deg, #1a1d24 0%, #2c313c 100%); border-radius: 15px; border-left: 4px solid #d4af37;}
        .intro-card h1 {font-size: 18px; margin-bottom: 10px; color: #d4af37; line-height: 1.3;}
        .intro-card p {font-size: 14px; color: #bdc3c7;}
        .trust-badges {display: flex; justify-content: space-around; padding: 20px 15px; background: #161920; margin-bottom: 20px;}
        .badge-item {text-align: center; font-size: 11px; color: #95a5a6;}
        .badge-item i {font-size: 24px; color: #d4af37; margin-bottom: 5px; display: block;}
        .winning-list {margin: 0 15px 20px; background: #1a1d24; border-radius: 12px; height: 200px; overflow-y: hidden; position: relative;}
        .winning-scroll {animation: slideUp 40s linear infinite;}
        .winning-item {padding: 10px 15px; border-bottom: 1px solid #2c313c; display: flex; justify-content: space-between; font-size: 12px;}
        .winning-item span:last-child {color: #2ecc71; font-weight: bold;}
        @keyframes slideUp {0% {transform: translateY(0);} 100% {transform: translateY(-50%);}}
        .stats-grid {display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 0 15px 20px;}
        .stat-card {background: #1a1d24; padding: 15px; border-radius: 10px; text-align: center; border: 1px solid #2c313c;}
        .stat-value {font-size: 18px; font-weight: bold; color: #d4af37;}
        .stat-label {font-size: 12px; color: #95a5a6;}
        .reviews {padding: 0 15px 20px;}
        .review-card {background: #1e222b; padding: 15px; border-radius: 12px; margin-bottom: 12px; border: 1px solid #2c313c;}
        .review-header {display: flex; justify-content: space-between; margin-bottom: 8px;}
        .reviewer {font-weight: bold; font-size: 14px; color: #d4af37;}
        .stars {color: #f1c40f; font-size: 12px;}
        .review-text {font-size: 13px; color: #bdc3c7; font-style: italic;}
        .faq {padding: 0 15px 20px;}
        .faq-item {margin-bottom: 15px; background: #1a1d24; border-radius: 10px; overflow: hidden;}
        .faq-question {padding: 12px 15px; background: #2c313c; font-size: 14px; font-weight: 600; cursor: pointer; color: #d4af37;}
        .faq-answer {padding: 15px; font-size: 13px; color: #bdc3c7; border-top: 1px solid #3e4451;}
        .navigator {position: fixed; bottom: 0; left: 0; right: 0; background: #1a1d24; display: flex; justify-content: space-around; padding: 10px 0; border-top: 1px solid #2c313c; z-index: 1000;}
        .nav-item {text-align: center; font-size: 11px; color: #95a5a6; flex: 1;}
        .nav-item i {font-size: 20px; display: block; margin-bottom: 3px;}
        .nav-item.active {color: #d4af37;}
        footer {background: #090b0e; padding: 30px 15px 100px; text-align: center;}
        .footer-links {display: flex; justify-content: center; gap: 15px; flex-wrap: wrap; margin-bottom: 15px;}
        .footer-links a {font-size: 13px; color: #95a5a6;}
        .copyright {font-size: 11px; color: #5d6d7e; margin-top: 20px;}