/* ==========================================================================
   N 系列（n1~n4）统一规则
   ① 顶端标题行一律不显示 —— 只保留彩种切换与内容（需求方要求）
   ② 所有插图与文字内容强制同宽（占满容器），图片自适应（width:100% + 高度自动）
   ========================================================================== */

/* ① 去掉顶端标题行：
   .m-top .row1  = 「页面名 · 彩种名 + 更新于 …」（N1/N2 走 M.Top 时在这里）
   .npc4-top     = N4 的静态标题行（标题 + 数据状态 + 黑夜切换）
   保留 .m-seg / .m-game-btn（彩种切换）不动。 */
.m-top .row1 { display: none !important; }
.npc4-top { display: none !important; }

/* ② 内容强制同宽：页面容器里的一级子块（广告、开奖卡、标签栏、表格、卡片）都占满容器 */
.m-wrap > *,
.npc-wrap > *,
.npc4-wrap > * { width: 100% !important; max-width: 100%; box-sizing: border-box; }

/* 表格也占满容器，避免"文字比图片窄" */
.m-wrap table,
.npc-wrap table,
.npc4-wrap table { width: 100% !important; table-layout: fixed; }

/* 图片自适应：容器内所有插图的宽度与内容一致，高度按比例 */
/* ③ 图片自适应：容器内所有插图的宽度与内容一致，高度按比例。
   注意 n-pc.css 里有 `.npc-adv .m-adv { display:inline-block; max-width:960px }`，
   会把 PC 页的广告图卡在 960px（实测：容器 1161px，图片只有 958px），必须覆盖掉。 */
.npc-adv,
.npc-adv .m-adv,
.npc-wrap .m-adv,
.npc4-wrap .m-adv {
  display: block !important; width: 100% !important; max-width: 100% !important;
  margin-left: 0 !important; margin-right: 0 !important; text-align: left !important;
}

.m-wrap img,
.npc-wrap img,
.npc4-wrap img { width: 100% !important; max-width: 100% !important; height: auto !important; display: block; }

/* ==========================================================================
   ④ N4（pic28.cc → n4.html）顶部主视觉：最新开奖居中放大
   —— 原顶部有四处重复：占位横幅（含假二维码与"1/2/3"说明文案）、永久网址条、
      状态条里的小号开奖、号码球行又重复一遍开奖。此处合并成唯一一个居中主视觉。
   —— 所有选择器都带 .npc4-wrap 前缀，N2/N3 的 .npc-bar / .npc-banner / .npc-addr 不受影响。
   ========================================================================== */
.npc4-wrap .npc4-hero {
  margin: 0 0 12px;
  padding: 22px 20px 20px;
  border-radius: 18px;
  border: 1px solid #3A2F26;
  background: radial-gradient(120% 150% at 50% -10%, #2E241B 0%, #1A1512 55%, #141010 100%);
  box-shadow: 0 16px 36px rgba(24, 16, 10, .16);
  text-align: center;
  color: #F3EDE6;
}

/* 顶部一行：彩种 + 状态点 + 更新时间 */
.npc4-wrap .npc4-hero .hero-top {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  font: 600 15px/1 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #A89887; letter-spacing: 1px; margin-bottom: 12px;
}
.npc4-wrap .npc4-hero .hero-top .name { color: #E8B15C; font-weight: 700; letter-spacing: 2px; }
.npc4-wrap .npc4-hero .hero-top .dot {
  width: 7px; height: 7px; border-radius: 50%; background: #34D399; flex: 0 0 auto;
}
.npc4-wrap .npc4-hero .hero-top .dot.warn { background: #FBBF24; }

/* 期号 */
.npc4-wrap .npc4-hero .no {
  font: 600 17px/1.2 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  color: #A89887; letter-spacing: 3px;
}
.npc4-wrap .npc4-hero .no b {
  color: #F5C56B; margin: 0 7px; letter-spacing: 2px;
  font: 700 27px/1.2 "Oswald", "Barlow Condensed", "DIN Condensed", Impact, system-ui, sans-serif;
  font-variant-numeric: tabular-nums;
}

/* 号码行：4 + 1 + 2 = 7 */
.npc4-wrap .npc4-hero .draw {
  display: flex; align-items: center; justify-content: center;
  gap: 12px; margin: 14px 0 2px;
}
.npc4-wrap .npc4-hero .draw.empty {
  height: 112px; color: #8A7A68;
  font: 600 16px/1 -apple-system, "PingFang SC", sans-serif;
}
.npc4-wrap .npc4-hero .ball {
  width: 96px; height: 96px; border-radius: 50%; flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  background: #241C16; border: 1px solid #4A3B2E; color: #F5C56B;
  font: 700 52px/1 "Oswald", "Barlow Condensed", "DIN Condensed", Impact, system-ui, sans-serif;
  font-variant-numeric: tabular-nums;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}
.npc4-wrap .npc4-hero .ball.sum {
  width: 128px; height: 128px; border: none; font-size: 66px; color: #2A1B0C;
  background: linear-gradient(160deg, #FFC24A 0%, #F59E0B 42%, #EA580C 100%);
  box-shadow: 0 0 0 6px rgba(245, 158, 11, .10), 0 0 34px rgba(245, 158, 11, .30);
}
.npc4-wrap .npc4-hero .op {
  flex: 0 0 auto; color: #8A7A68;
  font: 400 34px/1 -apple-system, "PingFang SC", sans-serif;
}
.npc4-wrap .npc4-hero .bdg {
  width: 46px; height: 46px; border-radius: 12px; flex: 0 0 auto;
  display: flex; align-items: center; justify-content: center;
  font: 700 23px/1 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
}
.npc4-wrap .npc4-hero .bdg.ds {
  background: rgba(251, 146, 60, .16); color: #FB923C; border: 1px solid rgba(251, 146, 60, .35);
}
.npc4-wrap .npc4-hero .bdg.dx {
  background: rgba(56, 189, 248, .14); color: #38BDF8; border: 1px solid rgba(56, 189, 248, .32);
}

/* 倒计时 + 进度条 */
.npc4-wrap .npc4-hero .cdwrap { margin-top: 14px; }
.npc4-wrap .npc4-hero .cd {
  color: #F3EDE6; letter-spacing: 2px;
  font: 700 58px/1 "Oswald", "Barlow Condensed", "DIN Condensed", Impact, system-ui, sans-serif;
  font-variant-numeric: tabular-nums;
}
.npc4-wrap .npc4-hero .cd small {
  display: block; margin-bottom: 9px; letter-spacing: 3px; color: #8A7A68;
  font: 600 13px/1 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
}
.npc4-wrap .npc4-hero .bar {
  height: 6px; border-radius: 3px; overflow: hidden;
  background: #2C231D; margin: 14px auto 0; max-width: 560px;
}
.npc4-wrap .npc4-hero .bar i {
  display: block; height: 100%; border-radius: 3px;
  background: linear-gradient(90deg, #FFC24A, #F59E0B 45%, #EA580C);
  transition: width .35s linear;
}

/* 窄屏等比收缩，保证一屏内仍能看到完整号码行 */
@media (max-width: 760px) {
  .npc4-wrap .npc4-hero { padding: 16px 12px 16px; border-radius: 14px; }
  .npc4-wrap .npc4-hero .hero-top { font-size: 12px; margin-bottom: 9px; }
  .npc4-wrap .npc4-hero .no { font-size: 13px; letter-spacing: 2px; }
  .npc4-wrap .npc4-hero .no b { font-size: 21px; margin: 0 4px; }
  .npc4-wrap .npc4-hero .draw { gap: 6px; margin: 10px 0 0; }
  .npc4-wrap .npc4-hero .ball { width: 60px; height: 60px; font-size: 32px; }
  .npc4-wrap .npc4-hero .ball.sum { width: 78px; height: 78px; font-size: 40px; }
  .npc4-wrap .npc4-hero .op { font-size: 20px; }
  .npc4-wrap .npc4-hero .bdg { width: 32px; height: 32px; border-radius: 9px; font-size: 16px; }
  .npc4-wrap .npc4-hero .cd { font-size: 38px; }
  .npc4-wrap .npc4-hero .cd small { font-size: 11px; margin-bottom: 6px; }
  .npc4-wrap .npc4-hero .bar { margin-top: 10px; height: 5px; }
}

/* ==========================================================================
   ⑤ N4 下半部分与主视觉统一：标签栏去掉高饱和深蓝/青色，改quiet分段式；
      表格头改暖灰，与上方的暖黑主视觉同一套配色语言。仅 .npc4-wrap 生效。
   ========================================================================== */
.npc4-wrap .npc-tabs {
  display: flex;
  background: #fff;
  border: 1px solid #E8E3DC;
  border-bottom: 0;
  border-radius: 14px 14px 0 0;
  overflow: hidden;
  margin-bottom: 0;
}
.npc4-wrap .npc-tabs button {
  flex: 1 1 0; min-width: 0; height: 48px;
  border: 0; background: transparent; color: #6B6157;
  font: 600 15px/1 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  position: relative; cursor: pointer;
  transition: color .15s ease, background .15s ease;
}
.npc4-wrap .npc-tabs button + button { box-shadow: inset 1px 0 0 #F3EEE8; }
.npc4-wrap .npc-tabs button:hover { background: #FBF8F4; color: #1E1915; }
.npc4-wrap .npc-tabs button.on { background: transparent; color: #1E1915; }
.npc4-wrap .npc-tabs button.on::after {
  content: ""; position: absolute; left: 50%; bottom: 0;
  transform: translateX(-50%);
  width: 58px; height: 3px; border-radius: 2px;
  background: linear-gradient(90deg, #FFC24A, #EA580C);
}
.npc4-wrap .npc-panel {
  border: 1px solid #E8E3DC;
  border-top: 0;
  border-radius: 0 0 14px 14px;
  overflow: hidden;
}
.npc4-wrap .npc-panel .m-card-title { color: #1E1915; font-weight: 700; }
.npc4-wrap .npc-tb thead td {
  background: #FAF6F1;
  color: #9A8B7B;
  font-weight: 600;
  letter-spacing: 1px;
}
.npc4-wrap .npc-tb tbody tr:nth-child(even) { background: #FCFAF7; }
.npc4-wrap .npc-tb .res { color: #B45309; font-weight: 700; }
.npc4-wrap .npc-tb .no { color: #4A4038; font-weight: 600; font-variant-numeric: tabular-nums; }

/* 遗漏统计：收进与主视觉同一套暖白卡片语言 */
.npc4-wrap .npc4-row { margin: 0 0 12px; }
.npc4-wrap .npc4-miss {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  background: #fff; border: 1px solid #E8E3DC; border-radius: 12px;
  padding: 12px 16px;
}
.npc4-wrap .npc4-cap {
  color: #9A8B7B; letter-spacing: 1px; margin-right: 4px;
  font: 600 14px/1 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
}
.npc4-wrap .npc4-misscell {
  color: #6B6157; background: #FBF7F2; border: 1px solid #F0E8DE;
  border-radius: 999px; padding: 7px 14px;
  font: 500 14px/1 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
}
.npc4-wrap .npc4-misscell b { color: #B45309; font-weight: 700; margin: 0 2px; }
.npc4-wrap .npc4-misscell.hot {
  background: rgba(251, 146, 60, .10);
  border-color: rgba(251, 146, 60, .30);
  color: #9A3412;
}