/* ============================================================
   9jaWin — Casino dark theme (loaded after style.css)
   深色赌场风 / 移动优先 / 保留绿色品牌色 + 金色点缀
   ============================================================ */
:root{
  --cs-bg:#061009;
  --cs-bg2:#0a1811;
  --cs-panel:#0e1d14;
  --cs-panel2:#12251a;
  --cs-line:#1e3a2a;
  --cs-line2:#2a5240;
  --cs-text:#e9f5ee;
  --cs-muted:#93b3a1;
  --cs-green:#22c55e;
  --cs-green-d:#15803d;
  --cs-gold:#f0c14b;
  --cs-gold-d:#b8860b;
  --cs-red:#ef4444;
}

html.dark body{
  background:
    radial-gradient(1100px 620px at 12% -12%, rgba(34,197,94,.16), transparent 62%),
    radial-gradient(900px 520px at 102% -6%, rgba(240,193,75,.09), transparent 58%),
    radial-gradient(700px 500px at 50% 120%, rgba(21,128,61,.12), transparent 60%),
    var(--cs-bg) !important;
  color:var(--cs-text);
}

/* ---------- 顶栏 / 底栏 ---------- */
html.dark .topbar{
  background:rgba(8,21,14,.94) !important;
  border-bottom:1px solid var(--cs-line);
  box-shadow:0 1px 0 rgba(240,193,75,.06), 0 8px 24px rgba(0,0,0,.45);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}
html.dark .logo{
  color:var(--cs-gold) !important;
  background:linear-gradient(120deg,#f7d774,#f0c14b 45%,#c99a1f) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  letter-spacing:.2px;
}
html.dark .nav a{color:#a9c6b6 !important;}
html.dark .nav a:hover{color:var(--cs-green) !important;}
html.dark .bottomnav{
  background:rgba(8,21,14,.97) !important;
  border-top:1px solid var(--cs-line) !important;
  box-shadow:0 -8px 24px rgba(0,0,0,.45);
}
html.dark .bottomnav a{color:#7f9c8b !important;}
html.dark .bottomnav a.active{color:var(--cs-gold) !important;}
html.dark .uname{color:var(--cs-text);}

/* ---------- 按钮 ---------- */
html.dark .btn{
  background:var(--cs-panel2) !important;
  color:var(--cs-text) !important;
  border:1px solid var(--cs-line2);
}
html.dark .btn:hover{background:#173324 !important;border-color:#356a4e;}
html.dark .btn-primary{
  background:linear-gradient(135deg,#2ee06f,#15803d) !important;
  color:#04150b !important;
  border:none !important;
  font-weight:900;
  box-shadow:0 6px 18px rgba(34,197,94,.35);
}
html.dark .btn-primary:hover{filter:brightness(1.06);}
html.dark .btn-gold{
  background:linear-gradient(135deg,#f7d774,#d9a520) !important;
  color:#241a00 !important;
  border:none !important;
  font-weight:900;
  box-shadow:0 6px 18px rgba(240,193,75,.3);
}
html.dark .btn-outline{background:transparent !important;border:1px solid var(--cs-line2) !important;color:var(--cs-text) !important;}
html.dark .btn-points{background:#1a2117 !important;color:var(--cs-gold) !important;border:1px solid #3d3410 !important;}
html.dark .btn-danger-sm{background:#7f1d1d !important;color:#fecaca !important;}

/* ---------- 提示条 ---------- */
html.dark .flash-success{background:#0d2a19 !important;color:#9ff0bc !important;border:1px solid #1e5a35 !important;}
html.dark .flash-error{background:#2d1114 !important;color:#fecaca !important;border:1px solid #6b2027 !important;}

/* ---------- 跑马灯 ---------- */
html.dark .win-ticker{
  background:linear-gradient(90deg,#0b3d22,#05170d 60%,#1a1205) !important;
  border:1px solid #1e4a2e;
  color:#d9f3e3 !important;
  box-shadow:inset 0 0 40px rgba(240,193,75,.05);
}
html.dark .win-ticker-item b{color:var(--cs-gold) !important;}

/* ---------- 首页 hero / 卡片 ---------- */
html.dark .hero{
  background:linear-gradient(135deg,#0b3d22,#04150c) !important;
  border:1px solid #1e4a2e;
  box-shadow:0 12px 40px rgba(0,0,0,.5), inset 0 1px 0 rgba(240,193,75,.08);
}
html.dark .hero h1{color:#f4fbf6;}
html.dark .catnav a{
  background:var(--cs-panel) !important;
  color:#a9c6b6 !important;
  border:1px solid var(--cs-line) !important;
  box-shadow:none !important;
}
html.dark .catnav a.active,
html.dark .catnav a:hover{
  background:linear-gradient(135deg,#22c55e,#15803d) !important;
  color:#04150b !important;
  border-color:transparent !important;
  font-weight:900;
}

/* ---------- 商品/奖品卡 ---------- */
html.dark .gcard{
  background:var(--cs-panel) !important;
  border:1px solid var(--cs-line);
  box-shadow:0 6px 22px rgba(0,0,0,.45) !important;
}
html.dark .gcard-img{background:linear-gradient(135deg,#12251a,#0a1811) !important;}
html.dark .gcard-body h3{color:var(--cs-text);}
html.dark .gcard .progress{background:#12251a !important;}
html.dark .gcard .meta{color:var(--cs-muted) !important;}
html.dark .gcard .price{color:var(--cs-gold) !important;}

html.dark .win-chip{
  background:var(--cs-panel) !important;
  border:1px solid var(--cs-line) !important;
  box-shadow:none !important;
  color:#cfe6d9;
}
html.dark .win-chip b{color:var(--cs-gold) !important;}

/* ---------- 面板 / 表格 ---------- */
html.dark .panel{
  background:var(--cs-panel) !important;
  border:1px solid var(--cs-line);
  box-shadow:0 6px 22px rgba(0,0,0,.4) !important;
}
html.dark .panel h2{color:#f2fbf5;}
html.dark th{
  background:#12251a !important;
  color:#8fb3a0 !important;
  border-bottom:1px solid var(--cs-line) !important;
  font-weight:800;
  letter-spacing:.02em;
}
html.dark td{color:#d5e8dc;border-bottom:1px solid #14291c !important;}
html.dark tr:hover td{background:rgba(34,197,94,.04);}

html.dark .tag-green{background:#0d2a19 !important;color:#7ef0a8 !important;}
html.dark .tag-yellow{background:#2a2410 !important;color:#f0c14b !important;}
html.dark .tag-red{background:#2d1114 !important;color:#fca5a5 !important;}
html.dark .tag-blue{background:#0c2233 !important;color:#7dd3fc !important;}
html.dark .tag-gray{background:#16211a !important;color:#a9c6b6 !important;}

/* ---------- 表单 ---------- */
html.dark .formbox{
  background:var(--cs-panel) !important;
  border:1px solid var(--cs-line);
  box-shadow:0 18px 50px rgba(0,0,0,.55) !important;
}
html.dark .formbox h1{color:#f4fbf6;}
html.dark .formbox label{color:#a9c6b6 !important;}
html.dark input[type=email],
html.dark input[type=password],
html.dark input[type=text],
html.dark input[type=number],
html.dark input[type=time],
html.dark input[type=datetime-local],
html.dark select,
html.dark textarea{
  background:#0a1811 !important;
  border:1px solid #244632 !important;
  color:var(--cs-text) !important;
}
html.dark input:focus,
html.dark select:focus,
html.dark textarea:focus{
  outline:none;
  border-color:var(--cs-green) !important;
  box-shadow:0 0 0 3px rgba(34,197,94,.15);
}
html.dark .code-box{background:#0a1811 !important;border:1px solid #244632 !important;color:#cfe6d9 !important;}
html.dark .hint,html.dark .footer,html.dark .empty{color:#7f9c8b !important;}
html.dark .footer a{color:#a9c6b6;}

/* ---------- 折叠面板 ---------- */
html.dark details.cp{
  background:var(--cs-panel) !important;
  border:1px solid var(--cs-line) !important;
  box-shadow:none !important;
}
html.dark details.cp>summary{color:#e9f5ee;}
html.dark details.cp>summary .arr{color:var(--cs-green) !important;}

/* ---------- 商品详情 ---------- */
html.dark .gdetail-img,
html.dark .gdetail-info{
  background:var(--cs-panel) !important;
  border:1px solid var(--cs-line);
  box-shadow:0 6px 22px rgba(0,0,0,.4) !important;
}
html.dark .gdetail .bar{background:#12251a !important;}
html.dark .gdetail .nums span{background:#0a1811 !important;color:#cfe6d9;border:1px solid #173322;}
html.dark .buybox input{background:#0a1811 !important;border:1px solid #244632 !important;color:var(--cs-text) !important;}
html.dark .quick button{background:#0a1811 !important;border:1px solid #244632 !important;color:#cfe6d9 !important;}

/* ---------- 龙虎斗 ---------- */
/* 🆕 2026-10-27 老大：豆包美女棋牌背景，午夜紫金 + 金色描边 */
html.dark .dt-hero{
  background:
    radial-gradient(90% 70% at 50% -18%, rgba(255,214,120,.18), transparent 62%),
    radial-gradient(70% 100% at 8% -10%, rgba(124,58,237,.32), transparent 62%),
    radial-gradient(70% 100% at 92% -10%, rgba(37,99,235,.24), transparent 62%),
    linear-gradient(90deg, rgba(7,5,15,.90) 0%, rgba(10,7,22,.58) 44%, rgba(10,7,22,.18) 72%, rgba(7,5,15,.38) 100%),
    linear-gradient(145deg,#1b1433 0%,#100c22 48%,#07050f 100%) !important;
  border:1px solid rgba(245,196,81,.48);
  box-shadow:0 18px 40px -24px rgba(0,0,0,.9), inset 0 0 0 2px rgba(245,196,81,.12), inset 0 -34px 70px -46px rgba(124,58,237,.65);
  position:relative;
  overflow:hidden;
}
html.dark .dt-hero::after{
  content:"";
  position:absolute;
  top:-8%;
  right:-5%;
  width:60%;
  height:120%;
  background:url("img/games/dragon-hero.jpg?v=20261030a") center 22% / cover no-repeat;
  opacity:.94;
  pointer-events:none;
  z-index:0;
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 30%, #000 100%);
  mask-image:linear-gradient(90deg, transparent 0%, #000 30%, #000 100%);
}
html.dark .dt-hero > *{position:relative; z-index:1;}
html.dark .dt-hero h1,
html.dark .dt-hero .dt-qishu,
html.dark .dt-hero .dt-result h2,
html.dark .dt-hero .dt-cd,
html.dark .dt-hero .dt-draw-side small,
html.dark .dt-hero .dt-vs{
  text-shadow:0 2px 12px rgba(0,0,0,.68), 0 1px 3px rgba(0,0,0,.55);
}
@media (max-width:759px){
  html.dark .dt-hero::after{width:74%; right:-16%; background-position:center 18%;}
}
html.dark .dt-card{background:#f8f6ef;box-shadow:0 8px 22px rgba(0,0,0,.55);}
html.dark .dt-card small{color:#7a6a4a;}
html.dark .dt-bet.dragon{background:linear-gradient(160deg,#dc2626,#7f1d1d) !important;}
html.dark .dt-bet.tiger{background:linear-gradient(160deg,#2563eb,#1e3a8a) !important;}
html.dark .dt-bet.tie{background:linear-gradient(160deg,#d9a520,#7a4d05) !important;}
html.dark .dt-legend{color:#a79fca !important;}
html.dark .dt-custom .lb{color:#a79fca !important;}
html.dark .dt-custom .cur{color:#a79fca !important;}
html.dark .dt-custom input{background:transparent !important;border:0 !important;color:#f1edff !important;}
html.dark .dt-hint{color:#9b9bb8 !important;}
html.dark .dt-flash-in{background:var(--cs-panel) !important;border:1px solid var(--cs-line2);box-shadow:0 20px 60px rgba(0,0,0,.6);}
html.dark .dt-flash-in .t{color:var(--cs-gold);}

/* ---------- 骰宝 ----------
   🗑️ 2026-10-26 旧版深色骰宝的整套样式已删除：
   当初 `.sb-round` 是深绿卡片 + 绿字倒计时，现在开奖器已经换成快3 的浅蓝版
   （样式全在 sicbo-draw.css）。那几条带 `!important` 的残留会把倒计时重新染成
   亮绿色，压在淡蓝背景上根本看不清 —— 老大反馈的「中间的字看不清」就是它。
   ⚠️ 这里**不要再写** html.dark .sb-round 的任何规则，全部交给 sicbo-draw.css。 */

/* ---------- 底部安全区 ---------- */
html.dark body{padding-bottom:env(safe-area-inset-bottom);}

/* ---------- 小屏微调 ---------- */
@media (max-width:420px){
  html.dark .logo{font-size:17px;}
  html.dark .panel{padding:13px 14px;}
  html.dark .hero h1{font-size:22px;}
}

/* ---------- 金色描边强调 ---------- */
html.dark .cs-goldline{border-color:#3d3410 !important;box-shadow:0 0 0 1px rgba(240,193,75,.12), 0 10px 30px rgba(0,0,0,.45);}
html.dark .cs-glint{position:relative;overflow:hidden;}
html.dark .cs-glint::after{
  content:"";position:absolute;top:0;left:-40%;width:40%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(240,193,75,.18),transparent);
  transform:skewX(-18deg);animation:cs-glint 5.5s ease-in-out infinite;
}
@keyframes cs-glint{0%,60%{left:-45%;}100%{left:120%;}}

/* ---------- v2 polish ---------- */
html.dark a{color:#5ee08a;}
html.dark a.btn-primary,html.dark a.btn-gold{color:#04150b;}
html.dark a.btn-gold{color:#241a00;}
html.dark a.btn-outline{color:#e9f5ee;}

html.dark button:focus:not(:focus-visible),
html.dark input:focus:not(:focus-visible){outline:none;}
html.dark :focus-visible{outline:2px solid #22c55e;outline-offset:2px;}

/* 中奖横幅改成居中浮层（footer.php 里改成 fixed 底部） */
html.dark #winbanner{
  left:50% !important;right:auto !important;
  width:calc(100% - 24px);max-width:560px;
  transform:translateX(-50%);
}

/* 福利区单卡居中，别拉太宽 */
html.dark .welfare-zone .grid{max-width:380px;margin-left:auto;margin-right:auto;}

/* 福利区单卡：居中、别撑满、图片别太高 */
html.dark .welfare-zone .grid{width:300px !important;max-width:300px !important;margin:0 auto 6px !important;}
html.dark .welfare-zone .gcard{width:300px !important;max-width:300px !important;}
html.dark .welfare-zone .gcard-img{height:150px !important;}

/* ---------- 代理中心 ---------- */
html.dark .ag-card,html.dark .ag-stat{background:#0e1d14 !important;border:1px solid #1e3a2a;box-shadow:none;}
html.dark .ag-stat .n{color:#e9f5ee;}
html.dark .ag-stat .l{color:#93b3a1;}
html.dark .ag-h{color:#f0c14b;}
html.dark .ag-tb th{color:#8fb3a0;border-bottom-color:#1e3a2a;}
html.dark .ag-tb td{border-bottom-color:#14291c;color:#d5e8dc;}
html.dark .ag-paid{color:#4ade80;}
html.dark .ag-pend{color:#f0c14b;}
html.dark .ag-card p{color:#a9c6b6 !important;}
html.dark .ag-hero{background:linear-gradient(150deg,#0b3d22,#04150c);border:1px solid #2a5240;}

/* ---------- 手机顶栏收紧 ---------- */
@media (max-width:560px){
  html.dark .uname{display:none !important;}
  html.dark .topbar-in{gap:6px;}
  html.dark .nav{gap:7px;}
  html.dark .btn{padding:7px 10px;}
  html.dark .logo{font-size:17px;}
}

@media (max-width:560px){
  html.dark #themeBtn{display:none !important;}
  html.dark .nav{gap:4px;}
  html.dark .userbox{gap:4px;}
}


@media (max-width:560px){
  /* 手机上龙虎斗/骰宝已有底部导航，顶栏只留 21 点、签到、代理 */
  html.dark .nav a[href*="m=dragon"],html.dark .nav a[href*="m=sicbo"]{display:none !important;}
}

@media (max-width:560px){
  /* 音乐按钮挪到左下并缩小，别挡住下注按钮 */
  #bgmBtn{left:10px !important;right:auto !important;width:38px !important;height:38px !important;font-size:16px !important;bottom:78px !important;opacity:.85;}
}

/* ---------- 桌面顶栏不再折行 ---------- */
html.dark .nav{flex-wrap:nowrap;}
html.dark .nav a{white-space:nowrap;}
@media (max-width:1440px){
  html.dark .nav-sm .nav-txt{display:none;}
  html.dark .nav-hide-md{display:none;}
  html.dark .uname{display:none !important;}
}

@media (min-width:760px){
  html.dark .ag-grid{grid-template-columns:repeat(4,1fr);}
}

/* ============================================================
   🃏 扑克牌 / 开奖弹窗 / 上一局（2026-10-19）
   老大：「倒计时和弹窗弄成龙虎一样，扑克弄成真一点的图片」
   ============================================================ */
.cs-hand{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;min-height:92px}
.cs-card{width:100px;height:140px;flex:0 0 auto;border-radius:8px;background:transparent;
  filter:drop-shadow(0 6px 10px rgba(0,0,0,.55));
  animation:csDeal .34s cubic-bezier(.2,.9,.3,1.15) both}
.cs-card svg{display:block;width:100%;height:100%}
.cs-card:nth-child(2){animation-delay:.09s}
.cs-card:nth-child(3){animation-delay:.18s}
.cs-card:nth-child(4){animation-delay:.27s}
.cs-card:nth-child(5){animation-delay:.36s}
@keyframes csDeal{from{opacity:0;transform:translateY(-16px) rotate(-4deg) scale(.9)}to{opacity:1;transform:none}}

/* 网页版（>900）牌放到 100×140；平板 84；手机上下排 68 */
@media (max-width:900px){
  .cs-card{width:84px;height:118px}
}
@media (max-width:560px){
  .cs-card{width:68px;height:94px}
  .cs-hand{gap:6px;min-height:94px}
}
@media (max-width:340px){
  .cs-card{width:60px;height:83px}
  .cs-hand{gap:5px;min-height:83px}
}

/* 倒计时：最后 10 秒闪烁；封盘后切成 Dealing */
.cs-timer.urgent{color:#f87171 !important;animation:csPulse .9s ease-in-out infinite}
@keyframes csPulse{0%,100%{opacity:1}50%{opacity:.5}}
.cs-timer.dealing{font-size:26px !important;letter-spacing:.03em;color:#f0c14b !important}

/* 上一局 */
.cs-last{margin-top:8px;padding:10px 12px;border-radius:13px;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.09);text-align:center}
.cs-last-h{font-size:12px;color:#9fd0b3;margin-bottom:6px}

/* 🔴 2026-10-20 老大：「缩小开奖栏与牌页面的空隙」
   这两行在没有内容时还占着 18+16px 的高度（还带外边距），这就是那段空白的来源 */
.bc-result:empty,.bc-my:empty,.bj-result:empty,.bj-my:empty{display:none}
.cs-last-h b{color:#f0c14b}
.cs-last-h .cs-res{font-weight:900;letter-spacing:.04em}
.cs-last-row{display:flex;gap:16px;justify-content:center;align-items:flex-start;flex-wrap:wrap}
.cs-last-col small{display:block;font-size:10.5px;letter-spacing:.12em;color:#9fd0b3;margin-bottom:5px}
.cs-last-col .cs-hand{min-height:0;gap:5px}
/* 🔴 2026-10-20 老大：「筹码上面的牌大一点能看清」「这里还有这么多空间」
   桌面直接放到 96×134；窄屏按 12vw 缩，保证 3 张牌并排不折行 */
.cs-last-col .cs-card{
  width:min(96px, 12vw);
  height:min(134px, 16.8vw);
  filter:drop-shadow(0 3px 6px rgba(0,0,0,.5));
  animation:none;
}
/* 超窄屏（<360）：两栏必须并排放下，否则会折成两行把面板撑高一倍 */
@media (max-width:360px){
  .cs-last{padding:9px 8px}
  .cs-last-row{gap:6px}
  .cs-last-col .cs-hand{gap:3px}
}
.cs-last-col .tot{display:inline-block;margin-top:5px;font-size:11.5px;font-weight:800;color:#f0c14b}

/* 开奖弹窗（照龙虎 #dt-flash） */
.cs-flash{position:fixed;inset:0;z-index:99998;display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.55);opacity:0;visibility:hidden;transition:opacity .18s ease}
.cs-flash.on{opacity:1;visibility:visible}
.cs-flash-in{background:#0e1d14;border:1px solid #2a5240;border-radius:18px;padding:20px 26px;
  min-width:250px;max-width:86vw;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.65);
  transform:scale(.92);transition:transform .22s cubic-bezier(.2,.9,.3,1.2)}
.cs-flash.on .cs-flash-in{transform:scale(1)}
.cs-flash-icon{font-size:38px;line-height:1}
.cs-flash-title{font-size:19px;font-weight:900;letter-spacing:.06em;margin-top:5px}
.cs-flash-sub{margin-top:8px;font-size:12.5px;color:#a9c6b6}
.cs-flash-sub .cs-hand{min-height:0;gap:6px;margin-top:7px}
.cs-flash-sub .cs-card{width:38px;height:53px;animation:none}