:root{
  --red:#d32f2f; --red-d:#b71c1c; --gold:#f6b800;
  --bg:#f4f5f7; --card:#fff; --line:#e6e8eb;
  --text:#222; --dim:#8a8f99; --green:#2e7d32;
  --tg-top-inset:0px;   /* Telegram 全屏时顶部安全区(由脚本设置) */
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;
  background:var(--bg);color:var(--text);line-height:1.5;
  /* 全屏时给页面顶部留出安全区, 避免被 Telegram 控件遮挡 */
  padding-top:var(--tg-top-inset)}
a{color:inherit;text-decoration:none}

/* TGZF 未注册提示横幅 */
.reg-banner{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;
  background:#fff3cd;color:#8a6d00;border-bottom:1px solid #ffe082;
  padding:10px 16px;font-size:14px;font-weight:600}
.reg-banner .reg-btn{background:var(--red);color:#fff;padding:6px 16px;border-radius:16px;
  font-weight:700;white-space:nowrap}
.reg-banner .reg-btn:hover{background:var(--red-d)}

/* topbar */
.topbar{display:flex;align-items:center;gap:24px;background:linear-gradient(90deg,var(--red),var(--red-d));
  color:#fff;padding:0 24px;height:60px;position:sticky;top:var(--tg-top-inset);z-index:10;
  box-shadow:0 2px 8px rgba(0,0,0,.15)}
.brand{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:700}
.logo{background:var(--gold);color:var(--red-d);border-radius:8px;padding:2px 8px;font-weight:800}
.logo-img{height:44px;width:auto;display:block;filter:drop-shadow(0 2px 4px rgba(0,0,0,.25))}
.nav{display:flex;gap:6px;flex:1}
.nav a{padding:8px 16px;border-radius:20px;font-size:15px;opacity:.9}
.nav a:hover{background:rgba(255,255,255,.15)}
.nav a.active{background:#fff;color:var(--red);opacity:1;font-weight:700}
.wallet{display:flex;align-items:center;gap:6px;font-size:14px}
.wallet b{color:var(--gold);font-size:17px}
.btn-mini{background:var(--gold);color:var(--red-d);border:none;border-radius:14px;
  padding:4px 12px;font-weight:700;cursor:pointer}

.container{max-width:1080px;margin:20px auto;padding:0 16px}
.footer{text-align:center;color:var(--dim);font-size:13px;padding:30px 0}

/* card */
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:20px;margin-bottom:20px}
.card h2{font-size:18px;margin-bottom:14px;border-left:4px solid var(--red);padding-left:10px}

/* hero */
.hero{display:flex;gap:20px;background:linear-gradient(120deg,#fff,#fff5f5);
  border:1px solid var(--line);border-radius:12px;padding:24px;margin-bottom:20px}
.hero-info{flex:1}
.issue-label{color:var(--dim)}
.issue-num{font-size:34px;font-weight:800;color:var(--red);margin:6px 0 16px}
.hero-draw{text-align:center}
.draw-title{color:var(--dim);margin-bottom:10px}
.balls{display:flex;gap:12px}
.ball{width:52px;height:52px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#ff6b6b,var(--red));
  color:#fff;font-size:26px;font-weight:800;display:flex;align-items:center;justify-content:center;
  box-shadow:0 3px 6px rgba(0,0,0,.2)}
.draw-meta{color:var(--dim);margin-top:10px}

/* 首页顶部横条: 左=开奖号码, 右=截止时间翻牌钟 (红金风格) */
.topboard{display:flex;align-items:stretch;gap:20px;
  background:linear-gradient(135deg,#8e1414,#5c0000);border:1px solid #7f0000;
  border-radius:14px;padding:16px 24px;margin-bottom:14px;
  box-shadow:0 6px 18px rgba(127,0,0,.25)}
.tb-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}
.tb-divider{width:1px;background:linear-gradient(180deg,transparent,rgba(246,184,0,.5),transparent)}
.tb-title{font-size:14px;color:var(--gold);font-weight:700;letter-spacing:.5px}
.tb-title b{color:#fff;font-size:15px}

.tb-balls{display:flex;align-items:center;gap:14px}
.tb-sum{margin-left:6px;font-size:12px;color:#ffd9a0;background:rgba(0,0,0,.2);
  padding:3px 10px;border-radius:12px}
.metal-ball{width:52px;height:52px;border-radius:50%;
  background:radial-gradient(circle at 34% 30%,#fff6d6 0%,#f6c94b 35%,#d99a1c 70%,#a06a10 100%);
  color:#5c3a00;font-size:26px;font-weight:800;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 8px rgba(0,0,0,.35),inset 0 2px 3px rgba(255,255,255,.6),
    inset 0 -3px 5px rgba(0,0,0,.25);text-shadow:0 1px 1px rgba(255,255,255,.4)}

/* 翻牌钟 (深色卡, 金字) */
.flip-countdown{display:inline-block}
.fc-clock{display:flex;align-items:center;gap:8px}
.fc-cell{position:relative;width:58px;height:70px;border-radius:9px;
  background:linear-gradient(180deg,#3a3a3a 0%,#262626 49%,#1c1c1c 51%,#111 100%);
  box-shadow:0 4px 10px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  transform-style:preserve-3d;perspective:200px}
.fc-cell::after{content:"";position:absolute;left:0;right:0;top:50%;height:2px;
  background:rgba(0,0,0,.55);transform:translateY(-1px)}
.fc-cell span{font-size:38px;font-weight:800;color:var(--gold);
  font-family:"DIN","Arial Narrow",Consolas,sans-serif;line-height:1;
  text-shadow:0 2px 4px rgba(0,0,0,.5)}
.fc-colon{font-size:32px;font-weight:800;color:var(--gold);padding-bottom:4px}
.fc-cell.flip-anim{animation:fcFlip .45s ease}
@keyframes fcFlip{
  0%{transform:rotateX(0)}
  45%{transform:rotateX(-88deg);filter:brightness(.7)}
  55%{transform:rotateX(-92deg);filter:brightness(.7)}
  100%{transform:rotateX(0)}
}
/* 开奖中: 卡片转橙; 封盘中: 数字转红提示 */
.flip-countdown.is-drawing .fc-cell{
  background:linear-gradient(180deg,#fb8c00 0%,#ef6c00 49%,#e65100 51%,#bf360c 100%)}
.flip-countdown.is-drawing .fc-cell span{font-size:28px;color:#fff}
.flip-countdown.is-sealed .fc-cell span{color:#ffcf4d}

.hero-actions{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.hero-rule{color:var(--dim);font-size:13px}

.btn-primary{background:var(--red);color:#fff;border:none;border-radius:22px;
  padding:10px 26px;font-size:15px;font-weight:700;cursor:pointer;transition:.15s}
.btn-primary:hover{background:var(--red-d)}
.btn-primary:disabled{background:#ccc;cursor:not-allowed}

/* table */
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th,.tbl td{padding:9px 8px;text-align:center;border-bottom:1px solid var(--line)}
.tbl th{background:#fafafa;color:var(--dim);font-weight:600}
.mini-balls{display:flex;gap:5px;justify-content:center}
.mini-balls i{width:26px;height:26px;border-radius:50%;background:var(--red);color:#fff;
  font-style:normal;font-size:14px;display:flex;align-items:center;justify-content:center}

.grid-playtypes{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.pt-card{flex:1 1 180px;max-width:260px;background:#fff;border:1px solid var(--line);
  border-radius:12px;padding:16px}
/* 响应式: 每行一个卡片, 整行铺满 */
@media(max-width:640px){
  .grid-playtypes .pt-card{flex:1 1 100%;max-width:none;margin:0}
}
.pt-card h3{color:var(--red);margin-bottom:8px}
.pt-card p{font-size:13px;color:var(--dim)}

/* bet page */
.bet-wrap{display:grid;grid-template-columns:260px 1fr;gap:18px}
.bet-side{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;
  align-self:start;position:sticky;top:80px}
.bet-side h2{font-size:16px;margin-bottom:10px}
.cat-group{margin-bottom:14px}
.cat-title{font-size:13px;color:var(--dim);margin-bottom:6px;font-weight:700}
.pt-list{display:flex;flex-wrap:wrap;gap:6px}
.pt-btn{background:#f4f5f7;border:1px solid var(--line);border-radius:16px;padding:5px 10px;
  font-size:13px;cursor:pointer;transition:.12s}
.pt-btn:hover{border-color:var(--red);color:var(--red)}
.pt-btn.active{background:var(--red);color:#fff;border-color:var(--red)}

/* 两步式投注: 选择玩法 / 投注 */
.bet-stage{max-width:900px;margin:0 auto}
.cat-block{margin-bottom:22px}
.cat-block:last-child{margin-bottom:0}
.cat-block .cat-title{font-size:15px;color:var(--red);font-weight:700;margin-bottom:12px;
  border-left:3px solid var(--red);padding-left:8px}
.pt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:10px}
.pt-grid .pt-btn{padding:14px 10px;border-radius:10px;font-size:14px;text-align:center;
  background:#fff;border:1px solid var(--line);font-weight:600}
.pt-grid .pt-btn:hover{border-color:var(--red);color:var(--red);
  box-shadow:0 3px 10px rgba(211,47,47,.12);transform:translateY(-1px)}
.pt-grid .pt-btn.active,.pt-grid .pt-btn.active:hover{background:var(--red);color:#fff;border-color:var(--red)}
.head-left{display:flex;align-items:center;gap:14px}
.btn-back{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;
  background:#fff7f7;border:1px solid var(--line);border-radius:50%;color:var(--red);
  cursor:pointer;transition:.15s;flex:none}
.btn-back svg{transition:transform .15s}
.btn-back:hover{background:var(--red);color:#fff;border-color:var(--red);
  box-shadow:0 4px 12px rgba(211,47,47,.28)}
.btn-back:hover svg{transform:translateX(-2px)}
.btn-back:active{transform:scale(.94)}

.seal-bar{display:flex;align-items:center;gap:12px;background:#e8f5e9;border:1px solid #c8e6c9;
  border-radius:10px;padding:10px 14px;margin-bottom:16px;font-size:14px;color:#2e7d32}
.seal-bar.sealed{background:#ffebee;border-color:#ffcdd2;color:var(--red)}
.seal-bar.drawing{background:#fff3e0;border-color:#ffe0b2;color:#e65100}
.seal-bar.drawing .seal-dot{background:#e65100;box-shadow:0 0 0 3px rgba(230,81,0,.15);animation:blink .6s infinite}
.seal-dot{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px rgba(46,125,50,.15)}
.seal-bar.sealed .seal-dot{background:var(--red);box-shadow:0 0 0 3px rgba(211,47,47,.15);
  animation:blink 1s infinite}
@keyframes blink{50%{opacity:.3}}
.seal-cd{display:flex;align-items:center;gap:6px}
.seal-cd b{font-family:Consolas,monospace;font-size:16px}
.seal-rule{margin-left:auto;color:var(--dim);font-size:12px}

.bet-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}
.cur-play{font-size:20px;font-weight:800;color:var(--red)}
.cur-tip{color:var(--dim);font-size:13px;margin-top:4px}
.issue-box{text-align:right;font-size:13px;color:var(--dim)}
.issue-box b{display:block;font-size:20px;color:var(--text)}

.input-area{min-height:120px;padding:10px 0}
.pos-row{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.pos-label{width:56px;font-weight:700;color:var(--red)}
.digit-grid{display:flex;flex-wrap:wrap;gap:8px}
.digit{width:40px;height:40px;border-radius:8px;border:1px solid var(--line);background:#fff;
  font-size:17px;font-weight:700;cursor:pointer;transition:.1s}
.digit:hover{border-color:var(--red)}
.digit.on{background:var(--red);color:#fff;border-color:var(--red)}
.row-tools button{background:none;border:none;color:var(--red);cursor:pointer;font-size:12px}
/* 龙虎和 等 选项按钮 */
.opt-grid{display:flex;flex-wrap:wrap;gap:8px}
.opt-btn{min-width:64px;height:40px;padding:0 16px;border-radius:8px;border:1px solid var(--line);
  background:#fff;font-size:15px;font-weight:700;color:var(--text);cursor:pointer;transition:.1s}
.opt-btn:hover{border-color:var(--red);color:var(--red)}
.opt-btn.on{background:var(--red);color:#fff;border-color:var(--red)}
textarea.num-input{width:100%;min-height:110px;border:1px solid var(--line);border-radius:8px;
  padding:10px;font-size:15px;font-family:Consolas,monospace;resize:vertical}
.input-hint{color:var(--dim);font-size:12px;margin-top:6px}

/* 投注控制栏 (期数/金额/倍数 等) */
.bet-controls{border:1px solid var(--line);border-radius:10px;padding:12px 14px;
  margin-top:10px;background:linear-gradient(180deg,#fffdfc,#fff6f5)}
.ctrl-row{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.ctrl-row+.ctrl-row{margin-top:10px;padding-top:10px;border-top:1px dashed var(--line)}
.ctrl-group{display:flex;align-items:center;gap:8px}
.ctrl-group.grow{flex:1;min-width:0}
.ctrl-top{gap:28px}
/* 右侧控件(投注倍数/金额投注)固定同宽, 上下对齐 */
.ctrl-side{flex:0 0 auto;justify-content:flex-end}
.ctrl-side .stepper,.ctrl-side .ctrl-input{width:150px}
.ctrl-side .stepper input{flex:1;width:auto}
.ctrl-label{font-size:13px;font-weight:700;color:var(--red);white-space:nowrap}
.ctrl-select{border:1px solid var(--line);border-radius:8px;padding:6px 10px;
  font-size:14px;font-weight:700;color:var(--red);background:#fff;cursor:pointer}
.ctrl-input{width:120px;border:1px solid var(--line);border-radius:8px;padding:6px 10px;
  font-size:14px}
.ctrl-input:focus,.ctrl-select:focus{outline:none;border-color:var(--red)}
.chip-row{display:flex;flex-wrap:wrap;gap:6px}
#unitChips,#multChips{display:grid;grid-template-columns:repeat(4,80px);gap:6px}
.chip{background:#fff;border:1px solid var(--line);border-radius:14px;padding:5px 12px;
  font-size:13px;font-weight:700;color:var(--text);cursor:pointer;transition:.12s;min-width:44px}
.chip:hover{border-color:var(--red);color:var(--red)}
.chip.on{background:var(--red);color:#fff;border-color:var(--red)}
.bonus-box{border:1px solid var(--line);border-radius:8px;padding:6px 12px;background:#fff;
  font-size:14px;font-weight:800;color:var(--gold);min-width:96px;text-align:center}
.stepper{display:flex;align-items:center;border:1px solid var(--line);border-radius:8px;overflow:hidden}
.stepper button{width:32px;height:34px;border:none;background:#f4f5f7;color:var(--red);
  font-size:18px;font-weight:800;cursor:pointer;transition:.12s}
.stepper button:hover{background:var(--red);color:#fff}
.stepper input{width:54px;height:34px;border:none;border-left:1px solid var(--line);
  border-right:1px solid var(--line);text-align:center;font-size:15px;font-weight:700}
.stepper input:focus{outline:none}

.bet-foot{display:flex;justify-content:space-between;align-items:center;
  border-top:1px solid var(--line);padding-top:16px;margin-top:10px}
.foot-left{display:flex;align-items:center;gap:20px}
.foot-left input{width:70px;padding:6px;border:1px solid var(--line);border-radius:6px;font-size:15px}
.calc{font-size:14px;color:var(--dim)}
.calc b{color:var(--red);font-size:18px}

.msg{margin-top:12px;font-size:14px;min-height:20px}
.msg.ok{color:var(--green)}
.msg.err{color:var(--red)}

.results-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;flex-wrap:wrap;gap:10px}
.period-tabs{display:flex;gap:6px;margin-left:auto}
.period-tab{padding:3px 10px;border-radius:14px;font-size:12px;font-weight:600;
  color:var(--red);background:#fff;border:1px solid var(--red);transition:.12s}
.period-tab:hover{background:#fff0f0}
.period-tab.active{background:var(--red);color:#fff}
.orders-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.orders-tip{font-size:13px;color:var(--dim)}
.orders-filter{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px;
  padding:12px 14px;background:#fff7f7;border:1px solid var(--line);border-radius:12px}
.of-item{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--dim)}
.of-select{padding:5px 10px;border:1px solid var(--line);border-radius:8px;font-size:13px;
  color:#333;background:#fff;cursor:pointer;min-width:120px}
.of-select:focus{outline:none;border-color:var(--red)}
.of-reset{padding:5px 14px;border:1px solid var(--red);border-radius:8px;background:#fff;
  color:var(--red);font-size:13px;cursor:pointer;transition:.12s}
.of-reset:hover{background:var(--red);color:#fff}
.of-count{margin-left:auto;font-size:13px;color:var(--dim)}
@media(max-width:560px){
  .orders-filter{gap:10px}
  .of-item{flex:1;justify-content:space-between}
  .of-select{flex:1;min-width:0}
  .of-count{width:100%;text-align:right;margin-left:0}
}
.btn-cancel{background:#fff;color:var(--red);border:1px solid var(--red);border-radius:14px;
  padding:4px 12px;font-size:13px;cursor:pointer;transition:.12s}
.btn-cancel:hover{background:var(--red);color:#fff}
.btn-cancel:disabled{opacity:.5;cursor:not-allowed}
.tag{padding:2px 10px;border-radius:12px;font-size:12px}
.tag-win{background:#e8f5e9;color:var(--green)}
.tag-lose{background:#eee;color:var(--dim)}
.tag-wait{background:#fff3e0;color:#e65100}
.tag-type{background:#fff0f0;color:var(--red)}
.win-amt{color:var(--green);font-weight:700}
/* 注单可展开 */
.orders-tbl .col-caret{width:32px;text-align:center}
.order-row{cursor:pointer;transition:background .12s}
.order-row:hover{background:#fff7f7}
.order-row .caret{display:inline-block;color:var(--red);font-size:11px;transition:transform .15s}
.order-row.expanded{background:#fff2f2}
.order-row.expanded .caret{transform:rotate(90deg)}
.detail-row>td{padding:0;background:none;border-top:none}
/* 展开/收起 滑动动画容器 */
.detail-inner{max-height:0;opacity:0;overflow:hidden;
  transition:max-height .35s ease, opacity .28s ease}
.detail-row.open .detail-inner{max-height:1200px;opacity:1}
.order-detail{margin:12px 18px 16px;background:#fff;border:1px solid var(--line);
  border-left:3px solid var(--red);border-radius:10px;overflow:hidden;
  display:grid;grid-template-columns:1fr 1fr;
  box-shadow:0 2px 8px rgba(211,47,47,.06)}
.od-item{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  padding:11px 18px;font-size:13px;border-bottom:1px solid #f2e8e6}
.od-item.od-full{grid-column:1/-1;background:#fffdf9}
.od-item:last-child,.od-item:nth-last-child(2):not(.od-full){border-bottom:none}
.od-k{color:var(--dim);font-size:12px;white-space:nowrap}
.od-v{color:#333;font-weight:700;word-break:break-all;text-align:right}
.od-v.win-amt{color:var(--green)}
@media(max-width:640px){.order-detail{grid-template-columns:1fr}}
.dim{color:var(--dim);font-size:12px}
.empty{color:var(--dim);padding:20px 0}
.odds-tip{display:inline-block;margin-left:8px;background:#fff3e0;color:#e65100;
  padding:1px 8px;border-radius:10px;font-size:12px}

/* 投注成功弹窗 */
.modal-mask{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:200;
  display:flex;align-items:center;justify-content:center;animation:fadeIn .2s ease}
.modal-mask[hidden]{display:none}
.modal-box{background:#fff;border-radius:16px;padding:30px 34px;text-align:center;
  min-width:300px;box-shadow:0 16px 40px rgba(0,0,0,.3);animation:popIn .22s ease}
.modal-icon{width:60px;height:60px;margin:0 auto 14px;border-radius:50%;
  background:linear-gradient(135deg,#ff6b6b,var(--red));color:#fff;font-size:34px;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 14px rgba(211,47,47,.35)}
.modal-icon.warn{background:linear-gradient(135deg,#ffb74d,#f57c00);
  box-shadow:0 6px 14px rgba(245,124,0,.35);font-weight:800}
.modal-title{font-size:22px;font-weight:800;color:var(--red);margin-bottom:22px}
.modal-text{max-width:340px;margin:0 auto 22px;font-size:15px;line-height:1.7;
  color:#444;text-align:center}
.modal-text b{color:var(--red);font-size:17px}
.modal-actions{display:flex;gap:12px;justify-content:center}
.btn-ghost{background:#fff;color:var(--red);border:1px solid var(--red);border-radius:22px;
  padding:9px 22px;font-size:15px;font-weight:700;cursor:pointer;transition:.15s}
.btn-ghost:hover{background:#fff0f0}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes popIn{from{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}

@media(max-width:820px){
  .bet-wrap{grid-template-columns:1fr}
  .bet-side{position:static}
  .hero{flex-direction:column}
  .topboard{flex-direction:column;gap:16px}
  .tb-divider{width:100%;height:1px;
    background:linear-gradient(90deg,transparent,rgba(246,184,0,.5),transparent)}
  .fc-cell{width:48px;height:60px}
  .fc-cell span{font-size:30px}

  /* 余额靠最右显示 */
  .wallet{margin-left:auto}

  /* 悬空圆角底部导航 */
  body{padding-bottom:88px}
  .nav{display:flex;position:fixed;left:14px;right:14px;bottom:16px;
    justify-content:space-around;gap:6px;flex:none;z-index:100;
    background:rgba(255,255,255,.97);border:1px solid var(--line);
    border-radius:26px;padding:8px 8px;
    box-shadow:0 10px 26px rgba(0,0,0,.2);backdrop-filter:blur(6px)}
  .nav a{flex:1;text-align:center;padding:9px 4px;font-size:14px;
    border-radius:20px;color:var(--red-d);opacity:1}
  .nav a:hover{background:#fff0f0}
  .nav a.active{background:var(--red);color:#fff}

  /* 投注控制栏: 平板下金额/倍数按钮自适应铺满 */
  #unitChips,#multChips{grid-template-columns:repeat(4,1fr);width:100%}
  .ctrl-group.grow{flex-basis:100%}
}

/* 手机端 (<=560px): 控制栏纵向堆叠, 更整齐简洁 */
@media(max-width:560px){
  .container{margin:14px auto}
  .card{padding:16px}
  /* 宽表格在卡片内横向滚动, 避免撑破页面 */
  .card{overflow-x:auto}
  .tbl{min-width:480px}
  .tbl th,.tbl td{padding:8px 6px;font-size:13px}
  .bet-head{flex-wrap:wrap;gap:8px}
  .issue-box{text-align:left}

  .bet-controls{padding:12px}
  .ctrl-row{flex-direction:column;align-items:stretch;gap:12px}
  .ctrl-row+.ctrl-row{margin-top:8px;padding-top:12px}
  .ctrl-group{justify-content:space-between}
  .ctrl-group.grow{flex-direction:column;align-items:stretch;gap:8px}
  .ctrl-label{font-size:13px}
  .ctrl-top{gap:12px}
  .ctrl-select,.ctrl-input{flex:1;width:auto}
  .ctrl-side .stepper,.ctrl-side .ctrl-input{width:auto;flex:1}
  #unitChips,#multChips{grid-template-columns:repeat(4,1fr);width:100%}
  .chip{min-width:0;padding:8px 4px;text-align:center}
  .bonus-box{flex:1}

  .bet-foot{flex-direction:column;align-items:stretch;gap:12px}
  .foot-left{justify-content:center;text-align:center}
  .bet-foot .btn-primary{width:100%}

  /* 数字选号盘: 一行5个, 等宽铺满更整齐 */
  .pos-row{flex-direction:column;align-items:stretch;gap:8px}
  .digit-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;width:100%}
  .digit{width:auto;height:44px;font-size:17px}
}

/* 超窄屏 (<=380px) */
@media(max-width:380px){
  .digit{height:40px;font-size:15px}
  .chip{font-size:12px;padding:7px 2px}
}

/* 注单页: 移动端把表格转成卡片, 摆脱横向拥挤 */
@media(max-width:640px){
  /* 该表不再横向滚动, 改为纵向卡片 */
  .orders-tbl{min-width:0;display:block}
  .orders-tbl thead{display:none}
  .orders-tbl tbody{display:block}
  .orders-tbl tr{display:block}
  .orders-tbl td{display:flex;justify-content:space-between;align-items:center;
    gap:14px;padding:9px 0;font-size:14px;border-bottom:1px dashed var(--line);text-align:right}
  .orders-tbl td::before{content:attr(data-label);color:var(--dim);font-weight:700;
    font-size:13px;text-align:left;white-space:nowrap}

  .order-row{position:relative;background:#fff;border:1px solid var(--line);
    border-radius:12px;margin-bottom:12px;padding:6px 16px 6px 36px;
    box-shadow:0 2px 8px rgba(0,0,0,.05)}
  .order-row td:last-child{border-bottom:none}
  /* 展开箭头独占卡片左侧留白, 不遮挡任何内容 */
  .order-row .col-caret{position:absolute;left:0;top:0;bottom:0;width:34px;
    display:flex;align-items:center;justify-content:center;padding:0;border:none}
  .order-row .col-caret::before{content:none}
  .order-row.expanded{background:#fff7f7}

  /* 详情行紧贴其卡片下方 */
  .detail-row{display:block;margin:-8px 0 0}
  .detail-row>td{display:block;padding:0}
  .detail-row>td::before{content:none}
  .order-detail{margin:0 0 12px}
  .btn-cancel{padding:5px 16px}

  .orders-head{flex-wrap:wrap;gap:4px}
  .orders-tip{font-size:12px}
}

/* 开奖历史: 视图切换 + 走势图 */
.results-controls{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.view-tabs{display:inline-flex;border:1px solid var(--red);border-radius:16px;overflow:hidden}
.vt-btn{background:#fff;color:var(--red);border:none;padding:6px 18px;font-size:14px;
  font-weight:700;cursor:pointer;transition:.12s}
.vt-btn+.vt-btn{border-left:1px solid var(--red)}
.vt-btn.active{background:var(--red);color:#fff}
.vt-btn:hover:not(.active){background:#fff0f0}

.trend-wrap{position:relative;overflow-x:auto;margin-top:6px}
.trend-tbl{border-collapse:collapse;font-size:12px;width:100%;min-width:640px}
.trend-tbl th,.trend-tbl td{border:1px solid #eee;text-align:center;padding:0;height:26px}
.trend-tbl .tg-head th{background:#fbeaea;color:var(--red);font-weight:800;height:24px}
.trend-tbl .tn-head th{background:#fff6f6;color:var(--dim);font-weight:600;width:24px}
.trend-tbl .gstart{border-left:2px solid var(--red-d)}
.trend-tbl td.miss{color:#ccc;font-size:11px}
.trend-tbl td.hit{position:relative}
.trend-tbl td.hit .ball{display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:20px;border-radius:50%;color:#fff;font-weight:700;font-size:11px}
.trend-tbl td.hit.p0 .ball{background:#d32f2f}
.trend-tbl td.hit.p1 .ball{background:#1976d2}
.trend-tbl td.hit.p2 .ball{background:#2e7d32}
.trend-tbl .tp-fix{position:sticky;left:0;z-index:2;background:#fff;min-width:120px;
  white-space:nowrap;padding:2px 8px;border-right:2px solid var(--red-d)}
.trend-tbl thead .tp-fix{background:#fbeaea;z-index:3}
.tr-code{display:block;color:#666;font-size:11px}
.tr-balls{display:inline-flex;gap:3px;margin-top:2px}
.tr-balls i{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;
  border-radius:50%;background:var(--red);color:#fff;font-style:normal;font-size:11px;font-weight:700}
.trend-svg{position:absolute;left:0;top:0;pointer-events:none;z-index:1}
