:root{--primary-blue: #007bff;--success-green: #28a745;--bg-black: #000000;--bg-dark: #1a1a1a;--bg-gray: #2a2a2a;--text-white: #ffffff;--text-gray: #cccccc;--purple-start: #8b5cf6;--purple-end: #a855f7;--orange: #f97316;--red: #ef4444;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-size-base: 14px;--font-size-lg: 16px;--font-size-xl: 18px;--font-size-2xl: 24px;--font-size-3xl: 32px;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--sidebar-width: 200px;--header-height: 60px;--container-max-width: 1200px;--transition-fast: .3s ease;--transition-smooth: .4s ease}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-family);font-size:var(--font-size-base);color:var(--text-white);background-color:var(--bg-dark);line-height:1.6;overflow-x:hidden}.header{position:sticky;top:0;z-index:1000;background:#000000f2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);height:var(--header-height);border-bottom:1px solid rgba(255,255,255,.1)}.header-container{display:flex;justify-content:space-between;align-items:center;height:100%;max-width:var(--container-max-width);margin:0 auto;padding:0 var(--spacing-md)}.header-left{display:flex;align-items:center;gap:var(--spacing-md)}.sidebar-toggle{display:none;flex-direction:column;background:none;border:none;cursor:pointer;padding:var(--spacing-xs)}.sidebar-toggle span{width:20px;height:2px;background:var(--text-white);margin:2px 0;transition:var(--transition-fast)}.logo-img{height:40px;width:auto}.main-nav{display:flex;align-items:center;gap:var(--spacing-md)}.nav-btn{background:var(--primary-blue);color:var(--text-white);border:none;padding:var(--spacing-sm) var(--spacing-md);border-radius:6px;font-weight:600;cursor:pointer;transition:var(--transition-fast)}.nav-btn:hover{background:#0056b3;transform:translateY(-1px)}.nav-link{color:var(--text-gray);text-decoration:none;font-weight:500;transition:var(--transition-fast)}.nav-link:hover{color:var(--text-white)}.header-right{display:flex;align-items:center;gap:var(--spacing-md)}.balance{font-weight:600;color:var(--text-white)}.btn-topup{background:var(--success-green);color:var(--text-white);border:none;padding:var(--spacing-sm) var(--spacing-md);border-radius:6px;font-weight:600;cursor:pointer;transition:var(--transition-fast)}.btn-topup:hover{background:#1e7e34;transform:translateY(-1px)}.user-controls{display:flex;align-items:center;gap:var(--spacing-sm)}.notification-bell,.user-avatar{width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:var(--bg-gray);border-radius:50%;cursor:pointer;transition:var(--transition-fast)}.notification-bell:hover,.user-avatar:hover{background:#3a3a3a;transform:scale(1.1)}.sidebar{position:fixed;left:0;top:var(--header-height);width:var(--sidebar-width);height:calc(100vh - var(--header-height));background:var(--bg-gray);overflow-y:auto;transition:transform var(--transition-smooth);z-index:999}.sidebar-nav{padding:var(--spacing-md) 0}.sidebar-item{display:flex;align-items:center;padding:var(--spacing-md);color:var(--text-white);text-decoration:none;transition:var(--transition-fast);position:relative}.sidebar-item:hover{background:#ffffff1a}.sidebar-icon{width:20px;margin-right:var(--spacing-md);font-size:16px}.dropdown-arrow{margin-left:auto;font-size:12px;transition:transform var(--transition-fast)}.sidebar-item.dropdown:hover .dropdown-arrow{transform:rotate(180deg)}.main-content{margin-left:var(--sidebar-width);min-height:calc(100vh - var(--header-height));padding:var(--spacing-lg);transition:margin-left var(--transition-smooth)}.hero-banner{display:grid;grid-template-columns:2fr 1fr;gap:var(--spacing-lg);margin-bottom:var(--spacing-xl);height:300px}.hero-main{background:linear-gradient(135deg,#007bffcc,#28a745cc),url(header.png) center/cover;border-radius:12px;padding:var(--spacing-xl);display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden}.hero-content h1{font-size:var(--font-size-2xl);font-weight:700;margin-bottom:var(--spacing-md);max-width:60%;line-height:1.3}.btn-learn-more{background:var(--text-white);color:var(--bg-black);border:none;padding:var(--spacing-md) var(--spacing-lg);border-radius:8px;font-weight:600;cursor:pointer;transition:var(--transition-fast)}.btn-learn-more:hover{background:var(--text-gray);transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.hero-image{position:absolute;right:0;top:0;height:100%;width:40%;opacity:.8}.hero-image img{width:100%;height:100%;object-fit:cover;object-position:center}.hero-side-cards{display:flex;flex-direction:column;gap:var(--spacing-md)}.promo-card{height:138px;border-radius:12px;padding:var(--spacing-md);display:flex;align-items:flex-end;position:relative;overflow:hidden;cursor:pointer;transition:var(--transition-fast)}.promo-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000004d}.purple-car{background:linear-gradient(135deg,var(--purple-start),var(--purple-end))}.purple-gaming{background:linear-gradient(135deg,#667eea,#764ba2)}.promo-content h3{font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--spacing-xs)}.promo-content p{font-size:var(--font-size-base);opacity:.9}.games-section{margin-bottom:var(--spacing-xl)}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.section-header h2{font-size:var(--font-size-2xl);font-weight:600}.view-all{color:var(--primary-blue);text-decoration:none;font-weight:500;transition:var(--transition-fast)}.view-all:hover{color:#0056b3}.games-container{position:relative;display:flex;align-items:center}.scroll-btn{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;background:#000000b3;border:none;border-radius:50%;color:var(--text-white);font-size:18px;cursor:pointer;transition:var(--transition-fast);z-index:10}.scroll-btn:hover{background:#000000e6;transform:translateY(-50%) scale(1.1)}.scroll-btn.prev{left:-20px}.scroll-btn.next{right:-20px}.games-grid{display:flex;gap:var(--spacing-md);overflow-x:auto;scroll-behavior:smooth;padding:var(--spacing-sm) 0;scrollbar-width:none;-ms-overflow-style:none}.games-grid::-webkit-scrollbar{display:none}.game-card{min-width:120px;height:120px;border-radius:12px;display:flex;align-items:flex-end;padding:var(--spacing-md);cursor:pointer;transition:var(--transition-fast);position:relative;overflow:hidden}.game-card:hover{transform:translateY(-4px) scale(1.05);box-shadow:0 8px 24px #0006}.game-title{font-size:12px;font-weight:600;color:var(--text-white);text-align:center;width:100%;background:#0000004d;padding:var(--spacing-xs);border-radius:4px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.purple-gradient{background:linear-gradient(135deg,var(--purple-start),var(--purple-end))}.orange-gradient{background:linear-gradient(135deg,var(--orange),#fb923c)}.blue-gradient{background:linear-gradient(135deg,var(--primary-blue),#3b82f6)}.green-gradient{background:linear-gradient(135deg,var(--success-green),#22c55e)}.red-gradient{background:linear-gradient(135deg,var(--red),#f87171)}.dark-gradient{background:linear-gradient(135deg,#374151,#6b7280)}.yellow-gradient{background:linear-gradient(135deg,#fbbf24,#f59e0b)}.games-grid.large-cards .game-card-large{min-width:150px;height:200px;border-radius:12px;display:flex;flex-direction:column;justify-content:space-between;padding:var(--spacing-md);cursor:pointer;transition:var(--transition-fast);position:relative;overflow:hidden;background-size:cover;background-position:center}.game-card-large:hover{transform:translateY(-4px) scale(1.05);box-shadow:0 8px 24px #0006}.game-provider{background:#000000b3;color:var(--text-white);padding:var(--spacing-xs) var(--spacing-sm);border-radius:4px;font-size:10px;font-weight:600;align-self:flex-start;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.game-card-large .game-title{background:#000000b3;padding:var(--spacing-sm);border-radius:6px;font-size:var(--font-size-base);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.zeus{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#1e40af,#3730a3)}.bonanza{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#dc2626,#b91c1c)}.bass{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#0891b2,#0e7490)}.olympus{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#7c3aed,#6d28d9)}.madness{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#ea580c,#c2410c)}.olympus-popular{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#7c3aed,#6d28d9)}.splash{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#0891b2,#0e7490)}.volcano{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#dc2626,#991b1b)}.starlight{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#ec4899,#db2777)}.exclusive-card{min-width:120px;height:120px;position:relative}.gates{background:linear-gradient(135deg,#fbbf24,#f59e0b)}.aviator{background:linear-gradient(135deg,#0891b2,#0e7490)}.dragons{background:linear-gradient(135deg,#dc2626,#b91c1c)}.skyward{background:linear-gradient(135deg,var(--purple-start),var(--purple-end))}.live-card{min-width:120px;height:120px;background-size:cover;background-position:center;position:relative}.live-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to bottom,transparent,rgba(0,0,0,.7));border-radius:12px}.roulette{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#dc2626,#991b1b)}.blackjack-live{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#374151,#1f2937)}.baccarat{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#059669,#047857)}.holdem{background:linear-gradient(#0000004d,#0000004d),linear-gradient(135deg,#7c3aed,#6d28d9)}.evolution{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#000}.faq-section,.rich-text-section{margin-bottom:var(--spacing-xl)}.rich-text-container{background:var(--bg-gray);border-radius:12px;padding:var(--spacing-xl);border:1px solid rgba(255,255,255,.1)}.rich-text-content{max-width:800px;margin:0 auto;text-align:left}.rich-text-content p{font-size:var(--font-size-lg);line-height:1.8;color:var(--text-gray);margin-bottom:var(--spacing-md);transition:var(--transition-fast)}.rich-text-content p:last-child{margin-bottom:0}.rich-text-content p:hover{color:var(--text-white)}.faq-container{background:var(--bg-gray);border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.1)}.faq-header{padding:var(--spacing-md);cursor:pointer;display:flex;justify-content:space-between;align-items:center;background:#ffffff0d;transition:var(--transition-fast)}.faq-header:hover{background:#ffffff1a}.faq-header h3{font-size:var(--font-size-xl);font-weight:600}.faq-arrow{font-size:var(--font-size-base);transition:transform var(--transition-smooth)}.faq-content{max-height:0;overflow:hidden;transition:max-height var(--transition-smooth)}.faq-content.expanded{max-height:2000px}.faq-text{padding:0 var(--spacing-md) var(--spacing-md);line-height:1.8}.faq-text h4{color:var(--primary-blue);font-size:var(--font-size-lg);font-weight:600;margin:var(--spacing-lg) 0 var(--spacing-sm) 0}.faq-text h4:first-child{margin-top:0}.faq-text p{margin-bottom:var(--spacing-md);color:var(--text-gray);font-size:13px}.footer{background:var(--bg-dark);padding:var(--spacing-xl) 0;border-top:1px solid rgba(255,255,255,.1);margin-left:calc(-1 * var(--sidebar-width));transition:margin-left var(--transition-smooth)}.footer-container{max-width:var(--container-max-width);margin:0 auto;padding:0 var(--spacing-md)}.support-widget{background:var(--bg-gray);border-radius:12px;padding:var(--spacing-md);margin-bottom:var(--spacing-lg);display:flex;justify-content:space-between;align-items:center}.support-agent{display:flex;align-items:center;gap:var(--spacing-md)}.agent-avatar{width:48px;height:48px;background:var(--primary-blue);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px}.support-title{font-weight:600;margin-bottom:var(--spacing-xs)}.support-status{color:var(--success-green);font-size:12px}.btn-chat{background:var(--success-green);color:var(--text-white);border:none;padding:var(--spacing-sm) var(--spacing-md);border-radius:8px;font-weight:600;cursor:pointer;transition:var(--transition-fast)}.btn-chat:hover{background:#1e7e34;transform:translateY(-1px)}.footer-content{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-xl);margin-bottom:var(--spacing-lg)}.footer-column h4{font-size:var(--font-size-lg);font-weight:600;margin-bottom:var(--spacing-md);color:var(--text-white)}.footer-column ul{list-style:none}.footer-column li{margin-bottom:var(--spacing-sm)}.footer-column a{color:var(--text-gray);text-decoration:none;transition:var(--transition-fast)}.footer-column a:hover{color:var(--text-white)}.app-promotion{background:var(--bg-gray);padding:var(--spacing-md);border-radius:8px}.bonus-text{color:var(--success-green);font-weight:600;margin-bottom:var(--spacing-md);font-size:13px}.app-buttons{display:flex;flex-direction:column;gap:var(--spacing-sm)}.app-btn{background:var(--bg-black);color:var(--text-white);border:1px solid rgba(255,255,255,.2);padding:var(--spacing-sm);border-radius:6px;cursor:pointer;transition:var(--transition-fast);font-size:12px}.app-btn:hover{background:#ffffff1a}.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:var(--spacing-lg);border-top:1px solid rgba(255,255,255,.1)}.social-media{display:flex;gap:var(--spacing-md)}.social-link{width:36px;height:36px;background:var(--bg-gray);color:var(--text-white);text-decoration:none;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:var(--transition-fast);font-size:16px}.social-link:hover{background:var(--primary-blue);transform:translateY(-2px)}.age-restriction{background:var(--red);color:var(--text-white);padding:var(--spacing-xs) var(--spacing-sm);border-radius:4px;font-weight:600;font-size:12px}.copyright{color:var(--text-gray);font-size:12px}@media (max-width: 1024px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.main-content,.footer{margin-left:0}.sidebar-toggle{display:flex}.hero-banner{grid-template-columns:1fr;height:auto}.hero-side-cards{flex-direction:row}.footer-content{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.header-container{padding:0 var(--spacing-sm)}.main-nav{display:none}.header-right{gap:var(--spacing-sm)}.balance{display:none}.main-content{padding:var(--spacing-md)}.hero-main{height:200px;padding:var(--spacing-md)}.hero-content h1{font-size:var(--font-size-xl);max-width:100%}.hero-image{display:none}.hero-side-cards{flex-direction:column}.promo-card{height:100px}.games-grid{gap:var(--spacing-sm)}.game-card{min-width:100px;height:100px}.games-grid.large-cards .game-card-large{min-width:120px;height:160px}.footer-content{grid-template-columns:1fr;gap:var(--spacing-lg)}.footer-bottom{flex-direction:column;gap:var(--spacing-md);text-align:center}}@media (max-width: 480px){.hero-side-cards,.scroll-btn{display:none}.section-header{flex-direction:column;align-items:flex-start;gap:var(--spacing-sm)}.social-media{justify-content:center;flex-wrap:wrap}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.games-section{animation:fadeIn .6s ease-out}.game-card,.game-card-large{transition:all var(--transition-fast)}.game-card:hover,.game-card-large:hover{z-index:1}@keyframes ripple{to{transform:scale(4);opacity:0}}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}html{scroll-behavior:auto}}button:focus,a:focus,.sidebar-item:focus{outline:2px solid var(--primary-blue);outline-offset:2px}
