:root { color-scheme: light; }
* { box-sizing: border-box; }
html { font-size: 100px; scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: #eee; color: #111; font-family: Arial, "Microsoft YaHei", sans-serif; }
a { text-decoration: none; }
.main { width: 100%; }
.conten { width: 100%; }
.wrap { width: min(100%, 850px); margin: 0 auto; overflow: hidden; background: #fff; box-shadow: 0 0 24px rgb(0 0 0 / 8%); }
.logo { position: relative; width: 100%; background: #fff; }
.logo img { display: block; width: 100%; height: auto; }
.logo-dizhi { position: absolute; right: .18rem; bottom: .08rem; margin: 0; color: #fff; font-weight: 800; font-size: .18rem; text-shadow: 0 1px 4px #000; }
.section-anchor { display: block; height: 0; scroll-margin-top: .1rem; }
.notice-overlay { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; padding: 20px; background: rgb(0 0 0 / 58%); animation: notice-in .18s ease-out; }
.notice-overlay.is-closing { opacity: 0; transition: opacity .18s ease; }
.notice-card { position: relative; width: min(92vw, 460px); padding: 34px 28px 26px; border: 4px solid #ed1c24; border-radius: 12px; background: #fffbea; text-align: center; box-shadow: 0 20px 70px rgb(0 0 0 / 40%); }
.notice-icon { display: grid; place-items: center; width: 66px; height: 66px; margin: -66px auto 12px; border: 4px solid #fff; border-radius: 50%; background: #ed1c24; color: #fff; font-size: 34px; font-weight: 900; }
.notice-card h2 { margin: 0 0 12px; color: #d50000; font-size: 27px; }
.notice-card p { margin: 0; color: #222; font-size: 18px; font-weight: 700; line-height: 1.7; white-space: pre-wrap; }
.notice-close { position: absolute; top: 8px; right: 10px; width: 34px; height: 34px; border: 0; background: transparent; color: #777; font-size: 30px; cursor: pointer; }
.notice-confirm { margin-top: 22px; min-width: 150px; padding: 11px 24px; border: 0; border-radius: 30px; background: #ed1c24; color: #fff; font-size: 16px; font-weight: 700; cursor: pointer; }
@keyframes notice-in { from { opacity: 0; transform: scale(.98); } }
@keyframes lottery-waiting-ball { to { background-position: -220% 0; } }
@keyframes lottery-ball-reveal { 0% { opacity:0; transform:scale(.25) rotate(-360deg); } 65% { transform:scale(1.12) rotate(10deg); } 100% { opacity:1; transform:scale(1) rotate(0); } }

.native-lottery { width: 100%; border: .04rem solid #078cff; background: #fff; font-family: Arial, "Microsoft YaHei", sans-serif; }
.lottery-tabs { display: flex; align-items: stretch; height: .44rem; overflow-x: auto; border-bottom: 1px solid #ddd; background: #f7f7f7; scrollbar-width: none; }
.lottery-tabs::-webkit-scrollbar { display: none; }
.lottery-tab { flex: 1 0 auto; min-width: 20%; padding: 0 .1rem; border: 0; border-right: 1px solid #ddd; background: transparent; color: #222; font-size: .21rem; font-weight: 500; white-space: nowrap; cursor: pointer; }
.lottery-tab.active { background: #fff; color: #409eff; font-weight: 700; }
.lottery-panel { background: #fff; }
.lottery-panel[hidden] { display: none; }
.lottery-topline,.lottery-nextline { display: flex; align-items: center; justify-content: space-between; gap: .12rem; min-height: .56rem; padding: 0 .16rem; font-size: .21rem; }
.lottery-topline p,.lottery-nextline p { min-width: 0; margin: 0; white-space: nowrap; }
.lottery-topline a { flex: none; color: #fa2727; font-size: .19rem; }
.lottery-accent { color: #f5222d; }
.lottery-balls { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)) .26rem minmax(0, 1fr); gap: .035rem; min-height: 1rem; padding: .08rem .12rem; border-top: 1px solid #eee; border-bottom: 1px solid #eee; }
.lottery-ball-card { display: flex; min-width: 0; flex-direction: column; align-items: center; justify-content: center; gap: .02rem; padding: .06rem .01rem .04rem; border: 1px solid #ddd; border-radius: .09rem; background: #fff; }
.lottery-special-plus { display:grid; place-items:center; align-self:stretch; color:#aab1bc; font-size:.38rem; font-weight:300; line-height:1; user-select:none; }
.lottery-ball { display: grid; place-items: center; width: .58rem; height: .58rem; border: .03rem solid currentColor; border-radius: 50%; background: #fff; font-size: .27rem; font-style: normal; font-weight: 900; line-height: 1; }
.lottery-ball.red { color: #ef3333; }.lottery-ball.blue { color: #258bdf; }.lottery-ball.green { color: #22a65c; }
.lottery-ball-card em { color: #050505; font-size: .18rem; font-style: normal; font-weight: 800; line-height: 1; }
.lottery-balls.is-drawing .lottery-ball-card.is-pending { min-height: .91rem; overflow: hidden; background: linear-gradient(110deg,#f1f3f6 25%,#fff 42%,#f1f3f6 58%); background-size: 220% 100%; animation: lottery-waiting-ball 1.3s linear infinite; }
.lottery-balls.is-drawing .lottery-ball-card.is-pending > .lottery-ball,.lottery-balls.is-drawing .lottery-ball-card.is-pending > em { opacity: 0; transform: scale(.25) rotate(-360deg); }
.lottery-ball-placeholder { display:grid; place-items:center; width:.58rem; height:.58rem; border:.03rem dashed #aeb8c7; border-radius:50%; color:#8b96a7; font-size:.27rem; font-weight:900; line-height:1; opacity:1; transform:none; }
.lottery-ball-card.is-revealed { animation: lottery-ball-reveal .75s cubic-bezier(.18,.85,.24,1.25) both; }
@media (prefers-reduced-motion: reduce) { .lottery-balls.is-drawing .lottery-ball-card.is-pending { animation:none; }.lottery-ball-card.is-revealed { animation-duration:.01ms; } }
.lottery-waiting,.lottery-empty { grid-column: 1 / -1; display: grid; place-items: center; min-height: .84rem; margin: 0; color: #777; font-size: .2rem; }
.lottery-nextline { min-height: .5rem; background: #f5f5f5; font-size: .18rem; }
.lottery-nextline time { color: #444; }
.lottery-nextline [data-countdown] { margin-left: .06rem; color: #e52626; }
.lottery-nextline button { flex: none; width: .9rem; height: .34rem; border: 0; border-radius: .3rem; background: #f5222d; color: #fff; font-size: .18rem; font-weight: 700; cursor: pointer; }
.lottery-nextline button:disabled { opacity: .6; }

.history-wrap { min-height: 100vh; padding-bottom: .3rem; }
.history-nav { display: grid; grid-template-columns: repeat(4, 1fr); border: .04rem solid #078cff; border-bottom: 0; }
.history-nav a { display: grid; place-items: center; min-height: .5rem; border-right: 1px solid #ddd; background: #f7f7f7; color: #222; font-size: .2rem; }
.history-nav a:last-child { border-right: 0; }.history-nav a.active { background: #fff; color: #409eff; font-weight: 800; }
.history-heading { display: flex; align-items: center; justify-content: space-between; padding: .2rem .22rem; border: .04rem solid #078cff; border-top: 1px solid #ddd; background: #fff; }
.history-heading small { color: #f5222d; font-size: .15rem; }.history-heading h1 { margin: .03rem 0 0; font-size: .28rem; }.history-heading > a { padding: .08rem .16rem; border-radius: .3rem; background: #f5222d; color: #fff; font-size: .16rem; }
.history-list { display: grid; gap: .12rem; padding: .14rem; background: #eef5ff; }
.history-draw { overflow: hidden; border: 1px solid #c9dcf4; border-radius: .1rem; background: #fff; }
.history-draw-head { display: flex; justify-content: space-between; align-items: center; gap: .12rem; padding: .12rem .16rem; border-bottom: 1px solid #e7edf5; font-size: .18rem; }.history-draw-head span { color: #f5222d; }.history-draw-head time { color: #64748b; font-size: .15rem; }
.history-balls { border: 0; }.history-empty { margin: 0; padding: .5rem .2rem; background: #fff; color: #777; text-align: center; font-size: .18rem; }
.history-pages { display: flex; align-items: center; justify-content: center; gap: .15rem; padding: .2rem; font-size: .16rem; }.history-pages a { padding: .08rem .15rem; border-radius: .08rem; background: #078cff; color: #fff; }

@media (max-width: 850px) {
  html { font-size: 13.333333vw; }
  body { background: #fff; }
  .wrap { box-shadow: none; }
  .logo-dizhi { right: .18rem; bottom: .08rem; font-size: .26rem; }
  .notice-card { padding: 32px 20px 22px; }
  .notice-card h2 { font-size: 24px; }
  .notice-card p { font-size: 16px; }
  .native-lottery { border-width: 2px; }
  .lottery-tabs { height: .48rem; }
  .lottery-tab { padding: 0 .07rem; font-size: .23rem; }
  .lottery-topline,.lottery-nextline { padding-right: .1rem; padding-left: .1rem; }
  .lottery-balls { grid-template-columns:repeat(6,minmax(0,1fr)) .22rem minmax(0,1fr); gap:.025rem; padding-right:.06rem; padding-left:.06rem; }
  .lottery-special-plus { font-size:.34rem; }
  .lottery-ball { width: .58rem; height: .58rem; font-size: .27rem; }
  .history-nav,.history-heading { border-width: 2px; }
}

@media (max-width: 380px) {
  .lottery-tab { font-size: .21rem; }
  .lottery-topline { font-size: .19rem; }
  .lottery-topline a,.lottery-nextline { font-size: .17rem; }
  .lottery-ball { width: .54rem; height: .54rem; font-size: .25rem; }
}

/* 后台内置格式的统一标题：横幅、字体和颜色自动设置，标题文字可以直接修改。 */
.cms-template-title { display:flex; align-items:center; justify-content:center; gap:.05rem; width:100%; aspect-ratio:1280 / 98; height:auto; padding:0 2% 0 18%; overflow:hidden; background-image:url("/assets/template-title-banner.png"); background-position:center; background-repeat:no-repeat; background-size:100% 100%; color:#111; font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif; font-size:clamp(16px,.25rem,24px); font-weight:900; line-height:1.15; text-align:center; text-shadow:0 1px 1px #fff,0 0 4px #fff; white-space:nowrap; cursor:text; user-select:text; }
.cms-template-title .cms-title-brand { color:#111; }
.cms-template-title .cms-title-topic { color:#008b8b; }
.cms-template-title .cms-title-domain { color:#07963a; }

/* 后台可直接选择的资料板块格式。类名固定，保存后前台和可视化编辑器使用同一套样式。 */
.cms-free-content { border: 1px solid #d9d9d9; background: #fff; }
.cms-free-body { min-height: 1.6rem; padding: .28rem .32rem; font-size: .22rem; line-height: 1.8; }
.cms-free-body p { margin: 0 0 .14rem; }
.cms-free-body p:last-child { margin-bottom: 0; }

.cms-yellow-records { width: 100%; border-spacing: 0; border-collapse: collapse; table-layout: fixed; background: #fff; }
.cms-yellow-records td { min-height: .85rem; padding: .2rem .16rem; border: .025rem solid #f3c800; font-size: .22rem; font-weight: 700; line-height: 1.45; text-align: center; vertical-align: middle; }
.cms-yellow-records td:first-child { width: 75%; color: #ff21c8; }
.cms-yellow-records td:last-child { width: 25%; color: #ff21c8; }
.cms-yellow-records td strong { display: block; color: #ff21c8; }
.cms-yellow-records td b { color: #e40016; }

.cms-gray-records { margin: 0; padding: 0; list-style: none; background: #fff; }
.cms-gray-records > li { margin: 0; padding: 0; }
.cms-gray-issue { padding: .08rem .12rem; background: #cfcfcf; color: #e51e27; font-size: .27rem; line-height: 1.35; text-align: center; }
.cms-gray-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cms-gray-grid span { padding: .07rem .1rem; border-right: 1px solid #c7c7c7; border-bottom: 1px solid #c7c7c7; color: #151515; font-size: .25rem; line-height: 1.35; text-align: center; }
.cms-gray-grid span:nth-child(2n) { border-right: 0; }

.cms-simple-records { margin: 0; padding: 0; list-style: none; background: #fff; }
.cms-simple-records > li { min-height: .48rem; padding: .07rem .1rem; border-bottom: 1px solid #b8b8b8; color: #111; font-size: .24rem; font-weight: 800; line-height: 1.45; text-align: center; }
.cms-simple-records > li:first-child { border-top: 1px solid #b8b8b8; }
.cms-simple-records strong { color: #001cff; }

@media (max-width: 850px) {
  .cms-template-title { gap:.035rem; padding-right:1%; padding-left:19%; font-size:clamp(14px,.3rem,19px); }
  .cms-free-body { min-height: 1.8rem; padding: .24rem .2rem; font-size: .25rem; }
  .cms-yellow-records td { min-height: 1.25rem; padding: .18rem .08rem; font-size: .22rem; }
  .cms-yellow-records td:first-child { width: 74%; }
  .cms-yellow-records td:last-child { width: 26%; }
  .cms-gray-issue { font-size: .27rem; }
  .cms-gray-grid span { font-size: .25rem; }
  .cms-simple-records > li { font-size: .24rem; }
}