/* 公告滚动条 */
.announce-bar{background:rgba(212,175,55,.08);border-bottom:1px solid rgba(214,175,55,.15);overflow:hidden;height:36px;line-height:36px}
.announce-bar .marquee-inner{display:inline-block;white-space:nowrap;padding-left:100%;animation:marquee 30s linear infinite}
.announce-bar .marquee-inner a{color:#D4AF37;margin-right:40px;font-size:14px}
.announce-bar .marquee-inner a:hover{text-decoration:none;color:#FFD700}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}

/* 客服弹窗 */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:9999;justify-content:center;align-items:center}
.modal-overlay.active{display:flex}
.cs-modal{background:#16181F;border:1px solid rgba(214,175,55,.3);border-radius:12px;padding:30px;max-width:360px;width:90%;text-align:center;position:relative}
.cs-modal h3{color:#D4AF37;margin-bottom:20px}
.cs-modal img{max-width:200px;border-radius:8px;margin:15px auto;display:block}
.cs-modal .close-btn{position:absolute;top:10px;right:15px;color:#8F92A1;cursor:pointer;font-size:24px}
.rest-tip{background:rgba(255,152,0,.15);border:1px solid #FF9800;color:#FF9800;padding:12px;border-radius:8px;text-align:center;margin-bottom:16px}

/* JND28 黑金主题 */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:-apple-system,"Microsoft YaHei",sans-serif;background:linear-gradient(135deg,#0D0E12,#16181F);color:#F3E5AB;min-height:100vh}
a{color:#D4AF37;text-decoration:none}
a:hover{text-decoration:underline}

/* 布局 */
.container{max-width:1200px;margin:0 auto;padding:20px}
.card{background:rgba(22,24,31,.85);border:1px solid rgba(214,175,55,.15);border-radius:12px;padding:24px;box-shadow:0 4px 20px rgba(214,175,55,.08);backdrop-filter:blur(10px)}
.nav{display:flex;justify-content:space-between;align-items:center;padding:15px 30px;background:rgba(13,14,18,.9);border-bottom:1px solid rgba(214,175,55,.15)}
.nav .logo{font-size:22px;font-weight:700;color:#D4AF37;letter-spacing:2px}
.nav .balance{font-size:18px;color:#F3E5AB}
.nav .btn-sm{padding:6px 16px;border-radius:6px;font-size:13px;cursor:pointer;border:none}

/* 按钮 */
.btn{display:inline-block;padding:12px 32px;border:none;border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;transition:all .3s}
.btn-gold{background:linear-gradient(135deg,#FFD700,#D4AF37);color:#0D0E12}
.btn-gold:hover{box-shadow:0 0 20px rgba(212,175,55,.4);transform:translateY(-1px)}
.btn-outline{background:transparent;border:1px solid #D4AF37;color:#D4AF37}
.btn-outline:hover{background:rgba(212,175,55,.1)}
.btn-danger{background:#FF1744;color:#fff}
.btn-block{display:block;width:100%;text-align:center}

/* 表单 */
.form-group{margin-bottom:18px}
.form-group label{display:block;margin-bottom:6px;color:#8F92A1;font-size:14px}
.form-input{width:100%;padding:12px 16px;background:#0D0E12;border:1px solid rgba(214,175,55,.2);border-radius:8px;color:#F3E5AB;font-size:15px;outline:none;transition:border .3s}
.form-input:focus{border-color:#D4AF37;box-shadow:0 0 8px rgba(212,175,55,.2)}

/* 登录卡片 */
.auth-wrap{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:20px}
.auth-card{width:400px;max-width:100%}
.auth-card h1{text-align:center;font-size:28px;color:#D4AF37;margin-bottom:30px;letter-spacing:3px}

/* 游戏大厅 */
.room-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin-top:20px}
.room-card{text-align:center;padding:30px 20px;cursor:pointer;transition:transform .3s}
.room-card:hover{transform:translateY(-4px)}
.room-card.vip{border:2px solid #D4AF37}
.room-card .countdown{font-size:36px;font-weight:700;color:#D4AF37;margin:15px 0}
.room-card .tag{display:inline-block;padding:2px 10px;border-radius:4px;font-size:12px;margin-bottom:10px}

/* 游戏房间 */
.game-layout{display:grid;grid-template-columns:1fr 380px;gap:16px;padding:16px;min-height:calc(100vh - 60px)}
@media(max-width:768px){.game-layout{grid-template-columns:1fr}}
.status-bar{text-align:center;padding:16px;border-radius:10px;margin-bottom:16px}
.status-bar.sealed{background:rgba(255,23,68,.15);border:1px solid #FF1744;animation:pulse 1s infinite}
@keyframes pulse{50%{opacity:.7}}
.countdown-big{font-size:48px;font-weight:700}
.countdown-big.urgent{color:#FF1744;animation:breathe 1s infinite}
@keyframes breathe{50%{transform:scale(1.1)}}

/* 开奖球 */
.balls{display:flex;align-items:center;gap:10px;justify-content:center;margin:16px 0}
.ball{width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;background:linear-gradient(135deg,#D4AF37,#8B7320);color:#0D0E12;box-shadow:0 2px 10px rgba(212,175,55,.3)}
.ball.result{width:60px;height:60px;font-size:24px;background:linear-gradient(135deg,#00E676,#00C853);color:#0D0E12}

/* 投注面板 */
.bet-panel .bet-section-title{color:#8F92A1;font-size:13px;margin:14px 0 8px;letter-spacing:1px}
.bet-panel .bet-section-title:first-of-type{margin-top:0}
.bet-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:4px}
.bet-quick-2{grid-template-columns:repeat(2,1fr)}
.bet-btn{padding:0;border:1px solid rgba(214,175,55,.25);border-radius:10px;cursor:pointer;transition:all .2s;background:rgba(13,14,18,.95);overflow:hidden;display:flex;flex-direction:column;text-align:center}
.bet-btn .bet-top{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px 6px 10px;min-height:48px}
.bet-btn .bet-name{font-size:17px;font-weight:700;line-height:1.2;color:#D4AF37}
.bet-btn .bet-sub{font-size:10px;color:#8F92A1;font-weight:400;margin-top:3px;line-height:1}
.bet-btn .bet-odds-bar{width:100%;background:linear-gradient(135deg,#FFD700,#D4AF37);padding:6px 4px}
.bet-btn .bet-odds{font-size:8.5px;font-weight:700;color:#0D0E12;line-height:1;display:block}
.bet-btn:hover{border-color:rgba(212,175,55,.6);box-shadow:0 0 12px rgba(212,175,55,.15)}
.bet-btn.active{border-color:#FFD700;box-shadow:0 0 16px rgba(212,175,55,.4)}
.bet-btn.active .bet-top{background:linear-gradient(180deg,rgba(212,175,55,.25),rgba(13,14,18,.6))}
.bet-btn.active .bet-name{color:#FFD700}
.bet-btn.active .bet-sub{color:#D4AF37}
.num-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:16px}
.num-btn{padding:0;border-radius:8px;border:1px solid rgba(214,175,55,.22);background:rgba(13,14,18,.9);cursor:pointer;transition:all .2s;overflow:hidden;display:flex;flex-direction:column;text-align:center}
.num-btn .num-top{padding:8px 2px 6px;display:flex;align-items:center;justify-content:center}
.num-btn .num-val{font-size:15px;font-weight:700;color:#D4AF37;line-height:1}
.num-btn .num-odds-bar{width:100%;background:linear-gradient(135deg,#FFD700,#D4AF37);padding:4px 2px}
.num-btn .num-odds{font-size:7.5px;font-weight:700;color:#0D0E12;line-height:1;display:block;white-space:nowrap}
.num-btn:hover{border-color:rgba(212,175,55,.5)}
.num-btn.active{border-color:#FFD700;box-shadow:0 0 10px rgba(212,175,55,.35)}
.num-btn.active .num-top{background:rgba(212,175,55,.15)}
.num-btn.active .num-val{color:#FFD700}
.selected-info{text-align:center;margin-bottom:12px;font-size:14px;min-height:20px}
.btn-bet-confirm{padding:16px!important;font-size:18px!important}
.bet-amount{display:flex;gap:10px;align-items:center;margin-bottom:16px}
.bet-amount input{flex:1}

/* 历史表格 */
.data-table{width:100%;border-collapse:collapse;font-size:14px}
.data-table th{background:rgba(212,175,55,.15);color:#D4AF37;padding:10px;text-align:left}
.data-table td{padding:10px;border-bottom:1px solid rgba(214,175,55,.08)}
.data-table tr:nth-child(even){background:rgba(22,24,31,.5)}
.text-green{color:#00E676}
.text-red{color:#FF1744}
.text-gold{color:#D4AF37}
.text-muted{color:#8F92A1}

/* 提示气泡 */
.toast{position:fixed;top:20px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#FFD700,#D4AF37);color:#0D0E12;padding:10px 24px;border-radius:8px;font-weight:700;z-index:999;display:none}

/* 滑块验证 */
.slider-wrap{margin:15px 0;position:relative;height:40px;background:#0D0E12;border:1px solid rgba(214,175,55,.2);border-radius:20px;overflow:hidden}
.slider-btn{position:absolute;left:0;top:0;width:50px;height:38px;background:linear-gradient(135deg,#FFD700,#D4AF37);border-radius:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#0D0E12;font-weight:700;z-index:2}
.slider-text{position:absolute;width:100%;text-align:center;line-height:40px;color:#8F92A1;font-size:13px;z-index:1}

/* 管理后台 */
.admin-nav{display:flex;gap:20px;padding:15px 30px;background:#0D0E12;border-bottom:1px solid rgba(214,175,55,.15)}
.admin-nav a{color:#D4AF37;padding:8px 16px;border-radius:6px}
.admin-nav a:hover,.admin-nav a.active{background:rgba(212,175,55,.15)}

/* 标签页 */
.tabs{display:flex;gap:0;margin-bottom:20px;border-bottom:1px solid rgba(214,175,55,.15)}
.tab{padding:10px 24px;cursor:pointer;color:#8F92A1;border-bottom:2px solid transparent;transition:all .3s}
.tab.active{color:#D4AF37;border-bottom-color:#D4AF37}

/* 上传区 */
.upload-zone{border:2px dashed rgba(214,175,55,.3);border-radius:12px;padding:40px;text-align:center;cursor:pointer;transition:border .3s}
.upload-zone:hover{border-color:#D4AF37}
.upload-preview{max-width:200px;margin-top:10px;border-radius:8px}
