/* ============================================================
   49图库 学习版 - 移动端全局样式
   复刻自 31198.top 前端布局风格（学习用途）
   ============================================================ */
:root {
  --primary: #00b578;
  --primary-dark: #00915f;
  --primary-grad: linear-gradient(135deg, #00c988, #00915f);
  --danger: #e93b3d;
  --bg: #f4f5f7;
  --card: #ffffff;
  --text: #222222;
  --text-light: #888888;
  --text-muted: #bbbbbb;
  --border: #ececec;
  --gold: #f7b500;
}

* { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { font-size: 16px; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", "Microsoft YaHei", sans-serif;
  background: var(--bg);
  color: var(--text);
  max-width: 480px;
  margin: 0 auto;
  min-height: 100vh;
  padding-bottom: 56px; /* 底部导航高度 */
  -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; color: inherit; }
ul, ol { list-style: none; }
img { max-width: 100%; display: block; }

/* ============ 顶部标题栏 ============ */
.app-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  max-width: 480px;
  margin: 0 auto;
  background: var(--primary-grad);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  height: 48px;
}
.app-header .header-left { display: flex; align-items: center; gap: 8px; }
.app-header .header-logo {
  width: 30px; height: 30px;
  border-radius: 50%;
  background: rgba(255,255,255,.2);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 15px;
}
.app-header .header-title { font-size: 17px; font-weight: 600; letter-spacing: .5px; }
.app-header .header-actions { display: flex; align-items: center; gap: 12px; }
.app-header .header-actions a, .app-header .header-actions span { color: #fff; font-size: 20px; line-height: 1; cursor: pointer; }

/* ============ 内容区 ============ */
.app-body { padding-top: 48px; }

/* ============ 轮播（图片，统一 1290:423 等高，居中对称裁剪） ============ */
.swiper-box { padding: 10px; }
.swiper { position: relative; border-radius: 10px; overflow: hidden; background: #000; }
.swiper-slide { display: none; }
.swiper-slide.active { display: block; }
.swiper-slide img {
  display: block;
  width: 100%;
  aspect-ratio: 1290 / 423;
  object-fit: cover;
  object-position: center;
}
.swiper-dots { display: flex; justify-content: center; gap: 6px; padding: 6px 0 0; }
.swiper-dots i { width: 6px; height: 6px; border-radius: 50%; background: #d8d8d8; }
.swiper-dots i.active { background: var(--primary); width: 16px; border-radius: 3px; }

/* ============ 跑马灯 ============ */
.marquee {
  margin: 0 10px 10px;
  background: #fffbe8;
  border: 1px solid #ffe9a8;
  border-radius: 8px;
  display: flex; align-items: center;
  padding: 7px 10px;
  overflow: hidden;
  white-space: nowrap;
}
.marquee .marquee-label {
  flex-shrink: 0;
  background: var(--danger);
  color: #fff;
  font-size: 11px;
  padding: 2px 6px;
  border-radius: 4px;
  margin-right: 8px;
}
.marquee .marquee-text { flex: 1; overflow: hidden; position: relative; }
.marquee .marquee-text span { display: inline-block; font-size: 12px; color: #b8860b; animation: marquee 18s linear infinite; }
@keyframes marquee { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } }

/* ============ 彩种切换 ============ */
.lottery-tabs { display: flex; padding: 0 10px 8px; gap: 6px; overflow-x: auto; }
.lottery-tab {
  flex: 1 1 0;
  min-width: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 8px 2px;
  border-radius: 0;
  background: #fff;
  border: 1px solid var(--border);
  font-size: 14px;
  font-weight: 700;
  color: #000;
  text-align: center;
  white-space: nowrap;
}
.lottery-tab .lt-name { font-weight: 700; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.lottery-tab .lt-date { font-size: 12px; font-weight: 700; color: #000; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.lottery-tab.active { background: var(--primary-grad); color: #000; border-color: transparent; }
.lottery-tab.active .lt-date { color: #000; }
/* 强制覆盖浏览器 a:visited 默认紫色，保证 TAB 文字始终纯黑加粗 */
.lottery-tabs a,
.lottery-tabs a:link,
.lottery-tabs a:visited,
.lottery-tabs a:hover,
.lottery-tabs a:active,
.lottery-tabs a:focus { color: #000; font-weight: 700; }

/* ============ 开奖卡片 ============ */
.draw-card {
  margin: 0 10px 10px;
  background: var(--card);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.draw-card .draw-head {
  background: #fff;
  color: #333;
  padding: 10px 12px;
  display: flex; align-items: center; justify-content: space-between;
  font-size: 14px;
  border-bottom: 1px solid #eee;
}
.draw-card .draw-head .period,
.draw-card .draw-head .dh-right { flex: 1 1 0; min-width: 0; }
.draw-card .draw-head .dh-right { text-align: right; }
.draw-card .draw-head .period { font-weight: 700; font-size: 16px; letter-spacing: .5px; color: #333; }
.draw-card .draw-head .period .period-num { color: var(--danger); }
.draw-card .draw-head .countdown {
  flex: 0 0 auto; text-align: center; white-space: nowrap;
  font-weight: 700; font-size: 16px; letter-spacing: .5px; color: #333;
}
.draw-card .draw-head .countdown b { color: var(--danger); font-weight: 700; }
.draw-card .draw-body { padding: 12px 8px 10px; }
.draw-card .draw-body .draw-time { font-size: 13px; color: var(--text-light); margin-bottom: 10px; }
.draw-card .draw-body .draw-time b { color: var(--danger); font-size: 14px; }
.draw-card .draw-nums { display: flex; align-items: center; flex-wrap: nowrap; gap: 6px; padding-bottom: 4px; }
.draw-plus { flex: 0 0 auto; font-size: 22px; font-weight: 700; color: var(--text-light); align-self: flex-start; margin-top: 14px; }
.ball {
  box-sizing: border-box;
  width: 100%; max-width: 64px; aspect-ratio: 1 / 1; height: auto;
  border-radius: 50%;
  position: relative;
  display: flex; align-items: center; justify-content: center;
  color: #000; font-size: 28px; font-weight: 400;
  background: #fff;
  background-size: cover;
  background-position: center center;
  border: none;
  box-shadow: 0 2px 5px rgba(0,0,0,.12);
}
.ball.red { background-image: url('/img/balls/hong3.png'); }
.ball.blue { background-image: url('/img/balls/lan3.png'); }
.ball.green { background-image: url('/img/balls/lv3.png'); }
/* 特码球：不加金色描边，与普通球一致 */
.ball.special {
  box-shadow: 0 2px 5px rgba(0,0,0,.12);
}
.ball .ball-sub { display: none; }

/* 号码球下方生肖五行标注 */
.ball-wrap { flex: 1 1 0; min-width: 0; text-align: center; }
.ball-wrap .ball { margin: 0 auto; }
.ball-wrap .ball-tag { font-size: 18px; font-weight: 700; color: #000; margin-top: 4px; }
/* 特码球下方文字：与其它球一致，黑色 */
.ball-wrap.special .ball-tag { color: #000; }

/* ============ 下期信息条 ============ */
.next-info {
  margin: 0 10px 10px;
  background: linear-gradient(135deg, #fff8e6, #fff);
  border: 1px dashed #f0c674;
  border-radius: 10px;
  padding: 10px 12px;
  font-size: 13px;
  display: flex; justify-content: space-between; align-items: center;
}
.next-info .next-label { color: #a06404; font-weight: 600; }
.next-info .next-value { color: var(--text); }
.next-info .next-time { color: var(--danger); font-weight: 700; }

/* ============ 视频/直播区 ============ */
/* 圆角卡片样式（与开奖栏一致），高度加倍使视频区域更大 */
.video-box { margin: 0 10px 10px; border-radius: 12px; overflow: hidden; position: relative; background: #000; }
.video-box .video-placeholder { height: 360px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; }
.video-box .video-placeholder .offline-text { font-size: 15px; letter-spacing: 2px; color: #fff; }
.video-box .video-placeholder .play-icon {
  width: 50px; height: 50px; border-radius: 50%;
  background: rgba(255,255,255,.2);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; margin-bottom: 8px;
}
.video-box .video-label { position: absolute; top: 8px; left: 8px; background: rgba(0,0,0,.5); color: #fff; font-size: 11px; padding: 2px 8px; border-radius: 10px; }
.video-box .video-live { position: absolute; top: 8px; right: 8px; background: var(--danger); color: #fff; font-size: 11px; padding: 2px 8px; border-radius: 10px; animation: pulse 1.5s infinite; }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .5; } }

/* ============ 资料/方案区 ============ */
.section-title {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 12px 6px;
  font-size: 15px; font-weight: 600;
}
.section-title::before {
  content: ''; width: 4px; height: 14px; background: var(--primary);
  border-radius: 2px; margin-right: 8px;
}
.section-title .more { font-size: 12px; color: var(--text-light); font-weight: 400; }

.plan-card {
  margin: 0 10px 8px;
  background: var(--card);
  border-radius: 10px;
  padding: 10px 12px;
  display: flex; align-items: center; gap: 10px;
  box-shadow: 0 1px 4px rgba(0,0,0,.03);
}
.plan-card .plan-rank {
  width: 26px; height: 26px; border-radius: 6px;
  background: #f0f1f3; color: var(--text-light);
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700; flex-shrink: 0;
}
.plan-card .plan-rank.top { background: linear-gradient(135deg, #ffd24d, #ff9d00); color: #fff; }
.plan-card .plan-info { flex: 1; min-width: 0; }
.plan-card .plan-name { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.plan-card .plan-desc { font-size: 12px; color: var(--text-light); margin-top: 3px; }
.plan-card .plan-nums { font-size: 13px; color: var(--danger); font-weight: 600; flex-shrink: 0; }
.plan-card .plan-arrow { color: #ccc; font-size: 14px; flex-shrink: 0; }

/* ============ 分组卡片 ============ */
.group-card {
  margin: 0 10px 10px;
  background: var(--card);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.group-card .group-head {
  padding: 12px 14px;
  font-size: 15px; font-weight: 600;
  border-bottom: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between;
}
.group-card .group-head .group-sub { font-size: 12px; color: var(--text-light); font-weight: 400; }
.group-card .group-item {
  padding: 11px 14px;
  display: flex; align-items: center; justify-content: space-between;
  border-bottom: 1px solid var(--border);
  font-size: 14px;
}
.group-card .group-item:last-child { border-bottom: none; }
.group-card .group-item .item-right { color: var(--text-light); font-size: 13px; }

/* ============ 底部导航 ============ */
.app-tabbar {
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 100;
  max-width: 480px;
  margin: 0 auto;
  background: #fff;
  border-top: 1px solid var(--border);
  display: flex;
  height: 56px;
  box-shadow: 0 -2px 10px rgba(0,0,0,.04);
}
.app-tabbar a {
  flex: 1;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px;
  color: var(--text-muted);
  font-size: 10px;
}
.app-tabbar a .tab-icon { font-size: 21px; line-height: 1; }
.app-tabbar a.active { color: var(--primary); }
.app-tabbar a.active .tab-icon { transform: scale(1.05); }
/* 仅展示、不跳转的占位项 */
.app-tabbar a.tab-disabled { cursor: default; opacity: .5; }

/* ============ 历史列表 ============ */
.history-card { margin: 0 10px 10px; background: var(--card); border-radius: 12px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.04); }
.history-card .history-head {
  background: var(--primary-grad); color: #fff;
  padding: 10px 12px;
  display: flex; align-items: center; justify-content: space-between;
  font-size: 14px; font-weight: 600;
}
/* 标题栏居中排版：彩种名 + 开奖日期 + 期号 一行居中 */
.history-card .history-head.center { justify-content: center; flex-wrap: wrap; gap: 4px 10px; text-align: center; }
.history-card .history-head.center .hl-date { font-weight: 400; }
.history-card .history-head .history-btn {
  background: rgba(255,255,255,.2); padding: 4px 10px; border-radius: 12px;
  font-size: 12px; font-weight: 400;
}
.history-card .history-list-item { padding: 10px 12px; border-bottom: 1px solid var(--border); }
.history-card .history-list-item:last-child { border-bottom: none; }
.history-item-top { display: flex; justify-content: space-between; font-size: 12px; color: var(--text-light); margin-bottom: 8px; }
.history-item-top .hl-period { color: var(--text); font-weight: 600; }
.history-nums { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; }
/* 历史小球：放大（基础 .ball 已是 font-weight:400，数字均不加粗） */
.ball.sm { width: 48px; height: 48px; font-size: 21px; font-weight: 400; }
.ball.sm.special { box-shadow: 0 0 0 1.5px var(--gold), 0 0 6px rgba(247,181,0,.55), 0 1px 3px rgba(0,0,0,.12); }
.history-nums .sm-plus { flex: 0 0 auto; font-size: 26px; font-weight: 400; color: #888; line-height: 1; }
/* 号码球 + 下方生肖/五行标注（黑色，与首页一致） */
.history-nums .hnum-wrap { flex: 0 0 auto; width: 48px; display: flex; flex-direction: column; align-items: center; }
.history-nums .hnum-tag { margin-top: 3px; font-size: 13px; font-weight: 700; line-height: 1; color: #000; white-space: nowrap; }

/* ============ 走势图 ============ */
.trend-toolbar { position: sticky; top: 48px; z-index: 50; background: var(--bg); padding: 8px 10px 0; }
.chip-row { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 8px; }
.chip {
  flex-shrink: 0; padding: 5px 12px; border-radius: 14px;
  background: #fff; border: 1px solid var(--border);
  font-size: 12px; color: var(--text);
}
.chip.active { background: var(--primary-grad); color: #fff; border-color: transparent; }
.trend-scroll-tip { margin: 0 10px 6px; font-size: 11px; color: var(--text-light); text-align: center; }
.trend-wrap {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  max-height: 60vh;
  background: #fff;
  margin: 0 10px 10px;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
}
.trend-table {
  border-collapse: separate;
  border-spacing: 0;
  font-size: 10px;
  width: max-content;
  min-width: 100%;
}
.trend-table th, .trend-table td {
  border-right: 1px solid #f0f0f0;
  border-bottom: 1px solid #f0f0f0;
  padding: 4px 1px;
  text-align: center;
  white-space: nowrap;
  min-width: 15px;
}
/* 表头纵向滚动时固定 */
.trend-table thead th { background: #f7f8fa; color: #666; position: sticky; top: 0; z-index: 3; }
/* 期号列横向滚动时固定 */
.trend-table th.col-period,
.trend-table td.col-period {
  position: sticky; left: 0;
  background: #fff; z-index: 2;
  min-width: 40px; font-size: 10px;
}
.trend-table thead th.col-period { z-index: 4; background: #f7f8fa; }
.trend-table .trend-period { color: var(--text-light); }
.trend-table td.hit { font-weight: 700; }
.trend-table td.hit .tb {
  display: inline-block;
  min-width: 15px; height: 15px; line-height: 15px;
  border-radius: 50%; color: #fff; font-size: 9px; font-weight: 700;
}
.trend-table td.hit.red .tb { background: var(--danger); }
.trend-table td.hit.blue .tb { background: #2e7be6; }
.trend-table td.hit.green .tb { background: #16a05d; }

/* ============ 我的页面 ============ */
.profile-head {
  background: var(--primary-grad);
  color: #fff;
  padding: 24px 16px 20px;
  display: flex; align-items: center; gap: 14px;
}
.profile-avatar {
  width: 56px; height: 56px; border-radius: 50%;
  background: rgba(255,255,255,.25);
  display: flex; align-items: center; justify-content: center;
  font-size: 26px; font-weight: 700;
}
.profile-name { font-size: 17px; font-weight: 600; }
.profile-sub { font-size: 12px; opacity: .8; margin-top: 4px; }
.profile-stats { display: flex; margin: -12px 10px 10px; background: #fff; border-radius: 12px; box-shadow: 0 2px 8px rgba(0,0,0,.04); }
.profile-stats .stat { flex: 1; text-align: center; padding: 12px 0; }
.profile-stats .stat b { display: block; font-size: 18px; color: var(--primary); }
.profile-stats .stat span { font-size: 12px; color: var(--text-light); }

/* ============ 挑码助手 ============ */
.picker-head {
  display: flex; align-items: center;
  background: #fff;
  padding: 12px;
  position: sticky; top: 48px; z-index: 10;
  border-bottom: 1px solid #f0f0f0;
}
.picker-back { font-size: 26px; color: #333; text-decoration: none; padding: 0 6px; line-height: 1; }
.picker-title { flex: 1; text-align: center; font-size: 17px; font-weight: 600; color: #222; margin: 0; }
.picker-actions { display: flex; align-items: center; gap: 8px; }
.picker-copy,
.picker-clear {
  background: #fff; color: #00b578; border: 1px solid #00b578;
  border-radius: 14px; padding: 4px 14px; font-size: 13px; cursor: pointer;
  font-family: inherit; min-width: 52px;
}
.picker-copy:active, .picker-clear:active { opacity: .7; }

/* 匹配结果区：米色卡片，从左上角开始排列球或空状态 */
.picker-result {
  margin: 10px;
  background: #f4efe6;
  border-radius: 12px;
  min-height: 180px;
  padding: 20px;
  display: flex; align-content: flex-start; align-items: flex-start; justify-content: flex-start;
  flex-wrap: wrap; gap: 10px;
}
.picker-empty { color: #999; font-size: 15px; }
/* 球样式：与站点开奖球同源（/img/balls/*.png），非 CSS 渐变 */
.picker-ball {
  width: 40px; height: 40px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  color: #000; font-size: 15px; font-weight: 700;
  background-size: cover;
  background-position: center center;
}
.picker-ball.red { background-image: url('/img/balls/hong3.png'); }
.picker-ball.blue { background-image: url('/img/balls/lan3.png'); }
.picker-ball.green { background-image: url('/img/balls/lv3.png'); }

/* 6 列分类按钮网格：白色卡片背景 */
.picker-grid {
  display: grid; grid-template-columns: repeat(6, 1fr);
  gap: 8px; padding: 12px 10px 24px;
  margin: 0 10px;
  background: #fff;
  border-radius: 12px;
}
.pick-btn-cat {
  background: #f3f4f6; border: 1px solid #e6e8eb;
  border-radius: 8px; padding: 10px 4px; font-size: 14px;
  color: #333; cursor: pointer;
  font-family: inherit;
  transition: background .15s;
}
.pick-btn-cat:active { opacity: .75; }
.pick-btn-cat.on {
  background: linear-gradient(135deg, #00c988, #00915f);
  color: #fff; border-color: transparent; font-weight: 600;
}

/* ============ 通用工具 ============ */
.text-red { color: var(--danger); }
.text-primary { color: var(--primary); }
.text-muted { color: var(--text-muted); }
.fs12 { font-size: 12px; }
.fs13 { font-size: 13px; }
.flex { display: flex; align-items: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }
.mt10 { margin-top: 10px; }
.empty-tip { text-align: center; color: var(--text-muted); padding: 40px 0; font-size: 13px; }

/* ============ 高仿首页：开奖区 sticky + 方案表格 ============ */
.home-draw-wrap {
  background: var(--bg);
  padding-bottom: 8px;
}
.draw-plus { color: #888; font-size: 21px; font-weight: 700; align-self: center; margin: 0 1px; }

/* ===== 北京时间条 ===== */
.beijing-time {
  margin: 0 10px 8px;
  padding: 8px 12px;
  background: #fff;
  border-radius: 8px;
  font-size: 13px;
  text-align: center;
  box-shadow: 0 1px 4px rgba(0,0,0,.05);
}
.beijing-time .bt-label,
.beijing-time #beijingTime { color: #666; }
.beijing-time #beijingTime { font-weight: 700; letter-spacing: .5px; }

/* ===== 开奖球逐个揭示动画（仅 .js-reveal 时生效，无 JS 则正常显示） ===== */
.draw-nums.js-reveal > .ball-wrap,
.draw-nums.js-reveal > .draw-plus { opacity: 0; }
.draw-nums.js-reveal > .ball-wrap.show,
.draw-nums.js-reveal > .draw-plus.show { animation: ballPopIn 0.45s ease-out forwards; }
@keyframes ballPopIn {
  0%   { transform: scale(0.3); opacity: 0; }
  70%  { transform: scale(1.12); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}
.draw-sub-bar {
  margin: 0 10px;
  background: #fff;
  border-radius: 0 0 10px 10px;
  padding: 10px 12px;
  display: flex; align-items: center; justify-content: center; text-align: center;
  font-size: 14px; color: #444;
  border-top: 1px dashed #eee;
  font-weight: 600;
}
.draw-sub-bar .draw-history-link { font-size: 13px; font-weight: 500; }
.draw-extra-imgs {
  display: block; padding: 8px 10px 12px;
  background: #fff; border-radius: 0 0 12px 12px;
}
.draw-extra-imgs img {
  display: block; width: 100%; height: auto; margin-bottom: 6px;
  border-radius: 8px; border: 1px solid #eee; background: #f7f7f7;
}
.draw-extra-imgs img:last-child { margin-bottom: 0; }

/* ============ 开奖下方三张解答图浮层文字 ============
   字体 / 颜色统一由 .pmjd-wrap 提供变量，三张图（pmjd / gpjd / zgxj）
   共用同一份定义，保证挂牌解答、香港小子与平码解答完全一致 */
.pmjd-wrap {
  position: relative; display: block;
  --ov-font: "STXingkai", "STKaiti", "KaiTi", "STXinwei", "SimSun", "serif";
  --ov-color: #45a981;
}
.pmjd-wrap > img { display: block; width: 100%; height: auto; border-radius: 8px; border: 1px solid #eee; background: #f7f7f7; }
.pmjd-ov {
  position: absolute;
  font-size: 20px; font-weight: 900;
  color: var(--ov-color);
  font-family: var(--ov-font);
  /* 纯文字：无底色、无描边、无阴影 */
  text-shadow: none;
  background: transparent;
  padding: 0; border-radius: 0;
  white-space: nowrap; line-height: 1.4;
  box-shadow: none;
  word-spacing: -3px;
}
/* 挂牌解答 / 香港小子：字体/颜色/大小与第一张一致，同样无底色无描边 */
.gpjd-wrap .pmjd-ov,
.zgxj-wrap .pmjd-ov {
  color: var(--ov-color);
  font-family: var(--ov-font);
  font-weight: 900;
  font-size: 20px;
  background: transparent;
  text-shadow: none;
  box-shadow: none;
  text-align: center;
  left: 4%; right: 4%; width: auto;
}
}
.pmjd-wang { width: 88%; line-height: 1.6; font-size: 15px; }
.pmjd-ov[data-k="four"] { top: 30%; left: 60%; }
.pmjd-ov[data-k="twoZ"] { top: 45%; left: 60%; }
.pmjd-ov[data-k="head"] { top: 60%; left: 60%; }
.pmjd-ov[data-k="tail"] { top: 60%; left: 80%; }
.pmjd-ov[data-k="wang"] { top: 80%; left: 50%; }

/* 移动端窄屏：旺数保持与网页完全相同的位置（沿用 left:50%，不做居中），
   仅把字号小一号（15px -> 14px） */
@media (max-width: 520px) {
  .pmjd-wang { font-size: 14px; line-height: 1.5; }
}

/* ============ 挂牌解答浮层（坐标待按图微调，百分比定位） ============ */
.gpjd-wrap { margin-top: 6px; }
/* 挂牌解答浮层：只设 top，左右居中由 .gpjd-wrap .pmjd-ov 控制 */
.pmjd-ov[data-g="nine"] { top: 42%; left: 60%;}
.pmjd-ov[data-g="one"] { top: 64%; left: 55%;}
.pmjd-ov[data-g="digit"] { top: 85%; left: 55%;}

/* ============ 新增预测模板：决尾/二头/二行/三码 ============ */
.tail-chip {
  display: inline-block; padding: 2px 10px; border-radius: 4px;
  background: #f2f2f2; color: #333; font-size: 13px; font-weight: 700;
}
.tail-chip.hit { background: #ffe9b8; color: #c8710a; }
.head-chip, .elem-chip {
  display: inline-block; padding: 1px 8px; border-radius: 4px;
  background: #f2f2f2; color: #333; font-size: 13px; font-weight: 700;
}
.head-chip.hit, .elem-chip.hit { background: #ffe9b8; color: #c8710a; }
.num-box {
  display: inline-block; padding: 1px 6px; margin-right: 3px; border-radius: 4px;
  background: #f2f2f2; color: #333; font-size: 13px; font-weight: 700;
}
.num-box.hit { background: #ffe9b8; color: #c8710a; }
.pt-sep { color: #999; margin: 0 2px; }
.pt-bracket.hit { color: #c8710a; }

/* ============ 香港小子浮层（坐标待按图微调，百分比定位） ============ */
.zgxj-wrap { margin-top: 6px; }
/* 香港小子浮层：只设 top，左右居中由 .zgxj-wrap .pmjd-ov 控制 */
.pmjd-ov[data-z="nums"] { top: 33%;left: 45%; white-space: normal; }
.pmjd-ov[data-z="nine"] { top: 65%; white-space: normal; }
.pmjd-ov[data-z="one"] { top: 90%; left: 59%;}

/* ============ 首页刷新弹窗：四肖八码大放送 ============ */
.popup-mask {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 200;
  display: none;
  align-items: center; justify-content: center;
  padding: 20px;
}
.popup-mask.show { display: flex; }
.popup-card {
  width: 100%; max-width: 440px;
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 12px 34px rgba(0,0,0,.28);
}
.popup-head {
  background: var(--primary-grad);
  color: #fff;
  text-align: center;
  padding: 15px 46px;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 1px;
  position: relative;
}
.popup-close {
  position: absolute; right: 10px; top: 50%;
  transform: translateY(-50%);
  font-size: 27px; line-height: 1;
  cursor: pointer; opacity: .9;
  width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
}
.popup-body {
  padding: 18px 16px;
  display: flex; flex-direction: column; gap: 13px;
  max-height: 66vh; overflow-y: auto;
}
.popup-row {
  background: #fffbe8;
  border: 1px solid #ffe9a8;
  border-radius: 10px;
  padding: 16px 14px;
  text-align: center;
  color: var(--danger);
  font-weight: 700;
}
.popup-title { font-size: 17px; margin-bottom: 9px; }
.popup-zx, .popup-num { font-size: 20px; letter-spacing: 2px; margin-top: 5px; }
.popup-foot { padding: 14px 0 22px; display: flex; justify-content: center; }
.popup-btn {
  background: var(--primary-grad);
  color: #fff;
  border: none;
  border-radius: 24px;
  padding: 12px 52px;
  font-size: 18px;
  font-weight: 700;
  box-shadow: 0 4px 10px rgba(0,181,120,.35);
  cursor: pointer;
}

/* ===== 欲钱波色 专属模板（按截图还原） ===== */
.bose-head {
  display: flex; background: #f4c430; border: 1px solid #e0a800;
}
.bose-head .bose-col {
  flex: 1; text-align: center; padding: 6px 2px; font-size: 14px; line-height: 1.5;
  border-right: 1px solid #fff;
}
.bose-head .bose-col:last-child { border-right: none; }
.bose-head .bose-col b { display: block; font-size: 16px; }
.bose-col.c-red b { color: #e53935; }
.bose-col.c-blue b { color: #1565c0; }
.bose-col.c-green b { color: #2e7d32; }
.bose-head .bose-col span { color: #333; }
.bose-table { border-top: none; }
.bose-table td { border: 1px solid #f0c0c0; }
.bose-table .plan-period { color: #e53935; font-weight: bold; font-size: 15px; white-space: nowrap; }
.bose-table .bose-all { color: #8e24aa; margin-right: 4px; }
.bose-table .bose-combo { color: #e53935; font-weight: bold; }
.bose-table .bose-combo.hit { color:#52c41a; background:#eafbe7; padding:1px 5px; border-radius:5px; }
.bose-table .latest { background: #fff8e1; }
.draw-history-link {
  display: inline-block;
  background: #ff8c00;
  padding: 5px 14px; border-radius: 4px; font-size: 13px; font-weight: 600;
  text-decoration: none; white-space: nowrap;
}
/* 强制白色文字：覆盖 a{color:inherit} 与浏览器 a:visited 默认色 */
.draw-history-link,
.draw-history-link:link,
.draw-history-link:visited,
.draw-history-link:hover,
.draw-history-link:active { color: #fff; }

.plan-main { padding: 10px 0 20px; min-height: 300px; }
.plan-table-title {
  margin: 0 10px 8px;
  display: flex; align-items: center; justify-content: space-between;
  font-size: 15px; font-weight: 600;
}
.plan-menu-btn {
  background: #fff; border: 1px solid var(--border); border-radius: 14px;
  padding: 4px 10px; font-size: 12px; color: var(--primary); font-weight: 500;
}

/* ============ 统一方案表格（目标站三公特肖样式） ============ */
.plan-main { margin: 0 10px 18px; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,.05); }
.plan-table-title {
  position: relative;
  background: linear-gradient(180deg, #6ea64a 0%, #4f8a3a 100%);
  color: #fff;
  text-align: center;
  padding: 10px 28px;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 1px;
  display: flex; align-items: center; justify-content: center;
}
.plan-table-title::before, .plan-table-title::after {
  content: '';
  position: absolute;
  top: 6px;
  width: 10px; height: 10px;
  background: #fff;
  border: 2px solid #4f8a3a;
  border-radius: 2px;
}
.plan-table-title::before { left: 6px; }
.plan-table-title::after { right: 6px; }
.plan-title-text { flex: 1; text-align: center; }
.plan-menu-btn { color: #fff; font-size: 16px; opacity: .85; margin-left: auto; }

/* ============ 主页底部参考图 ============ */
.home-extra-section { padding: 0 10px 20px; }
.home-extra-card { margin-bottom: 14px; background: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,.05); }
.home-extra-title { background: linear-gradient(180deg, #6ea64a 0%, #4f8a3a 100%); color: #fff; text-align: center; padding: 10px; font-weight: 700; font-size: 15px; letter-spacing: 1px; }
.home-extra-card img { display: block; width: 100%; height: auto; }
.plan-menu-btn:hover { opacity: 1; }

.plan-cover-wrap { padding: 12px; background: #fff; border-bottom: 1px solid #f0f0f0; }
.plan-cover { width: 100%; border-radius: 6px; display: block; }

.plan-table { width: 100%; border-collapse: collapse; background: #fff; table-layout: fixed; }
.plan-table th {
  background: #ecf3fb;
  color: #333;
  padding: 10px 8px;
  font-weight: 600;
  font-size: 15px;
  border-bottom: 2px solid #c8dcef;
  text-align: center;
}
.plan-table th:nth-child(1) { width: 22%; }
.plan-table th:nth-child(2) { width: 52%; }
.plan-table th:nth-child(3) { width: 26%; }
.plan-table td {
  padding: 10px 6px;
  font-size: 14px;
  border-bottom: 1px solid #f0f0f0;
  text-align: center;
  vertical-align: middle;
  color: #333;
}
.plan-table td.plan-content { white-space: normal; }
.plan-table tr.latest td { background: #fff7e0; }
.plan-table tr:last-child td { border-bottom: none; }

.plan-period { color: #666; font-weight: 500; }
.plan-content { color: #4a90e2; }
.plan-plus { color: #999; padding: 0 2px; font-weight: 600; }

.plan-result { font-weight: 600; color: #c0392b; }
.plan-result.hit { color: #52c41a; }
.plan-result.miss { color: #999; }
.plan-result .result-mark { margin-left: 4px; font-size: 16px; }
.plan-result.hit .result-mark { color: #52c41a; }
.plan-result.miss .result-mark { color: #ff4d4f; }
.plan-result .pending { color: #8a4dff; font-weight: 700; }

/* 预测模板结果（plan-*.ejs 用 .result-text） */
.result-text { font-weight: 700; }
.result-text.hit { color: #52c41a; }
.result-text.miss { color: #999; }

/* 生肖 chip */
.zodiac-chip {
  display: inline-block;
  min-width: 46px;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 15px;
  font-weight: 600;
  margin: 0 1px;
}
.chip-ren { background: transparent; color: #4a90e2; }
.chip-di { background: transparent; color: #4a90e2; }
.chip-tian { background: transparent; color: #4a90e2; }
.zodiac-chip.hit { background: #ff9800; color: #fff; }

/* 号码 chip */
.plan-num-chip { font-size: 16px; color: #4a90e2; font-weight: 600; }
.plan-num-chip span.hit { background: #fff3b8; color: #c25e00; font-weight: 700; padding: 0 2px; border-radius: 2px; }

/* 大小单双 chip */
.bs-chip { display: inline-block; padding: 3px 14px; border-radius: 4px; font-weight: 700; font-size: 16px; min-width: 46px; text-align: center; }
.bs-chip.chip-big, .bs-chip.chip-single { background: transparent; color: #ff6633; }
.bs-chip.chip-small, .bs-chip.chip-double { background: transparent; color: #5a6877; }
.bs-chip.hit { background: #ff9800; color: #fff; }

/* 文字 chip */
.text-chip { display: inline-block; padding: 3px 10px; border-radius: 4px; background: transparent; color: #c25e00; font-weight: 700; font-size: 14px; }
.text-decode { font-size: 13px; color: #888; margin-left: 6px; }

/* ===== 通用预测模板片段（planf-generic） ===== */
.pt-n {
  display: inline-block; min-width: 30px; padding: 2px 5px; margin: 1px;
  border: 1px solid #ddd; border-radius: 4px; background: #fafafa;
  font-size: 15px; font-weight: 600; color: #4a90e2;
}
.pt-n.hit { background: #ffeb3b; border-color: #f9a825; color: #c25e00; font-weight: 700; }
.pt-tag {
  display: inline-block; padding: 2px 8px; margin: 1px;
  border: 1px solid #ddd; border-radius: 4px; background: #fafafa;
  font-size: 15px; font-weight: 700; color: #4a90e2;
}
.pt-tag.hit { background: #ffeb3b; border-color: #f9a825; color: #c25e00; }
.pt-bracket {
  display: inline-block; padding: 2px 10px; margin: 1px;
  border: 1px solid #d0d7de; border-radius: 4px; background: #f5f7fa;
  font-size: 16px; font-weight: 700; color: #4a90e2;
}
.pt-bracket.hit { background: #ffeb3b; border-color: #f9a825; color: #c25e00; }
/* 开奖结果中的「准/错」徽标（结果文字本身保持纯文本） */
.pt-badge {
  display: inline-block; margin-left: 4px;
  padding: 1px 8px; border-radius: 10px;
  font-size: 14px; font-weight: 700; color: #fff;
  white-space: nowrap;
}
.pt-badge.hit { background: #52c41a; }
.pt-badge.miss { background: #bfbfbf; }

.pt-legend {
  padding: 8px 10px; font-size: 14px; line-height: 1.7;
  color: #4a7c3f; background: #f6fbef;
  border-top: 1px solid #e6efdc;
}
/* 恢复 result-mark 颜色：与文字主色一致 */
.plan-result.hit .result-mark { color: #52c41a; }
.plan-result.miss .result-mark { color: #ff4d4f; }
.zodiac-chip.pt-hit { background: #ff9800; color: #fff; }

/* ===== 指定方案预测内容单独加大：黑白生肖(011) / 阴阳生肖(012) / 胆大胆小(018) / 平特一肖(044) / 平特三肖(045) ===== */
#plan-plan011 .plan-content, #plan-plan012 .plan-content, #plan-plan018 .plan-content,
#plan-plan044 .plan-content, #plan-plan045 .plan-content { font-size: 19px; }

#plan-plan011 .zodiac-chip, #plan-plan012 .zodiac-chip, #plan-plan018 .zodiac-chip,
#plan-plan044 .zodiac-chip, #plan-plan045 .zodiac-chip { font-size: 19px; min-width: 52px; }

#plan-plan011 .pt-tag, #plan-plan012 .pt-tag, #plan-plan018 .pt-tag,
#plan-plan044 .pt-tag, #plan-plan045 .pt-tag,
#plan-plan011 .pt-n, #plan-plan012 .pt-n, #plan-plan018 .pt-n,
#plan-plan044 .pt-n, #plan-plan045 .pt-n { font-size: 19px; }

#plan-plan011 .pt-bracket, #plan-plan012 .pt-bracket, #plan-plan018 .pt-bracket,
#plan-plan044 .pt-bracket, #plan-plan045 .pt-bracket,
#plan-plan011 .bs-chip, #plan-plan012 .bs-chip, #plan-plan018 .bs-chip,
#plan-plan044 .bs-chip, #plan-plan045 .bs-chip { font-size: 20px; }

/* 右侧方案抽屉 */
.plan-drawer-mask { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 150; opacity: 0; pointer-events: none; transition: opacity .2s; }
.plan-drawer-mask.show { opacity: 1; pointer-events: auto; }
.plan-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; width: 72%; max-width: 320px;
  background: #fff; z-index: 160;
  transform: translateX(100%); transition: transform .25s ease-out;
  display: flex; flex-direction: column;
}
.plan-drawer.open { transform: translateX(0); }
.plan-drawer-head {
  padding: 12px 14px; border-bottom: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between;
  font-size: 16px; font-weight: 600;
}
.plan-drawer-close { color: #999; font-size: 18px; cursor: pointer; }
.plan-drawer-body { flex: 1; overflow-y: auto; padding: 6px 0; }
.plan-drawer-item {
  display: flex; align-items: center;
  padding: 10px 14px; font-size: 14px;
  border-bottom: 1px solid #f8f8f8;
  color: var(--text);
}
.plan-drawer-item.active { background: #f0fff8; color: var(--primary); }
.plan-drawer-no { color: var(--text-light); min-width: 32px; }
.plan-drawer-name { flex: 1; }
.plan-drawer-arrow { color: #ccc; }

/* 回到顶部按钮（位于图榜专区按钮上方，滚动超过 300px 才显示） */
.fab-top {
  position: fixed; right: 12px; bottom: 124px; z-index: 90;
  width: 42px; height: 42px; border-radius: 50%;
  background: rgba(0, 0, 0, .45); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; line-height: 1; text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .2);
  opacity: 0; pointer-events: none;
  transform: translateY(8px);
  transition: opacity .25s, transform .25s, background .2s;
}
.fab-top.show { opacity: 1; pointer-events: auto; transform: translateY(0); }
.fab-top:active { background: rgba(0, 0, 0, .65); }

/* 浮动方案按钮 */
.fab-plan {
  position: fixed; right: 12px; bottom: 72px; z-index: 90;
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--primary-grad); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; box-shadow: 0 3px 10px rgba(0,181,120,.4);
}

/* ============ 属性知识页 sx-tag ============ */
.sx-tag {
  display: inline-block;
  width: 24px; height: 24px; line-height: 24px;
  border-radius: 50%; text-align: center;
  color: #fff; font-size: 12px; font-weight: 600;
  margin: 2px; background: var(--danger);
}
.sx-tag.blue { background: #2e7be6; }
.sx-tag.green { background: #16a05d; }
.sx-tag.red { background: var(--danger); }

.sx-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 10px; }
.sx-item { background: #fafafa; border-radius: 8px; padding: 8px 4px; text-align: center; border: 1px solid var(--border); }
.sx-item dt { font-weight: 600; font-size: 13px; margin-bottom: 5px; }
.sx-item dd { font-size: 11px; }

.sx-prop-list { padding: 0 14px 10px; }
.sx-prop-list .prop-row { padding: 8px 0; border-bottom: 1px solid var(--border); font-size: 13px; display: flex; }
.sx-prop-list .prop-row:last-child { border-bottom: none; }
.sx-prop-list .prop-row .prop-key { color: var(--primary); font-weight: 600; min-width: 70px; flex-shrink: 0; }

/* ===== planf 通用组件（24 个截图模板复用） ===== */
.pf-title { background: #2e8b57; color: #fff; text-align: center; padding: 10px 0; font-weight: 700; border-radius: 12px 12px 0 0; font-size: 15px; }
.pf-title small { display:block; font-size:12px; font-weight:400; margin-top:2px; color:#fff7cc; }
.pf-title-red { background: #d32f2f; color: #ffe082; text-align: center; padding: 10px 0; font-weight: 700; border-radius: 12px 12px 0 0; font-size: 15px; border: 2px solid #b71c1c; border-bottom:none; }
.pf-title-red small { display:block; font-size:12px; font-weight:400; margin-top:2px; color:#fff; }
.pf-wrap { background:#fff; border-radius:0 0 12px 12px; overflow:hidden; margin-bottom:10px; border:1px solid #e0e0e0; border-top:none; }
.pf-table { width:100%; border-collapse:collapse; font-size:15px; }
.pf-table th { background:#f0f7ff; color:#333; padding:8px 4px; font-weight:600; border-bottom:1px solid #e0e0e0; }
.pf-table td { padding:8px 4px; border-bottom:1px solid #eee; text-align:center; vertical-align:middle; }
.pf-table tr.latest td { background:#fff8e1; }
.pf-table tr:last-child td { border-bottom:none; }
.pf-period { color:#d32f2f; font-weight:700; }
.pf-result { font-weight:700; }
.pf-result .hit { color:#52c41a; }
.pf-result .miss { color:#999; }
.pf-result .pending { color:#9c27b0; }
.pf-num { display:inline-block; min-width:30px; padding:3px 5px; background:#f5f5f5; border:1px solid #ddd; border-radius:4px; margin:1px; font-size:15px; color:#4a90e2; }
.pf-num.hit { background:#ffeb3b; color:#c25e00; border-color:#f9a825; font-weight:700; }
.pf-zx { display:inline-block; padding:2px 6px; border-radius:4px; margin:1px; font-size:15px; font-weight:600; color:#4a90e2; }
.pf-zx.hit { background:#ff9800; color:#fff; }
.pf-tag { display:inline-block; padding:3px 8px; border-radius:4px; background:#e0e0e0; color:#555; margin:1px; font-size:14px; }
.pf-tag.on { background:#ff6f00; color:#fff; }
.pf-tag.blue { background:#2196f3; color:#fff; }
.pf-tag.green { background:#4caf50; color:#fff; }
.pf-tag.red { background:#f44336; color:#fff; }
.pf-tag.gray { background:#bdbdbd; color:#fff; }
.pf-sub { color:#d32f2f; font-weight:700; }
.pf-sub.purple { color:#9c27b0; }
.pf-head-label { color:#d32f2f; font-weight:700; display:inline-block; margin-right:4px; }
.pf-head-row { margin:2px 0; }
.pf-nannv-head { display:flex; background:#ffeb3b; color:#d32f2f; text-align:center; font-weight:700; padding:6px 0; font-size:13px; }
.pf-nannv-head > div { flex:1; }
.pf-6x-grid, .pf-30-grid { display:flex; flex-wrap:wrap; justify-content:center; gap:4px; }
.pf-6x-item, .pf-30-item { text-align:center; border:1px solid #ddd; border-radius:4px; padding:4px; min-width:54px; }
.pf-6x-item .zx, .pf-30-item .zx { color:#d32f2f; font-weight:700; font-size:14px; display:block; }
.pf-6x-item .nums, .pf-30-item .nums { font-size:13px; }
.pf-6x-item.hit, .pf-30-item.hit { border-color:#ff9800; background:#fff3e0; }
.pf-wx-item { display:inline-block; padding:4px 8px; border:1px solid #ddd; border-radius:4px; margin:1px; font-weight:700; }
.pf-wx-item.hit { background:#ffea00; border-color:#ff9800; }
.pf-ptxs { color:#673ab7; font-size:15px; line-height:1.7; }
.pf-ptxs .zx { color:#d32f2f; font-weight:700; background:#ffeb3b; padding:1px 4px; border-radius:3px; }
.pf-3z4w-line { line-height:1.6; font-size:15px; }
.pf-3z4w-line b { color:#d32f2f; margin-right:4px; }
.pf-jt-title { background:#00e676; color:#000; text-align:center; padding:6px; font-weight:700; font-size:13px; display:flex; }
.pf-jt-title span { flex:1; }
.pf-jt-row { background:#000; color:#fff; text-align:center; padding:8px 4px; border-bottom:1px solid #333; }
/* 期号行：整行绿底（抵消 .pf-jt-row 的左右内边距） */
.pf-jt-row .period { background:#00e676; color:#000; padding:5px 8px; border-radius:0; display:block; margin:-8px -4px 6px; font-size:16px; font-weight:700; }
.pf-jt-grid { display:flex; }
.pf-jt-grid > div { flex:1; padding:6px 2px; }
/* 三列之间的竖向分割线 */
.pf-jt-grid > div + div { border-left:1px solid #333; }
.pf-jt-grid .label { color:#00e676; font-weight:700; font-size:17px; }
.pf-jt-grid .val { color:#fff; font-size:16px; }
.pf-jt-grid .result { color:#ff1744; font-size:14px; margin-top:2px; }
.pf-jt-grid .result.hit { color:#ffea00; }
/* 括号内内容白色；待开奖紫色 */
.pf-jt-grid .label .br { color:#fff; }
.pf-jt-grid .result .wait { color:#a855f7; font-weight:700; }
/* 预测结果：黄底黑字高亮 */
.pf-jt-grid .result .ytag { background:#ffea00; color:#000; font-weight:700; padding:1px 6px; border-radius:3px; display:inline-block; }
/* 预测错误：无底色，红字 */
.pf-jt-grid .result .ytag.miss { background:transparent; color:#ff1744; padding:1px 0; }
.pf-2t-row { text-align:left; padding:4px 8px; }

/* ===== 八肖八码纯文字列表样式（复刻 31198.top 图榜 · 八肖八码） ===== */
.t3-baxiao-bama {
  --theme-title-bg: linear-gradient(to right, #1a5a2e, #5bc982);
  --theme-title-color: #fff;
  --theme-win-bg: #ffeb3b;
  --theme-win-text: #ff0000;
  margin: 8px 0 14px;
  font-size: 15px;
  color: #000;
}
.t3-baxiao-bama .method-title {
  background: var(--theme-title-bg);
  color: var(--theme-title-color);
  text-align: center;
  padding: 8px 10px;
  font-size: 17px;
  font-weight: 700;
}
.t3-baxiao-bama .method-list { background: #fff; }
.t3-baxiao-bama .method-item { padding: 4px 10px; border-bottom: 1px solid #f0f0f0; }
.t3-baxiao-bama .method-item:first-child { padding-top: 2px; }
.t3-baxiao-bama .method-item:last-child { border-bottom: none; padding-bottom: 8px; }
.t3-baxiao-bama .item-row-1 {
  text-align: center;
  padding-bottom: 2px; font-size: 16px; color: #333;
}
.t3-baxiao-bama .plan-name { color: #1e7fe0; }
.t3-baxiao-bama .result-hit { color: var(--theme-win-text); }
.t3-baxiao-bama .item-row-2 {
  text-align: center; font-size: 15px; line-height: 1.5; color: #333;
}
.t3-baxiao-bama .item-row-oneline {
  text-align: center; overflow-x: auto;
  font-size: 15px; line-height: 1.5; color: #333; padding: 2px 6px 3px;
}
.t3-baxiao-bama .method-item:has(.item-row-oneline) { padding-top: 1px; padding-bottom: 1px; }
.t3-baxiao-bama .method-item:has(.item-row-oneline):first-child { padding-top: 1px; }
.t3-baxiao-bama .method-item:has(.item-row-oneline):last-child { border-bottom: none; padding-bottom: 3px; }
.t3-baxiao-bama .item-row-oneline .oneline-inner {
  display: inline-block; min-width: 100%; white-space: normal; word-break: break-word;
  text-align: center;
}
.t3-baxiao-bama .item-row-oneline .zodiac-cell,
.t3-baxiao-bama .item-row-oneline .number-cell,
.t3-baxiao-bama .item-row-oneline .label-cell { padding: 0; }
.t3-baxiao-bama .item-row-oneline .zodiac-cell.cell-hit,
.t3-baxiao-bama .item-row-oneline .number-cell.cell-hit,
.t3-baxiao-bama .item-row-oneline .label-cell.cell-hit { padding: 0 2px; }
.t3-baxiao-bama .zx-group,
.t3-baxiao-bama .n-group { display: inline; white-space: nowrap; }
.t3-baxiao-bama .zodiac-cell,
.t3-baxiao-bama .number-cell,
.t3-baxiao-bama .label-cell { display: inline; padding: 0 1px; }
.t3-baxiao-bama .zodiac-cell.cell-hit,
.t3-baxiao-bama .number-cell.cell-hit,
.t3-baxiao-bama .label-cell.cell-hit {
  background: var(--theme-win-bg); color: var(--theme-win-text);
  padding: 1px 3px; border-radius: 2px;
}
.t3-baxiao-bama .method-legend { padding: 8px 10px; font-size: 14px; line-height: 1.7; color: #4a7c3f; background: #f6fbef; }

/* ============ PC / 平板：统一放宽到 720px（手机端仍为 480px） ============ */
@media (min-width: 768px) {
  body { max-width: 720px; }
  .app-header { max-width: 720px; }
  .app-tabbar { max-width: 720px; }
}

/* ============ PC / 大屏：仅走势图页解除 480px 限制，直接展开（其他页面保持原宽度） ============ */
@media (min-width: 768px) {
  body.page-trend,
  body.page-trend .app-header,
  body.page-trend .app-tabbar { max-width: 1200px; }
  body.page-trend .trend-wrap { max-height: none; }
  body.page-trend .trend-table { font-size: 12px; }
  body.page-trend .trend-table th,
  body.page-trend .trend-table td { padding: 6px 3px; min-width: 22px; }
  body.page-trend .trend-table th.col-period,
  body.page-trend .trend-table td.col-period { min-width: 60px; font-size: 12px; }
  body.page-trend .trend-table td.hit .tb { min-width: 20px; height: 20px; line-height: 20px; font-size: 11px; }
}