*{padding:0;margin:0;box-sizing:border-box}img{content-visibility:auto;contain-intrinsic-size:300px 169px}img[data-src]{background:linear-gradient(135deg,#1a1a2e 0,#16213e 100%);min-height:100px}.category-item,.slide,.stream-card{will-change:transform;transform:translateZ(0)}html{overflow-x:hidden;width:100%;max-width:100vw;position:relative}body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;background-color:#0f0f0f;color:#fff;overflow-x:hidden;width:100%;max-width:100vw;position:relative;-webkit-overflow-scrolling:touch;overscroll-behavior-x:none}.header{display:flex;align-items:center;justify-content:space-between;padding:0 16px;height:56px;background-color:#212121;border-bottom:1px solid #303030;position:fixed;top:0;left:0;right:0;z-index:1000}.header-left{display:flex;align-items:center;gap:16px}.menu-btn{background:0 0;border:none;color:#fff;font-size:18px;cursor:pointer;padding:8px}.logo{display:flex;align-items:center}.logo-text{font-size:22px;font-weight:800;letter-spacing:-1px;background:linear-gradient(135deg,#667eea 0,#764ba2 50%,#f093fb 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;background-size:200% 200%;animation:logoGradient 3s ease-in-out infinite}@keyframes logoGradient{0%{background-position:0 50%;filter:drop-shadow(0 0 8px rgba(102,126,234,.7))}25%{filter:drop-shadow(0 0 12px rgba(118,75,162,.8))}50%{background-position:100% 50%;filter:drop-shadow(0 0 18px rgba(240,147,251,.9)) drop-shadow(0 0 30px rgba(240,147,251,.5))}75%{filter:drop-shadow(0 0 12px rgba(118,75,162,.8))}100%{background-position:0 50%;filter:drop-shadow(0 0 8px rgba(102,126,234,.7))}}.header-center{flex:1;max-width:600px;margin:0 40px}.search-bar{display:flex;align-items:center;background:linear-gradient(135deg,rgba(255,255,255,.08) 0,rgba(255,255,255,.04) 100%);border:1px solid rgba(255,255,255,.1);border-radius:16px;overflow:hidden;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:all .3s cubic-bezier(.4, 0, .2, 1);box-shadow:0 2px 8px rgba(0,0,0,.1),inset 0 1px 0 rgba(255,255,255,.05)}.search-bar:focus-within{border-color:rgba(102,126,234,.5);background:linear-gradient(135deg,rgba(102,126,234,.1) 0,rgba(118,75,162,.05) 100%);box-shadow:0 4px 20px rgba(102,126,234,.15),0 0 0 3px rgba(102,126,234,.1)}.search-bar input{flex:1;background:0 0;border:none;padding:10px 16px;color:#fff;font-size:16px!important;font-weight:400;letter-spacing:.2px}.search-bar input::placeholder{color:rgba(255,255,255,.4);font-weight:400}.search-btn{background:linear-gradient(135deg,rgba(102,126,234,.8) 0,rgba(118,75,162,.8) 100%);border:none;color:#fff;padding:8px 14px;margin:4px;cursor:pointer;border-radius:12px;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.search-btn:hover{background:linear-gradient(135deg,#667eea 0,#764ba2 100%);transform:scale(1.05)}.search-btn:active{transform:scale(.95)}.header-right{display:flex;align-items:center;gap:8px}.header-icon{background:0 0;border:none;color:#fff;font-size:18px;padding:8px;cursor:pointer;border-radius:50%}.header-icon:hover{background-color:#303030}.main-container{display:flex;margin-top:56px;min-height:calc(100vh - 56px);width:100%;max-width:100%;overflow-x:hidden;box-sizing:border-box}.sidebar{width:240px;background-color:#212121;border-right:1px solid #303030;padding:12px 0;position:fixed;height:calc(100vh - 56px);overflow-y:auto}.nav-menu{padding:0 12px;margin-bottom:24px}.nav-item{display:flex;align-items:center;gap:24px;padding:10px 12px;color:#fff;text-decoration:none;border-radius:10px;margin-bottom:2px;font-size:14px}.nav-item:hover{background-color:#303030}.nav-item.active{background-color:#303030}.nav-item i{width:24px;font-size:16px}.streamer-section{padding:0 12px;margin-bottom:24px}.streamer-section h3{font-size:14px;color:#aaa;margin-bottom:12px;padding:0 12px}.streamer-item{display:flex;align-items:center;gap:12px;padding:8px 12px;border-radius:10px;cursor:pointer}.streamer-item:hover{background-color:#303030}.streamer-avatar{width:32px;height:32px;border-radius:50%}.streamer-info{flex:1}.streamer-name{display:block;font-size:14px;color:#fff}.viewer-count{display:block;font-size:12px;color:#aaa}.sidebar-footer{padding:0 12px;border-top:1px solid #303030;padding-top:12px}.footer-item{display:flex;align-items:center;gap:24px;padding:8px 12px;color:#aaa;text-decoration:none;border-radius:10px;margin-bottom:2px;font-size:14px}.footer-item:hover{background-color:#303030;color:#fff}.footer-item i{width:24px;font-size:16px}.main-content{flex:1;margin-left:240px;padding:24px;max-width:calc(100% - 240px);overflow-x:hidden;box-sizing:border-box}.main-video-section{display:flex;gap:24px;margin-bottom:32px}.video-container{flex:1}.video-player{position:relative;background-color:#000;border-radius:12px;overflow:hidden;aspect-ratio:16/9}.main-video{width:100%;height:100%;object-fit:cover}.video-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,.8));padding:24px}.video-info{display:flex;align-items:center;justify-content:space-between}.channel-info{display:flex;align-items:center;gap:12px}.channel-avatar{width:40px;height:40px;border-radius:50%}.channel-details h2{font-size:18px;margin-bottom:4px}.channel-details p{font-size:14px;color:#aaa}.play-btn{background-color:rgba(255,255,255,.2);border:none;color:#fff;width:60px;height:60px;border-radius:50%;font-size:24px;cursor:pointer;backdrop-filter:blur(10px)}.chat-container{width:340px;background-color:#1a1a1a;border-radius:12px;overflow:hidden}.chat-header{background-color:#303030;padding:12px 16px;font-size:14px;font-weight:500}.chat-messages{height:400px;overflow-y:auto;padding:16px}.chat-message{display:flex;align-items:flex-start;gap:8px;margin-bottom:12px}.chat-avatar{width:24px;height:24px;border-radius:50%;flex-shrink:0}.chat-content{flex:1}.chat-username{font-size:12px;color:#00d4ff;font-weight:500;margin-right:8px}.chat-text{font-size:14px;color:#fff}.game-categories{display:flex;flex-direction:row;flex-wrap:nowrap;gap:24px;margin-bottom:32px;overflow-x:auto;padding-bottom:8px;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.game-categories::-webkit-scrollbar{display:none}.category-item{position:relative;min-width:280px;max-width:320px;flex-shrink:0;border-radius:12px;overflow:hidden;cursor:pointer}.category-image{width:100%;height:160px;max-height:160px;object-fit:cover;display:block}.category-info{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,.8));padding:16px}.live-badge{background-color:#f44;color:#fff;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500;margin-bottom:8px;display:inline-block}.category-details p{margin-bottom:4px}.category-time{font-size:12px;color:#aaa}.category-title{font-size:14px;font-weight:500;color:#fff}.category-subtitle{font-size:12px;color:#aaa}.live-streams-section{width:100%;overflow:hidden}.live-streams-section h2{font-size:20px;margin-bottom:16px}.streams-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;width:100%}.stream-card{background-color:#1a1a1a;border-radius:12px;overflow:hidden;cursor:pointer;transition:transform .2s;width:100%;max-width:100%}.stream-card:hover{transform:translateY(-4px)}.stream-card{will-change:transform;contain:layout style paint}.stream-thumbnail{position:relative;width:100%;overflow:hidden}.stream-thumbnail img{width:100%;height:157px;object-fit:cover;display:block}.viewer-count{position:absolute;bottom:8px;right:8px;background-color:rgba(0,0,0,.8);color:#fff;padding:4px 8px;border-radius:4px;font-size:12px}.stream-info{display:flex;align-items:center;gap:12px;padding:12px}.stream-avatar{width:32px;height:32px;border-radius:50%}.stream-details{flex:1;min-width:0;overflow:hidden}.stream-details h4{font-size:14px;margin-bottom:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stream-details p{font-size:12px;color:#aaa;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media (max-width:1024px) and (min-width:769px){.sidebar{width:72px}.main-content{margin-left:72px;max-width:calc(100% - 72px)}.footer-item span,.nav-item span{display:none}.sidebar-footer,.streamer-section{display:none}}@media (max-width:768px){.sidebar{position:fixed!important;top:56px!important;left:-250px!important;width:240px!important;height:calc(100vh - 56px)!important;transition:left .3s ease!important;z-index:9999!important;background-color:#212121!important;overflow-y:auto!important}.sidebar.open{left:0!important}.menu-btn{position:relative;z-index:10000!important;padding:10px!important;min-width:44px!important;min-height:44px!important}.sidebar-overlay{display:none;position:fixed;top:56px;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);z-index:9998}.sidebar-overlay.active{display:block}.main-content{margin-left:0!important;padding:12px;max-width:100%;width:100%;overflow-x:hidden;box-sizing:border-box}.main-video-section{flex-direction:column;gap:12px}.video-container{width:100%}.video-player{aspect-ratio:16/9;min-height:200px;border-radius:12px}.chat-container{width:100%;height:300px}.chat-messages{height:220px}.game-categories{gap:12px;padding-bottom:12px}.category-item{min-width:200px}.streams-grid{grid-template-columns:repeat(2,1fr);gap:10px;width:100%}.stream-card{border-radius:8px}.stream-thumbnail img{height:100px}.stream-info{padding:8px}.stream-details h4{font-size:12px}.stream-details p{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stream-avatar{width:24px;height:24px}.header{padding:0 8px}.header-left{gap:8px}.logo{margin-right:8px}.header-center{margin:0 12px;flex:1;max-width:calc(100vw - 120px)}.search-bar{width:100%;max-width:100%;min-width:0}.search-bar input{font-size:16px!important;padding:8px 12px;width:100%;min-width:0;-webkit-appearance:none;appearance:none;border-radius:20px}.logo-text{font-size:20px}.video-overlay{padding:12px}.channel-details h2{font-size:14px}.channel-details p{font-size:12px}.channel-avatar{width:32px;height:32px}.play-btn{width:40px;height:40px;font-size:16px}.live-indicator{padding:4px 8px;font-size:10px}.live-streams-section h2{font-size:16px;margin-bottom:12px}}@media (max-width:480px){.header{height:50px;padding:0 8px}.main-container{margin-top:50px}.sidebar{top:50px;height:calc(100vh - 50px)}.main-content{padding:8px}.streams-grid{grid-template-columns:1fr;gap:8px;width:100%}.stream-thumbnail img{height:180px}.stream-info{padding:10px}.stream-details h4{font-size:14px}.stream-details p{font-size:12px}.stream-avatar{width:32px;height:32px}.game-categories{gap:8px}.category-item{min-width:160px}.chat-container{height:250px}.chat-messages{height:180px}.chat-message{padding:6px 0}.chat-username{font-size:11px}.chat-text{font-size:12px}.video-player{min-height:180px}.header-icon{padding:6px;font-size:16px}.header{padding:0 4px}.header-center{margin:0 4px;flex:1;max-width:calc(100vw - 100px)}.search-bar{display:flex;width:100%;max-width:100%}.search-bar input{font-size:16px!important;padding:6px 8px;width:100%;min-width:0}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb{background:#404040;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#505050}.chat-message{opacity:1;will-change:opacity}@media (prefers-reduced-motion:no-preference){.chat-message{animation:fadeInUp .2s ease-out}}@keyframes fadeInUp{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.streamer-avatar{transition:transform .2s ease}.streamer-avatar:hover{transform:scale(1.1)}.chat-avatar{transition:transform .2s ease}.chat-avatar:hover{transform:scale(1.2)}.slideshow{position:absolute;top:0;left:0;width:100%;height:100%}.slideshow .slide{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;border-radius:12px;opacity:0;transition:opacity .8s ease-in-out}.slideshow .slide.active{opacity:1}.slide-indicators{position:absolute;bottom:0;left:0;right:0;z-index:15;height:4px;background:rgba(255,255,255,.2);overflow:hidden}.slide-indicators .indicator{display:none}.slide-indicators::after{content:'';position:absolute;top:0;left:0;height:100%;width:0%;background:linear-gradient(90deg,#667eea,#764ba2,#f093fb)}.slide-indicators.animating::after{animation:progressFillFull 5s linear forwards}@keyframes progressFillFull{0%{width:0%}100%{width:100%}}.live-indicator{position:absolute;top:16px;left:16px;background-color:red;color:#fff;padding:6px 12px;border-radius:4px;font-size:12px;font-weight:700;display:flex;align-items:center;gap:6px;z-index:10}.live-dot{width:8px;height:8px;background-color:#fff;border-radius:50%;animation:pulse 1.5s infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}.video-player{position:relative}.play-btn.muted i::before{content:"\f6a9"}.mobile-nav{display:none;position:fixed;bottom:0;left:0;right:0;background-color:#212121;border-top:1px solid #303030;padding:8px 0;padding-bottom:env(safe-area-inset-bottom,8px);z-index:1000}.mobile-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;color:#888;font-size:10px;gap:4px;transition:color .2s}.mobile-nav a i{font-size:20px}.mobile-nav a.active{color:#00d4ff}.mobile-nav a:hover{color:#fff}.mobile-nav a.live-btn i{color:red}@media (max-width:768px){.mobile-nav{display:flex;justify-content:space-around}.main-content{padding-bottom:70px}}@media (max-width:480px){.mobile-nav{padding:6px 0}.mobile-nav a{font-size:9px}.mobile-nav a i{font-size:18px}.main-content{padding-bottom:60px}}@media (hover:none) and (pointer:coarse){.stream-card:active{transform:scale(.98);opacity:.9}.mobile-nav-item:active,.nav-item:active{background-color:#404040}.play-btn:active{transform:scale(.95)}}@media (max-width:768px){.auth-content{width:95%!important;max-width:100%!important;max-height:90vh!important;height:auto!important;padding:20px!important;margin:10px;overflow-y:auto;animation:slideUp .3s ease-out}.auth-content h2{font-size:18px!important;margin-bottom:15px!important}.auth-content h3{font-size:16px!important}.auth-content button,.auth-content input,.auth-content select{font-size:16px!important;padding:10px!important}}@media (max-width:480px){.auth-modal{align-items:flex-end!important;padding:0!important}.auth-content{width:100%!important;max-height:85vh!important;border-radius:20px 20px 0 0!important;margin:0;position:relative!important;animation:slideUpMobile .3s ease-out}.auth-content::before{content:'';position:absolute;top:8px;left:50%;transform:translateX(-50%);width:40px;height:4px;background:rgba(255,255,255,.3);border-radius:2px}.auth-content{padding-top:25px!important}}@keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUpMobile{from{transform:translateY(100%)}to{transform:translateY(0)}}.auth-modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;height:100vh;height:-webkit-fill-available;background:rgba(0,0,0,.8);z-index:2000;justify-content:center;align-items:center;padding:20px;box-sizing:border-box}.auth-modal.active{display:flex}.auth-content{background:#1a1a2e;padding:40px;border-radius:16px;width:90%;max-width:400px;max-height:90vh;max-height:calc(100vh - 40px);overflow-y:auto;position:relative;margin:auto}.auth-close{position:absolute;top:15px;right:20px;background:0 0;border:none;color:#888;font-size:28px;cursor:pointer}.auth-close:hover{color:#fff}.auth-content h2{text-align:center;margin-bottom:30px;color:#00d4ff}.auth-input{display:flex;align-items:center;background:#0f0f23;border:1px solid #333;border-radius:8px;margin-bottom:15px;padding:0 15px}.auth-input i{color:#666;width:20px}.auth-input input,.auth-input select{flex:1;background:0 0;border:none;padding:15px 10px;color:#fff;font-size:16px!important;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-text-size-adjust:100%!important;text-size-adjust:100%;touch-action:manipulation}input[type=email],input[type=number],input[type=password],input[type=tel],input[type=text],select,textarea{font-size:16px!important;-webkit-text-size-adjust:100%!important}.auth-input select{cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23666' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10l-5 5z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 15px center;padding-left:0;padding-right:30px}.auth-input select option{background:#16213e;color:#fff;padding:10px}.auth-input input::placeholder{color:#666}.auth-input:focus-within{border-color:#00d4ff}.auth-btn{width:100%;padding:15px;background:linear-gradient(135deg,#00d4ff 0,#09c 100%);border:none;border-radius:8px;color:#fff;font-size:16px;font-weight:700;cursor:pointer;margin-top:10px}.auth-btn:hover{transform:translateY(-2px);box-shadow:0 5px 20px rgba(0,212,255,.3)}.auth-switch{text-align:center;margin-top:20px;color:#888;font-size:14px}.auth-switch a{color:#00d4ff;text-decoration:none}.user-dropdown{position:absolute;top:56px;right:10px;background:#212121;border:1px solid #333;border-radius:8px;padding:15px;min-width:150px;z-index:1001}.user-dropdown span{display:block;color:#00d4ff;font-weight:700;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid #333}.user-dropdown button{width:100%;padding:10px;background:#e74c3c;border:none;border-radius:5px;color:#fff;cursor:pointer}.user-dropdown button:hover{background:#c0392b}.mypage-info{background:#0f0f23;border-radius:10px;padding:15px}.info-row{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #333}.info-row:last-child{border-bottom:none}.info-row span:first-child{color:#888}.info-row span:last-child{color:#fff;font-weight:500}.info-row.highlight{background:linear-gradient(135deg,rgba(0,212,255,.1) 0,rgba(0,153,204,.1) 100%);border-radius:8px;padding:15px;margin:10px 0}.info-row.highlight span:last-child{color:gold;font-size:18px;font-weight:700}.exchange-item{background:#0f0f23;border-radius:8px;padding:12px;margin-bottom:10px;border-left:3px solid #27ae60}.exchange-item.pending{border-left-color:#f39c12}.exchange-item.rejected{border-left-color:#e74c3c}.exchange-item p{margin:5px 0;font-size:13px;color:#aaa}.exchange-item .amount{font-size:16px;font-weight:700;color:#fff}.exchange-item .status{display:inline-block;padding:3px 8px;border-radius:4px;font-size:11px}.status-pending{background:#f39c12;color:#fff}.status-approved{background:#27ae60;color:#fff}.status-rejected{background:#e74c3c;color:#fff}.simple-shop-content{max-width:500px;background:#2c3e50;border-radius:15px;padding:0}.simple-header{background:#3498db;padding:20px;text-align:center;color:#fff;border-radius:15px 15px 0 0}.simple-header h2{margin:0 0 10px 0;font-size:20px}.simple-header p{margin:0;font-size:14px;opacity:.9}.simple-grade-list{padding:20px}.simple-grade-item{display:flex;flex-direction:column;padding:25px;margin-bottom:20px;border-radius:15px;position:relative;border:2px solid transparent;transition:all .3s ease;box-shadow:0 5px 20px rgba(0,0,0,.2)}.simple-grade-item:hover{transform:translateY(-5px);box-shadow:0 15px 40px rgba(0,0,0,.4);border-color:rgba(255,255,255,.3)}.grade-content{display:flex;align-items:center;margin-bottom:20px}.silver-grade{background:linear-gradient(135deg,#95a5a6,#7f8c8d)}.gold-grade{background:linear-gradient(135deg,#f39c12,#e67e22)}.diamond-grade{background:linear-gradient(135deg,#3498db,#2980b9)}.vip-grade{background:linear-gradient(135deg,#9b59b6,#8e44ad)}.grade-icon{font-size:30px;margin-right:15px}.grade-details{flex:1;color:#fff}.grade-name{font-size:16px;font-weight:700;margin-bottom:5px}.grade-desc{font-size:12px;opacity:.9;margin-bottom:5px}.grade-price{font-size:18px;font-weight:700}.grade-buttons{padding:0 20px 20px 20px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.grade-buy-btn{width:100%;padding:18px 25px;border:none;border-radius:30px;color:#fff;font-weight:700;font-size:16px;cursor:pointer;transition:all .3s ease;box-shadow:0 5px 20px rgba(0,0,0,.3);text-transform:none;letter-spacing:.5px;display:flex;align-items:center;justify-content:center;gap:8px}.silver-btn{background:linear-gradient(135deg,#95a5a6 0,#7f8c8d 100%);box-shadow:0 5px 20px rgba(149,165,166,.4)}.gold-btn{background:linear-gradient(135deg,#f39c12 0,#e67e22 100%);box-shadow:0 5px 20px rgba(243,156,18,.4)}.diamond-btn{background:linear-gradient(135deg,#3498db 0,#2980b9 100%);box-shadow:0 5px 20px rgba(52,152,219,.4)}.vip-btn{background:linear-gradient(135deg,#9b59b6 0,#8e44ad 100%);box-shadow:0 5px 20px rgba(155,89,182,.4)}.grade-buy-btn:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 10px 30px rgba(0,0,0,.5)}.grade-buy-btn:active{transform:translateY(-1px) scale(.98)}.grade-buy-btn i{font-size:18px}.simple-footer{background:#1a252f;padding:15px;text-align:center;border-radius:0 0 15px 15px}.simple-footer p{color:#f39c12;margin:2px 0;font-size:11px}.simple-charge-content{max-width:400px;background:#2c3e50;border-radius:15px;padding:0}.current-points-simple{background:#1a252f;padding:15px 20px;display:flex;justify-content:space-between;align-items:center;color:#fff}.points-display{color:#f1c40f;font-size:16px;font-weight:700}.charge-list{padding:20px}.charge-item-simple{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;margin-bottom:12px;background:linear-gradient(135deg,#34495e 0,#2c3e50 100%);border-radius:12px;cursor:pointer;transition:all .3s ease;color:#fff;border:2px solid transparent;box-shadow:0 2px 10px rgba(0,0,0,.1)}.charge-item-simple:hover{background:linear-gradient(135deg,#3e5266 0,#34495e 100%);transform:translateY(-2px);box-shadow:0 5px 20px rgba(0,0,0,.2);border-color:rgba(243,156,18,.3)}.charge-item-simple.selected{background:linear-gradient(135deg,#f39c12 0,#e67e22 100%);color:#fff;border-color:#f39c12;box-shadow:0 5px 20px rgba(243,156,18,.4)}.charge-amount{font-weight:600}.charge-price{color:#f39c12;font-weight:700}.charge-item-simple.selected .charge-price{color:#fff}.custom-input-simple{margin:0 20px 20px 20px;background:#1a252f;border-radius:8px;padding:12px 15px;display:flex;align-items:center;gap:10px}.custom-input-simple i{color:#f39c12}.custom-input-simple input{background:0 0;border:none;color:#fff;font-size:14px;flex:1;outline:0}.custom-input-simple input::placeholder{color:#7f8c8d}.charge-btn-simple{margin:20px 20px 20px 20px;background:linear-gradient(135deg,#f39c12 0,#e67e22 100%);color:#fff;border:none;border-radius:25px;padding:18px 25px;font-size:18px;font-weight:700;cursor:pointer;width:calc(100% - 40px);transition:all .3s ease;box-shadow:0 5px 20px rgba(243,156,18,.3);text-transform:uppercase;letter-spacing:1px}.charge-btn-simple:hover{background:linear-gradient(135deg,#e67e22 0,#d35400 100%);transform:translateY(-3px);box-shadow:0 8px 30px rgba(243,156,18,.5)}.charge-btn-simple:active{transform:translateY(-1px)}.tab-btn{padding:10px 20px;background:#16213e;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:14px;transition:all .3s}.tab-btn:hover{background:#1a2a4e}.tab-btn.active{background:linear-gradient(135deg,#667eea 0,#764ba2 100%)}#support-write .form-group textarea{font-family:inherit}#my-support-list::-webkit-scrollbar{width:6px}#my-support-list::-webkit-scrollbar-track{background:#0f0f23}#my-support-list::-webkit-scrollbar-thumb{background:#333;border-radius:3px}@media (max-width:768px){.game-categories{display:flex!important;margin-bottom:20px}}@media (max-width:480px){.game-categories{display:flex!important;margin-bottom:16px}}@media (max-width:768px){.shop-items{gap:10px}.shop-item{padding:12px;gap:12px}.item-icon{width:40px;height:40px;font-size:20px}.item-info h4{font-size:14px}.item-info p{font-size:11px}.item-price{font-size:14px}.charge-options{gap:8px}.charge-item{padding:12px 15px}.charge-price{font-size:14px}}@media (max-width:480px){.shop-item{flex-direction:column;text-align:center;padding:15px}.item-icon{width:60px;height:60px;font-size:30px;margin-bottom:10px}.item-info{margin-bottom:10px}.item-price{font-size:16px;font-weight:700}.charge-item{padding:15px;border-radius:10px}}#itemshop-modal .itemshop-container{background:#1a1a2e!important;padding:0!important;border-radius:16px!important;width:90%!important;max-width:500px!important;position:relative!important;max-height:90vh!important;overflow-y:auto!important}#itemshop-modal .itemshop-close{position:absolute!important;top:15px!important;right:20px!important;background:0 0!important;border:none!important;color:#888!important;font-size:28px!important;cursor:pointer!important;z-index:10!important}#itemshop-modal .itemshop-header{background:linear-gradient(135deg,#667eea,#764ba2)!important;padding:25px!important;text-align:center!important;border-radius:16px 16px 0 0!important}#itemshop-modal .itemshop-header h2{margin:0!important;color:#fff!important;font-size:22px!important}#itemshop-modal .itemshop-header p{margin:10px 0 0!important;color:rgba(255,255,255,.9)!important;font-size:14px!important}#itemshop-modal .itemshop-body{padding:20px!important}#itemshop-modal .grade-card{padding:20px!important;margin-bottom:15px!important;border-radius:12px!important}#itemshop-modal .grade-card.silver{background:linear-gradient(135deg,#95a5a6,#7f8c8d)!important}#itemshop-modal .grade-card.gold{background:linear-gradient(135deg,#f39c12,#e67e22)!important}#itemshop-modal .grade-card.diamond{background:linear-gradient(135deg,#3498db,#2980b9)!important}#itemshop-modal .grade-card.vip{background:linear-gradient(135deg,#9b59b6,#8e44ad)!important}#itemshop-modal .grade-info{display:flex!important;align-items:center!important;margin-bottom:15px!important}#itemshop-modal .grade-icon{font-size:35px!important;margin-right:15px!important}#itemshop-modal .grade-details{flex:1!important;color:#fff!important}#itemshop-modal .grade-name{font-size:18px!important;font-weight:700!important;color:#fff!important}#itemshop-modal .grade-desc{font-size:13px!important;opacity:.9!important;color:#fff!important}#itemshop-modal .grade-price{font-size:20px!important;font-weight:700!important;margin-top:5px!important;color:#fff!important}#itemshop-modal .buy-btn{display:block!important;visibility:visible!important;opacity:1!important;width:100%!important;height:50px!important;padding:0!important;border:none!important;border-radius:30px!important;color:#fff!important;font-size:16px!important;font-weight:700!important;cursor:pointer!important;box-shadow:0 4px 15px rgba(0,0,0,.3)!important;text-align:center!important;line-height:50px!important}#itemshop-modal .buy-btn.silver-btn{background:#667eea!important}#itemshop-modal .buy-btn.gold-btn{background:#c0392b!important}#itemshop-modal .buy-btn.diamond-btn{background:#1a5276!important}#itemshop-modal .buy-btn.vip-btn{background:#6c3483!important}#itemshop-modal .buy-btn:hover{transform:translateY(-2px)!important;box-shadow:0 6px 20px rgba(0,0,0,.4)!important}#itemshop-modal .itemshop-footer{background:#0f0f23!important;padding:15px!important;text-align:center!important;border-radius:0 0 16px 16px!important}#itemshop-modal .itemshop-footer p{margin:0!important;color:#f39c12!important;font-size:12px!important}#itemshop-modal .itemshop-footer p+p{margin-top:5px!important}.stream-player-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:#000;z-index:10000;display:flex;align-items:center;justify-content:center;animation:fadeIn .3s ease}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.stream-bg-blur{position:absolute;top:0;left:0;width:100%;height:100%;background-size:cover;background-position:center;filter:blur(30px) brightness(.3);transform:scale(1.1)}.stream-loading-container{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:24px}.stream-loader{width:60px;height:60px;position:relative}.stream-loader::after,.stream-loader::before{content:'';position:absolute;width:100%;height:100%;border-radius:50%;border:3px solid transparent}.stream-loader::before{border-top-color:#00d4ff;animation:spin 1s linear infinite}.stream-loader::after{border-bottom-color:#ff0050;animation:spin 1s linear infinite reverse;animation-delay:.3s}@keyframes spin{to{transform:rotate(360deg)}}.stream-loading-text{font-size:16px;color:#fff;font-weight:500;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,100%{opacity:.6}50%{opacity:1}}.loading-dots::after{content:'';animation:dots 1.5s steps(4,end) infinite}@keyframes dots{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}100%{content:''}}.stream-close-btn{position:absolute;top:20px;right:20px;width:44px;height:44px;background:rgba(255,255,255,.1);backdrop-filter:blur(10px);border:none;border-radius:50%;color:#fff;font-size:20px;cursor:pointer;z-index:10;transition:all .3s;display:flex;align-items:center;justify-content:center}.stream-close-btn:hover{background:rgba(255,255,255,.2);transform:scale(1.1)}.stream-access-denied{position:relative;z-index:2;animation:slideUp .5s cubic-bezier(.16,1,.3,1)}@keyframes slideUp{from{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.access-denied-card{background:rgba(255,255,255,.08);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:40px;text-align:center;max-width:380px;box-shadow:0 25px 50px rgba(0,0,0,.5)}.access-denied-icon{width:80px;height:80px;margin:0 auto 24px;background:linear-gradient(135deg,rgba(255,0,80,.2),rgba(255,100,100,.1));border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:36px;animation:iconPulse 2s ease-in-out infinite}.access-denied-icon.warning{background:linear-gradient(135deg,rgba(255,180,0,.2),rgba(255,200,50,.1))}.access-denied-icon.expired{background:linear-gradient(135deg,rgba(150,150,150,.2),rgba(100,100,100,.1))}@keyframes iconPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}.access-denied-title{font-size:22px;font-weight:700;color:#fff;margin-bottom:12px}.access-denied-message{font-size:14px;color:rgba(255,255,255,.7);line-height:1.6;margin-bottom:28px}.access-user-info{background:rgba(0,0,0,.3);border-radius:12px;padding:16px;margin-bottom:24px}.access-user-info-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0}.access-user-info-row:not(:last-child){border-bottom:1px solid rgba(255,255,255,.1)}.access-user-info-label{font-size:13px;color:rgba(255,255,255,.5)}.access-user-info-value{font-size:14px;font-weight:600;color:#fff}.access-user-info-value.highlight{color:#00d4ff}.access-user-info-value.danger{color:#ff4757}.access-denied-buttons{display:flex;flex-direction:column;gap:12px}.access-btn{padding:14px 24px;border-radius:12px;font-size:15px;font-weight:600;cursor:pointer;transition:all .3s;border:none;display:flex;align-items:center;justify-content:center;gap:8px}.access-btn-primary{background:linear-gradient(135deg,#667eea 0,#764ba2 100%);color:#fff;box-shadow:0 4px 15px rgba(102,126,234,.4)}.access-btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(102,126,234,.5)}.access-btn-secondary{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.2)}.access-btn-secondary:hover{background:rgba(255,255,255,.15)}.access-btn-charge{background:linear-gradient(135deg,#f093fb 0,#f5576c 100%);color:#fff;box-shadow:0 4px 15px rgba(245,87,108,.4)}.access-btn-charge:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(245,87,108,.5)}.access-denied-icon.login{background:linear-gradient(135deg,rgba(0,212,255,.2),rgba(102,126,234,.1))}.stream-player-wrapper{position:relative;width:100%;height:100%;z-index:1}.stream-player-wrapper iframe{width:100%;height:100%;border:none}@media (max-width:480px){.access-denied-card{margin:20px;padding:30px 24px}.access-denied-icon{width:64px;height:64px;font-size:28px}.access-denied-title{font-size:18px}.stream-close-btn{top:12px;right:12px;width:40px;height:40px}}.skeleton{background:linear-gradient(90deg,#1a1a2e 25%,#252540 50%,#1a1a2e 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:8px}.skeleton-card{background:#1a1a2e;border-radius:12px;overflow:hidden}.skeleton-thumbnail{width:100%;height:157px;background:linear-gradient(90deg,#1a1a2e 25%,#252540 50%,#1a1a2e 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}.skeleton-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(90deg,#1a1a2e 25%,#252540 50%,#1a1a2e 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}.skeleton-text{height:14px;border-radius:4px;background:linear-gradient(90deg,#1a1a2e 25%,#252540 50%,#1a1a2e 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}.skeleton-text.short{width:60%}.skeleton-text.medium{width:80%}@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}.ripple-btn{position:relative;overflow:hidden}.ripple-btn::after{content:'';position:absolute;top:50%;left:50%;width:0;height:0;background:rgba(255,255,255,.3);border-radius:50%;transform:translate(-50%,-50%);transition:width .4s ease,height .4s ease,opacity .4s ease;opacity:0}.ripple-btn:active::after{width:200px;height:200px;opacity:1;transition:0s}.pull-indicator{position:fixed;top:56px;left:50%;transform:translateX(-50%) translateY(-100%);background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:10px 20px;border-radius:20px;font-size:12px;z-index:999;transition:transform .3s ease;display:flex;align-items:center;gap:8px}.pull-indicator.visible{transform:translateX(-50%) translateY(10px)}.pull-indicator i{animation:spin 1s linear infinite}@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width:768px){.game-categories{padding:0 12px;gap:10px!important;scroll-snap-type:x mandatory}.category-item{min-width:200px!important;scroll-snap-align:start}.category-item:active{transform:scale(.98)}}@media (max-width:480px){.header{background:linear-gradient(180deg,rgba(33,33,33,.98) 0,rgba(33,33,33,.95) 100%);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.logo{margin-right:12px}.header-center{margin:0 8px 0 0}.logo-text{font-size:18px!important}.search-bar{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:12px}.search-bar:focus-within{border-color:rgba(102,126,234,.4)!important;box-shadow:0 0 0 2px rgba(102,126,234,.1)}.search-btn{padding:6px 10px;margin:3px;border-radius:10px}}.modern-modal-content{background:linear-gradient(145deg,rgba(20,20,40,.95) 0,rgba(15,15,35,.98) 100%);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:24px;width:95%;max-width:480px;max-height:90vh;overflow-y:auto;position:relative;box-shadow:0 25px 80px rgba(0,0,0,.5),0 0 100px rgba(102,126,234,.1),inset 0 1px 0 rgba(255,255,255,.1);animation:modalSlideUp .4s cubic-bezier(.16,1,.3,1)}.modern-modal-content.grade-modal{max-width:520px}@keyframes modalSlideUp{from{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modern-close{position:absolute;top:16px;right:16px;width:36px;height:36px;background:rgba(255,255,255,.1);border:none;border-radius:50%;color:rgba(255,255,255,.7);font-size:16px;cursor:pointer;z-index:10;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.modern-close:hover{background:rgba(255,255,255,.2);color:#fff;transform:rotate(90deg)}.modern-modal-header{position:relative;padding:40px 30px 30px;text-align:center;overflow:hidden}.modern-modal-header .header-glow{position:absolute;top:-50%;left:50%;transform:translateX(-50%);width:200%;height:200%;background:radial-gradient(ellipse at center,rgba(102,126,234,.3) 0,transparent 60%);pointer-events:none}.grade-header .header-glow{background:radial-gradient(ellipse at center,rgba(147,51,234,.3) 0,transparent 60%)}.charge-header .header-glow{background:radial-gradient(ellipse at center,rgba(251,191,36,.3) 0,transparent 60%)}.modern-modal-header .header-icon{width:70px;height:70px;margin:0 auto 16px;background:linear-gradient(135deg,#667eea 0,#764ba2 100%);border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:28px;color:#fff;box-shadow:0 10px 40px rgba(102,126,234,.4);animation:iconFloat 3s ease-in-out infinite}.charge-header .header-icon{background:linear-gradient(135deg,#f59e0b 0,#d97706 100%);box-shadow:0 10px 40px rgba(245,158,11,.4)}@keyframes iconFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}.modern-modal-header h2{font-size:24px;font-weight:700;color:#fff;margin:0 0 8px;letter-spacing:-.5px}.modern-modal-header p{font-size:14px;color:rgba(255,255,255,.6);margin:0}.grade-cards-container{padding:0 20px 20px;display:flex;flex-direction:column;gap:16px}.grade-card{position:relative;background:linear-gradient(145deg,rgba(255,255,255,.08) 0,rgba(255,255,255,.02) 100%);border:1px solid rgba(255,255,255,.1);border-radius:20px;padding:20px;cursor:pointer;transition:all .4s cubic-bezier(.16, 1, .3, 1);overflow:hidden}.grade-card:hover{transform:translateY(-4px) scale(1.02);border-color:rgba(255,255,255,.2)}.grade-card .card-shine{position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);transition:left .6s ease}.grade-card:hover .card-shine{left:100%}.silver-card:hover{border-color:rgba(192,192,192,.5);box-shadow:0 10px 40px rgba(192,192,192,.2)}.gold-card:hover{border-color:rgba(255,193,7,.5);box-shadow:0 10px 40px rgba(255,193,7,.2)}.diamond-card:hover{border-color:rgba(59,130,246,.5);box-shadow:0 10px 40px rgba(59,130,246,.2)}.vip-card:hover{border-color:rgba(168,85,247,.5);box-shadow:0 10px 40px rgba(168,85,247,.2)}.quick-card:hover{border-color:rgba(231,76,60,.5);box-shadow:0 10px 40px rgba(231,76,60,.2)}.popular-badge{position:absolute;top:-1px;right:20px;background:linear-gradient(135deg,#f59e0b 0,#d97706 100%);color:#fff;font-size:10px;font-weight:700;padding:6px 12px;border-radius:0 0 10px 10px;letter-spacing:1px}.grade-badge{display:inline-block;font-size:10px;font-weight:700;padding:4px 10px;border-radius:6px;letter-spacing:1px;margin-bottom:12px}.grade-badge.silver{background:linear-gradient(135deg,#9ca3af 0,#6b7280 100%);color:#fff}.grade-badge.gold{background:linear-gradient(135deg,#fbbf24 0,#d97706 100%);color:#fff}.grade-badge.diamond{background:linear-gradient(135deg,#3b82f6 0,#1d4ed8 100%);color:#fff}.grade-badge.vip{background:linear-gradient(135deg,#a855f7 0,#7c3aed 100%);color:#fff}.grade-badge.quick{background:linear-gradient(135deg,#e74c3c 0,#c0392b 100%);color:#fff}.grade-icon-wrap{position:absolute;top:20px;right:20px}.grade-emoji{font-size:36px;filter:drop-shadow(0 4px 8px rgba(0, 0, 0, .3))}.icon-glow{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:60px;height:60px;border-radius:50%;filter:blur(20px);opacity:.5}.silver-glow{background:silver}.gold-glow{background:#fbbf24}.diamond-glow{background:#3b82f6}.vip-glow{background:#a855f7}.quick-glow{background:#e74c3c}.grade-details h3{font-size:18px;font-weight:600;color:#fff;margin:0 0 12px}.benefits-list{list-style:none;padding:0;margin:0 0 16px}.benefits-list li{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.7);margin-bottom:6px}.benefits-list li i{color:#10b981;font-size:10px}.grade-price-tag{display:flex;align-items:baseline;gap:4px;margin-bottom:16px}.price-amount{font-size:24px;font-weight:700;color:#fff}.price-period{font-size:13px;color:rgba(255,255,255,.5)}.grade-select-btn{width:100%;padding:14px 20px;border:none;border-radius:12px;font-size:14px;font-weight:600;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .3s ease}.grade-select-btn i{transition:transform .3s ease}.grade-select-btn:hover i{transform:translateX(4px)}.silver-btn{background:linear-gradient(135deg,#9ca3af 0,#6b7280 100%)}.gold-btn{background:linear-gradient(135deg,#fbbf24 0,#d97706 100%)}.diamond-btn{background:linear-gradient(135deg,#3b82f6 0,#1d4ed8 100%)}.vip-btn{background:linear-gradient(135deg,#a855f7 0,#7c3aed 100%)}.quick-btn{background:linear-gradient(135deg,#e74c3c 0,#c0392b 100%)}.silver-btn:hover{box-shadow:0 8px 25px rgba(156,163,175,.4)}.gold-btn:hover{box-shadow:0 8px 25px rgba(251,191,36,.4)}.diamond-btn:hover{box-shadow:0 8px 25px rgba(59,130,246,.4)}.vip-btn:hover{box-shadow:0 8px 25px rgba(168,85,247,.4)}.quick-btn:hover{box-shadow:0 8px 25px rgba(231,76,60,.4)}.current-points-display{margin:0 20px 24px;padding:20px;background:linear-gradient(145deg,rgba(251,191,36,.15) 0,rgba(217,119,6,.1) 100%);border:1px solid rgba(251,191,36,.3);border-radius:16px;display:flex;align-items:center;gap:16px}.points-icon{width:50px;height:50px;background:linear-gradient(135deg,#f59e0b 0,#d97706 100%);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff}.points-info{display:flex;flex-direction:column;gap:4px}.points-label{font-size:12px;color:rgba(255,255,255,.6)}.points-value{font-size:24px;font-weight:700;color:#fbbf24}.charge-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:0 20px 20px}.charge-card{position:relative;background:linear-gradient(145deg,rgba(255,255,255,.08) 0,rgba(255,255,255,.02) 100%);border:2px solid rgba(255,255,255,.1);border-radius:16px;cursor:pointer;transition:all .3s cubic-bezier(.16, 1, .3, 1);overflow:hidden}.charge-card:hover{border-color:rgba(251,191,36,.5);transform:translateY(-2px);box-shadow:0 8px 30px rgba(251,191,36,.2)}.charge-card.selected{border-color:#f59e0b;background:linear-gradient(145deg,rgba(251,191,36,.2) 0,rgba(217,119,6,.1) 100%);box-shadow:0 8px 30px rgba(251,191,36,.3)}.charge-card.large{grid-column:span 2}.charge-card-inner{padding:20px;text-align:center;position:relative}.best-value{position:absolute;top:0;right:0;background:linear-gradient(135deg,#ef4444 0,#dc2626 100%);color:#fff;font-size:10px;font-weight:700;padding:4px 10px;border-radius:0 14px 0 10px;letter-spacing:.5px}.charge-points{display:block;font-size:18px;font-weight:700;color:#fff;margin-bottom:4px}.charge-won{display:block;font-size:14px;color:#fbbf24;font-weight:500}.custom-charge-input{margin:0 20px 20px;background:rgba(255,255,255,.05);border:2px solid rgba(255,255,255,.1);border-radius:14px;display:flex;align-items:center;padding:0 16px;transition:all .3s ease}.custom-charge-input:focus-within{border-color:rgba(251,191,36,.5);background:rgba(251,191,36,.05)}.custom-charge-input .input-icon{color:rgba(255,255,255,.4);font-size:16px}.custom-charge-input input{flex:1;background:0 0;border:none;padding:16px 12px;color:#fff;font-size:15px;outline:0}.custom-charge-input input::placeholder{color:rgba(255,255,255,.4)}.custom-charge-input .input-suffix{color:#fbbf24;font-weight:600;font-size:15px}.charge-submit-btn{margin:0 20px 20px;width:calc(100% - 40px);padding:18px 24px;background:linear-gradient(135deg,#f59e0b 0,#d97706 100%);border:none;border-radius:14px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:all .3s ease;box-shadow:0 8px 30px rgba(245,158,11,.3)}.charge-submit-btn:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(245,158,11,.4)}.charge-submit-btn i{transition:transform .3s ease}.charge-submit-btn:hover i{transform:translateX(4px)}.modal-notice{padding:16px 20px 24px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:12px;color:rgba(255,255,255,.5)}.modal-notice i{color:rgba(251,191,36,.7)}@media (max-width:480px){.modern-modal-content{border-radius:24px 24px 0 0;max-height:85vh}.modern-modal-header{padding:30px 20px 20px}.modern-modal-header .header-icon{width:60px;height:60px;font-size:24px}.modern-modal-header h2{font-size:20px}.grade-cards-container{padding:0 16px 16px;gap:12px}.grade-card{padding:16px}.grade-emoji{font-size:28px}.grade-details h3{font-size:16px}.benefits-list li{font-size:12px}.price-amount{font-size:20px}.charge-grid{padding:0 16px 16px;gap:10px}.charge-card-inner{padding:16px}.charge-points{font-size:16px}.charge-won{font-size:13px}.current-points-display{margin:0 16px 20px;padding:16px}.points-value{font-size:20px}.custom-charge-input{margin:0 16px 16px}.charge-submit-btn{margin:0 16px 16px;width:calc(100% - 32px);padding:16px 20px}}.modern-modal-content::-webkit-scrollbar{width:6px}.modern-modal-content::-webkit-scrollbar-track{background:0 0}.modern-modal-content::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:3px}.modern-modal-content::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.3)}.exchange-modal{max-width:440px}.exchange-header .header-glow{background:radial-gradient(ellipse at center,rgba(16,185,129,.3) 0,transparent 60%)}.exchange-header .header-icon{background:linear-gradient(135deg,#10b981 0,#059669 100%);box-shadow:0 10px 40px rgba(16,185,129,.4)}.exchange-points-display{margin:0 20px 24px;padding:20px;background:linear-gradient(145deg,rgba(16,185,129,.15) 0,rgba(5,150,105,.1) 100%);border:1px solid rgba(16,185,129,.3);border-radius:16px;display:flex;align-items:center;gap:16px}.exchange-points-display .points-icon{width:50px;height:50px;background:linear-gradient(135deg,#10b981 0,#059669 100%);border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:20px;color:#fff}.exchange-points-display .points-value{color:#10b981}.exchange-input-group{margin:0 20px 16px}.input-label{display:flex;align-items:center;gap:8px;font-size:13px;color:rgba(255,255,255,.7);margin-bottom:8px}.input-label i{font-size:12px;color:#10b981}.modern-input-wrap{position:relative;background:rgba(255,255,255,.05);border:2px solid rgba(255,255,255,.1);border-radius:12px;transition:all .3s ease}.modern-input-wrap:focus-within{border-color:rgba(16,185,129,.5);background:rgba(16,185,129,.05)}.modern-input-wrap input{width:100%;background:0 0;border:none;padding:14px 16px;color:#fff;font-size:15px;outline:0}.modern-input-wrap input::placeholder{color:rgba(255,255,255,.4)}.modern-input-wrap .input-suffix{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:#10b981;font-weight:600;font-size:15px}.modern-select-wrap{position:relative;background:rgba(255,255,255,.05);border:2px solid rgba(255,255,255,.1);border-radius:12px;transition:all .3s ease}.modern-select-wrap:focus-within{border-color:rgba(16,185,129,.5);background:rgba(16,185,129,.05)}.modern-select-wrap select{width:100%;background:0 0;border:none;padding:14px 40px 14px 16px;color:#fff;font-size:15px;outline:0;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.modern-select-wrap select option{background:#1a1a2e;color:#fff;padding:10px}.modern-select-wrap .select-arrow{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.4);font-size:12px;pointer-events:none}.account-section{margin:24px 20px 20px;padding:20px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:16px}.account-section .section-title{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:#fff;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.1)}.account-section .section-title i{color:#10b981}.account-section .exchange-input-group{margin:0 0 12px}.account-section .exchange-input-group:last-child{margin-bottom:0}.exchange-submit-btn{margin:20px;width:calc(100% - 40px);padding:18px 24px;background:linear-gradient(135deg,#10b981 0,#059669 100%);border:none;border-radius:14px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:all .3s ease;box-shadow:0 8px 30px rgba(16,185,129,.3)}.exchange-submit-btn:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(16,185,129,.4)}.exchange-submit-btn i{transition:transform .3s ease}.exchange-submit-btn:hover i{transform:translateX(4px)}@media (max-width:480px){.exchange-modal{max-width:100%}.exchange-points-display{margin:0 16px 20px;padding:16px}.exchange-input-group{margin:0 16px 14px}.account-section{margin:20px 16px 16px;padding:16px}.exchange-submit-btn{margin:16px;width:calc(100% - 32px);padding:16px 20px}}.grade-detail-modal{max-width:520px;background:linear-gradient(180deg,#1a1a2e 0,#0f0f1a 100%)}.grade-detail-header{background:linear-gradient(135deg,#667eea 0,#764ba2 100%);padding:24px 20px;text-align:center}.grade-detail-header h2{font-size:18px;font-weight:700;color:#fff;margin-top:12px}.grade-detail-content{padding:20px}.info-section{background:rgba(0,0,0,.3);border-radius:16px;padding:16px;margin-bottom:20px}.info-row{display:flex;justify-content:space-between;align-items:flex-start;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.08)}.info-row:last-child{border-bottom:none}.info-label{font-size:13px;color:rgba(255,255,255,.6);min-width:80px;flex-shrink:0}.info-value{font-size:13px;color:rgba(255,255,255,.9);text-align:right;line-height:1.5}.info-value.highlight{color:#ff6b9d;font-weight:700;font-size:16px}.summary-section{background:rgba(0,0,0,.3);border-radius:16px;padding:16px;margin-bottom:20px}.summary-section h3{font-size:14px;font-weight:600;color:rgba(255,255,255,.7);margin-bottom:12px}.summary-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0}.summary-label{font-size:13px;color:rgba(255,255,255,.6)}.summary-value{font-size:16px;font-weight:700;color:#ff6b9d}.summary-value.coins{color:#00d4ff}.payment-section{margin-bottom:20px}.payment-section h3{font-size:14px;font-weight:600;color:rgba(255,255,255,.7);margin-bottom:12px}.payment-options{display:flex;gap:10px}.payment-btn{flex:1;padding:12px 16px;border:2px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.05);color:rgba(255,255,255,.7);font-size:13px;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:8px}.payment-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2)}.payment-btn.active{background:linear-gradient(135deg,#ff6b9d 0,#c44569 100%);border-color:#ff6b9d;color:#fff;box-shadow:0 4px 15px rgba(255,107,157,.3)}.payment-btn i{font-size:14px}.deposit-section{background:rgba(0,0,0,.3);border-radius:12px;padding:14px 16px;margin-bottom:20px}.deposit-info{display:flex;flex-direction:column;gap:4px}.deposit-label{font-size:13px;font-weight:600;color:rgba(255,255,255,.8)}.deposit-notice{font-size:12px;color:rgba(255,255,255,.5)}.giftcard-section{background:rgba(0,0,0,.3);border-radius:12px;padding:16px;margin-bottom:20px}.form-group{margin-bottom:16px}.form-group label{display:block;font-size:13px;font-weight:600;color:rgba(255,255,255,.7);margin-bottom:8px}.modern-input{width:100%;padding:14px 16px;border:2px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(0,0,0,.4);color:#fff;font-size:14px;transition:all .3s ease}.modern-input:focus{outline:0;border-color:#667eea;background:rgba(0,0,0,.6);box-shadow:0 0 0 3px rgba(102,126,234,.2)}.modern-input::placeholder{color:rgba(255,255,255,.3)}.modern-select{width:100%;padding:14px 16px;border:2px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(0,0,0,.4);color:#fff;font-size:14px;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center}.modern-select:focus{outline:0;border-color:#667eea}.modern-select option{background:#1a1a2e;color:#fff}.phone-input-group{display:flex;align-items:center;gap:8px}.phone-input{flex:1;text-align:center;padding:14px 8px!important}.phone-separator{color:rgba(255,255,255,.4);font-size:16px}.grade-submit-btn{width:100%;padding:16px 24px;border:none;border-radius:14px;background:linear-gradient(135deg,#ff6b9d 0,#c44569 100%);color:#fff;font-size:16px;font-weight:700;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:10px;margin-top:10px}.grade-submit-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(255,107,157,.4)}.grade-submit-btn:active{transform:translateY(0)}.grade-submit-btn i{font-size:18px}@media (max-width:480px){.grade-detail-modal{max-width:100%;border-radius:24px 24px 0 0;max-height:90vh;overflow-y:auto}.grade-detail-header{padding:20px 16px;border-radius:24px 24px 0 0}.grade-detail-header h2{font-size:16px}.grade-detail-content{padding:16px}.info-section,.summary-section{padding:14px}.info-row{flex-direction:column;gap:6px;padding:10px 0}.info-value{text-align:left}.payment-options{flex-direction:column}.payment-btn{padding:14px 16px}.phone-input-group{gap:4px}.phone-input{padding:12px 4px!important;font-size:13px}.phone-separator{font-size:14px}.modern-input,.modern-select{padding:12px 14px;font-size:13px}.grade-submit-btn{padding:14px 20px;font-size:15px;border-radius:12px}}.grade-detail-modal::-webkit-scrollbar{width:6px}.grade-detail-modal::-webkit-scrollbar-track{background:rgba(255,255,255,.05)}.grade-detail-modal::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:3px}.grade-detail-modal::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.3)}