body{margin:0;padding:0;background:#00682d;font-family:Arial,sans-serif;color:#fff;}
.container{width:100%;max-width:380px;margin:0 auto;padding-bottom:80px;box-sizing:border-box;}
.header{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:#0f5a29;}
.header-left img{width:24px;height:24px;cursor:pointer;}
.logo{width:140px;}
.register{color:#fee001;font-weight:bold;font-size:15px;}
.mask{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.6);z-index:998;}
.mask.show{display:block;}
.lang-popup{position:fixed;top:0;left:-260px;width:240px;height:100%;background:#0f5a29;color:#fff;padding:20px;box-sizing:border-box;z-index:999;transition:left .3s;}
.lang-popup.show{left:0;}
.lang-title{font-size:18px;font-weight:bold;margin-bottom:20px;}
.lang-item{padding:14px 0;font-size:16px;border-bottom:1px solid rgba(255,255,255,0.1);cursor:pointer;}
.lang-item.active{color:#ffd03b;font-weight:bold;}

.banner{width:100%;height:180px;overflow:hidden;margin:10px 0;position:relative;}
.banner-track{display:flex;height:100%;will-change:transform;}
.banner-track>*{flex:0 0 100%;width:100%;height:100%;}
.banner-track img{width:100%;height:100%;object-fit:cover;display:block;}

.notice{display:flex;align-items:center;padding:8px 12px;overflow:hidden;background:linear-gradient(180deg,#023b1f,#086f0b);}
.notice-icon{width:18px;height:18px;background:url("icons/notice.png") center/contain no-repeat;margin-right:10px;flex-shrink:0;}
.notice-text{color:rgb(254,224,1);font-size:14px;white-space:nowrap;padding-left:10px;animation:notice-scroll 28s linear infinite;}
.notice-text:hover{animation-play-state:paused;}
@keyframes notice-scroll{0%{transform:translateX(100%);}100%{transform:translateX(-120%);}}

.top-nav{display:flex;background:#0f5a29;padding:10px 0;}
.top-nav-item{flex:1;text-align:center;padding:10px 0;font-size:15px;cursor:pointer;}
.top-nav-item.active{color:#ffd03b;font-weight:bold;border-bottom:3px solid #ffd03b;}

.section-title{padding:12px 12px 6px;font-size:13px;opacity:0.9;color:#fee001;}
.game-item{display:flex;align-items:center;background:rgba(255,255,255,0.08);padding:12px;border-radius:8px;margin:8px 0;}
.game-item img{width:48px;height:48px;border-radius:8px;object-fit:cover;}
.game-info{flex:1;margin-left:12px;}
.game-info .name{font-size:15px;font-weight:bold;}
.game-info .desc{font-size:12px;opacity:0.85;margin-top:4px;}
.game-btn{background:#ffd03b;color:#000;padding:6px 16px;border-radius:20px;font-weight:bold;}
.game-btn a{text-decoration:none;color:#fff;}

.news-item{background:rgba(255,255,255,0.08);border-radius:8px;padding:12px;margin:10px 0;display:flex;align-items:flex-start;}
.news-avatar{width:42px;height:42px;border-radius:50%;border:2px solid #fff;flex-shrink:0;}
.news-content{flex:1;margin-left:12px;}
.news-title{font-size:15px;color:#ffdd00;line-height:1.4;font-weight:bold;}
.news-title a{text-decoration:none;color:#ffdd00;}
.news-meta{display:flex;justify-content:space-between;align-items:flex-end;margin-top:8px;}
.news-comments{font-size:18px;font-weight:bold;color:#ffd03b;}
.news-time{font-size:12px;color:#aaa;}
.stick-item{border-left:4px solid #ffd03b;background:rgba(255,255,255,0.1);}

.about{padding:15px 12px;font-size:13px;line-height:1.6;opacity:0.9;}
.social-icons{display:flex;justify-content:center;gap:18px;margin:20px 0;}
.social-icons img{width:36px;height:36px;}

.tabbar{position:fixed;bottom:0;left:0;width:100%;height:62px;background:linear-gradient(180deg,#023b1f,#086f0b);display:flex;justify-content:space-around;align-items:center;z-index:100;border-top:1px solid rgba(255,255,255,0.1);}
.tab-item{flex:1;text-align:center;color:#aaa;font-size:11px;cursor:pointer;transition:all .3s;}
.tab-item svg{width:26px;height:26px;margin-bottom:4px;display:block;margin:0 auto;}
.tab-item.active{color:#ffd03b;}
.tab-item.active svg{fill:#ffd03b;}

@media (min-width:768px){
  .container{max-width:380px;margin:0 auto;}
  .tabbar{max-width:380px;left:50%;transform:translateX(-50%);}
  .banner{height:240px;}
}