/* ===== 大发彩票 Site Kit 共享样式 ===== */
:root{
  --c-primary:#C62828;
  --c-gold:#F5C518;
  --c-bg-dark:#1A1A1D;
  --c-bg-card:#2D2D30;
  --c-text:#F5F5F7;
  --c-text-secondary:#C9C9CE;
  --c-accent-red:#E57373;
  --c-gold-grad-1:#D4A017;
  --c-gold-grad-2:#E6C84F;
  --c-deep-red:#8E1D1D;
  --font-head:"ZCOOL KuaiLe","STKaiti","Noto Serif SC","SimHei","Microsoft YaHei",serif;
  --font-body:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --font-num:"Roboto Mono","JetBrains Mono","SFMono-Regular",Consolas,"Liberation Mono",monospace;
  --header-h:64px;
  --nav-w:240px;
  --radius:2px;
  --shadow:0 10px 30px rgba(0,0,0,.4);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.65;
  color:var(--c-text);
  background-color:var(--c-bg-dark);
  background-image:
    radial-gradient(rgba(245,197,24,.07) 1px,transparent 1px),
    linear-gradient(rgba(198,40,40,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(198,40,40,.05) 1px,transparent 1px);
  background-size:24px 24px,120px 120px,120px 120px;
  padding-top:var(--header-h);
  -webkit-font-smoothing:antialiased;
}
main{display:block;}
ul,ol{list-style:none;}
img,svg{display:block;max-width:100%;}
a{color:var(--c-gold);text-decoration:none;transition:color .2s ease,background .2s ease,border-color .2s ease;}
a:hover{color:var(--c-gold-grad-2);}
button{font-family:var(--font-body);cursor:pointer;}
h1,h2,h3,h4,h5,h6{font-family:var(--font-head);font-weight:900;line-height:1.2;color:#fff;}
::selection{background:var(--c-gold);color:#1a1a1d;}
:focus-visible{outline:2px solid var(--c-gold);outline-offset:2px;background-color:rgba(198,40,40,.18);border-radius:var(--radius);}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ===== Header ===== */
.skip-link{position:fixed;top:8px;left:8px;z-index:2000;background:var(--c-gold);color:#1a1a1d;font-weight:800;padding:10px 18px;transform:translateY(-220%);transition:transform .2s ease;}
.skip-link:focus{transform:translateY(0);}

.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;height:var(--header-h);background:linear-gradient(180deg,#2a2a2e,#202024);border-bottom:1px solid rgba(245,197,24,.35);}
.header-inner{height:100%;max-width:1460px;margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:16px;}
@media (min-width:1101px){
  .header-inner{padding-right:calc(var(--nav-w) + 24px);}
}

.brand{display:flex;align-items:center;gap:12px;flex-shrink:0;color:var(--c-text);}
.brand:hover{color:var(--c-text);}
.brand-icon{position:relative;width:40px;height:40px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--c-gold),var(--c-gold-grad-1) 55%,var(--c-deep-red));box-shadow:0 0 0 2px rgba(245,197,24,.3),0 6px 16px rgba(198,40,40,.45);}
.brand-ball{position:absolute;inset:6px;border-radius:50%;background:radial-gradient(circle at 30% 28%,#fff,#f5c518 30%,#C62828 72%,#8E1D1D);}
.brand-spark{position:absolute;top:-3px;right:-3px;width:10px;height:10px;background:var(--c-gold);transform:rotate(45deg);animation:spark-pulse 2.8s ease-in-out infinite;}
@keyframes spark-pulse{
  0%,100%{transform:rotate(45deg) scale(1);opacity:.75;}
  50%{transform:rotate(45deg) scale(1.45);opacity:.25;}
}
.brand-text{display:flex;flex-direction:column;line-height:1.1;}
.brand-name{font-family:var(--font-head);font-weight:900;font-size:1.45rem;letter-spacing:.05em;color:#fff;white-space:nowrap;}
.brand-sub{display:inline-flex;width:max-content;font-size:.7rem;font-weight:700;letter-spacing:.28em;color:var(--c-gold);border:1px solid rgba(245,197,24,.45);padding:1px 8px;margin-top:3px;border-radius:2px;}

.header-query{margin-left:auto;display:inline-flex;align-items:center;gap:8px;padding:8px 16px;font-size:.9rem;font-weight:700;color:var(--c-gold);border:1px solid rgba(245,197,24,.45);background:rgba(198,40,40,.16);border-radius:var(--radius);}
.header-query:hover{background:rgba(198,40,40,.32);border-color:var(--c-gold);color:var(--c-gold-grad-2);}
.query-icon{font-size:1.1rem;line-height:1;}

.nav-toggle{display:none;margin-left:auto;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;background:rgba(198,40,40,.25);border:1px solid rgba(245,197,24,.4);border-radius:4px;padding:0;}
.nav-toggle-line{display:block;width:20px;height:2px;background:var(--c-gold);transition:transform .25s ease,opacity .25s ease;}
.nav-toggle.is-active .nav-toggle-line:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.is-active .nav-toggle-line:nth-child(2){opacity:0;}
.nav-toggle.is-active .nav-toggle-line:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.site-nav{position:fixed;top:0;right:0;bottom:0;width:var(--nav-w);z-index:1100;display:flex;flex-direction:column;padding:calc(var(--header-h) + 28px) 0 28px;background:linear-gradient(180deg,var(--c-bg-card),#26262a);border-left:1px solid rgba(245,197,24,.45);box-shadow:var(--shadow);transform:translateX(105%);visibility:hidden;transition:transform .3s ease,visibility .3s;}
.site-nav[data-open]{transform:translateX(0);visibility:visible;}
.nav-track-head{display:flex;align-items:center;gap:10px;padding:0 24px;margin-bottom:22px;}
.nav-track-pulse{width:8px;height:8px;border-radius:50%;background:var(--c-gold);box-shadow:0 0 8px rgba(245,197,24,.8);animation:nav-pulse 1.8s ease-in-out infinite;}
@keyframes nav-pulse{
  0%,100%{opacity:.35;transform:scale(.85);}
  50%{opacity:1;transform:scale(1.25);}
}
.nav-track-title{font-size:.74rem;font-weight:700;letter-spacing:.28em;color:var(--c-text-secondary);}
.nav-list{display:flex;flex-direction:column;gap:6px;padding:0 14px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--c-gold) transparent;}
.nav-list a{position:relative;display:flex;align-items:center;gap:12px;padding:12px 14px;color:var(--c-text);font-weight:700;font-size:.95rem;border-left:3px solid transparent;transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease;}
.nav-list a:hover{background:var(--c-primary);border-left-color:var(--c-gold);color:#fff;transform:translateX(3px);}
.nav-list a[aria-current="page"]{background:linear-gradient(90deg,rgba(198,40,40,.85),rgba(198,40,40,.28));border-left-color:var(--c-gold);color:#fff;}
.nav-dot{width:6px;height:6px;flex:none;transform:rotate(45deg);background:var(--c-gold-grad-2);opacity:.45;transition:opacity .2s ease,background .2s ease;}
.nav-list a:hover .nav-dot,.nav-list a[aria-current="page"] .nav-dot{opacity:1;background:var(--c-gold);}

.site-header-progress{position:absolute;left:0;bottom:0;height:3px;width:100%;background:linear-gradient(90deg,var(--c-deep-red),var(--c-primary) 30%,var(--c-gold) 85%);transform:scaleX(0);transform-origin:0 50%;}

@media (max-width:1100px){
  .header-inner{padding:0 16px;}
  .nav-toggle{display:flex;}
  .header-query{display:none;}
  .site-nav{width:min(320px,88vw);padding-top:calc(var(--header-h) + 16px);}
}
@media (min-width:1101px){
  body{padding-right:var(--nav-w);}
  .site-nav{transform:none;visibility:visible;transition:none;}
}

/* ===== Footer ===== */
.site-footer{background:linear-gradient(180deg,var(--c-deep-red),#4a0b0b);margin-top:80px;border-top:4px solid var(--c-gold);}
.footer-inner{max-width:1200px;margin:0 auto;padding:48px 24px 36px;display:grid;grid-template-columns:1.6fr 1fr 1fr 1.8fr;gap:36px;}
.footer-brand .brand{margin-bottom:16px;}
.footer-claim{font-family:var(--font-head);font-size:1.1rem;color:var(--c-gold-grad-2);margin-bottom:10px;}
.footer-note{font-size:.85rem;color:var(--c-text-secondary);max-width:340px;}
.footer-head{font-family:var(--font-head);font-size:.95rem;color:var(--c-gold);letter-spacing:.12em;margin-bottom:16px;padding-bottom:6px;border-bottom:1px solid rgba(245,197,24,.3);}
.footer-list{display:flex;flex-direction:column;gap:10px;font-size:.92rem;}
.footer-list a{color:var(--c-text);transition:color .2s ease,padding-left .2s ease;}
.footer-list a:hover{color:var(--c-gold);padding-left:4px;}
.footer-contact{background:rgba(255,255,255,.04);border:1px solid rgba(245,197,24,.22);padding:16px;}
.footer-contact-list{color:var(--c-text-secondary);}
.contact-label{display:block;font-size:.72rem;letter-spacing:.1em;color:var(--c-gold-grad-2);font-weight:700;margin-bottom:2px;}
.footer-bottom{max-width:1200px;margin:0 auto;padding:16px 24px;border-top:1px solid rgba(245,197,24,.25);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 20px;font-size:.82rem;color:var(--c-text-secondary);}
.footer-bottom a{color:var(--c-text-secondary);text-decoration:underline;}
.footer-bottom a:hover{color:var(--c-gold);}

/* ===== 通用页面组件 ===== */
.container{width:100%;max-width:1200px;margin-inline:auto;padding-inline:24px;}
.section-block{padding:48px 0;}
.page-header{padding:32px 0 20px;display:flex;flex-direction:column;gap:12px;}
.page-title{font-family:var(--font-head);font-size:clamp(2rem,5vw,3.2rem);line-height:1.15;color:#fff;font-weight:900;}
.page-lead{color:var(--c-text-secondary);max-width:680px;font-size:1rem;}
.section-label{display:inline-flex;align-items:center;gap:8px;color:var(--c-gold);font-weight:800;font-size:.8rem;letter-spacing:.18em;margin-bottom:14px;padding-bottom:4px;border-bottom:2px solid var(--c-gold);}
.breadcrumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:18px 0 0;font-size:.85rem;color:var(--c-text-secondary);}
.breadcrumbs a{color:var(--c-gold);}
.breadcrumbs a:hover{color:var(--c-gold-grad-2);}
.crumb-sep{color:var(--c-text-secondary);}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;font-family:var(--font-body);font-size:.95rem;font-weight:800;border:2px solid transparent;border-radius:var(--radius);text-align:center;transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease;}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--c-primary);border-color:var(--c-primary);color:#fff;}
.btn-primary:hover{background:var(--c-deep-red);border-color:var(--c-accent-red);color:#fff;}
.btn-gold{background:var(--c-gold);border-color:var(--c-gold);color:#1a1a1d;}
.btn-gold:hover{background:var(--c-gold-grad-2);border-color:var(--c-gold-grad-2);color:#1a1a1d;}
.btn-outline{background:transparent;border-color:var(--c-gold);color:var(--c-gold);}
.btn-outline:hover{background:var(--c-primary);border-color:var(--c-primary);color:#fff;}

.card{background:var(--c-bg-card);border:1px solid rgba(245,197,24,.25);padding:24px;border-radius:var(--radius);}
.card-title{font-family:var(--font-head);font-size:1.25rem;font-weight:900;color:#fff;margin-bottom:8px;}
.card-text{color:var(--c-text-secondary);font-size:.9rem;margin-bottom:14px;}
.bento-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1px;background:rgba(245,197,24,.28);border:1px solid rgba(245,197,24,.2);box-shadow:var(--shadow);}
.bento-card{grid-column:span 4;background:var(--c-bg-card);padding:24px;min-height:160px;display:flex;flex-direction:column;gap:8px;}
.tag-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;font-size:.74rem;font-weight:800;letter-spacing:.06em;color:var(--c-gold);background:rgba(198,40,40,.18);border:1px solid rgba(245,197,24,.5);border-radius:2px;}
.tag-chip--red{background:var(--c-primary);color:#fff;border-color:var(--c-primary);}
.tag-chip--gold{background:var(--c-gold);color:#1a1a1d;border-color:var(--c-gold);}
.tag-chip--dark{background:var(--c-bg-card);color:var(--c-text-secondary);border-color:#444;}
.grid-cols-2{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.grid-cols-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}

.media-frame{position:relative;display:block;overflow:hidden;min-height:180px;border:1px solid rgba(245,197,24,.3);background-color:var(--c-bg-card);}
.media-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 60%,rgba(245,197,24,.12));pointer-events:none;}
.media-frame[data-media-type="number-flow"]{background:
  radial-gradient(circle at 15% 30%,rgba(245,197,24,.6) 0 2px,transparent 3px),
  radial-gradient(circle at 80% 18%,rgba(229,115,115,.5) 0 2px,transparent 3px),
  radial-gradient(circle at 65% 72%,rgba(212,160,23,.5) 0 4px,transparent 6px),
  radial-gradient(circle at 30% 85%,rgba(245,197,24,.35) 0 3px,transparent 5px),
  radial-gradient(circle at 90% 60%,rgba(198,40,40,.55) 0 14px,transparent 16px),
  linear-gradient(135deg,var(--c-bg-card),var(--c-deep-red));
  background-size:200px 200px,260px 260px,240px 240px,280px 280px,300px 300px,100% 100%;}
.media-frame[data-media-type="ball"]{background:
  radial-gradient(circle at 35% 32%,#fff 0 8px,#F5C518 9px 22px,#C62828 23px 55px,var(--c-deep-red) 56px 60px,transparent 61px),
  linear-gradient(135deg,var(--c-bg-card),var(--c-deep-red));}
.media-frame[data-media-type="grid"]{background:
  linear-gradient(rgba(245,197,24,.22) 1px,transparent 1px),
  linear-gradient(90deg,rgba(245,197,24,.22) 1px,transparent 1px),
  linear-gradient(135deg,var(--c-bg-card),#28282c);
  background-size:26px 26px,26px 26px,100% 100%;}
.media-frame[data-media-type="chart"]{background:
  linear-gradient(rgba(245,197,24,.18) 1px,transparent 1px),
  linear-gradient(90deg,rgba(245,197,24,.18) 1px,transparent 1px),
  radial-gradient(circle at 70% 40%,rgba(212,160,23,.35),transparent 45%),
  var(--c-bg-card);
  background-size:32px 32px,32px 32px,100% 100%,100% 100%;}
.media-frame[data-media-type="float-card"]{background:var(--c-bg-card);}

/* ===== 响应式 ===== */
@media (max-width:900px){
  .footer-inner{grid-template-columns:1fr 1fr;}
  .grid-cols-3{grid-template-columns:1fr 1fr;}
  .bento-card{grid-column:span 6;}
}
@media (max-width:600px){
  :root{--header-h:56px;}
  .footer-inner{grid-template-columns:1fr;gap:28px;}
  .footer-note{max-width:none;}
  .grid-cols-2,.grid-cols-3{grid-template-columns:1fr;}
  .bento-card{grid-column:span 12;}
  .section-block{padding:32px 0;}
  .page-header{padding:24px 0 16px;}
  .brand-name{font-size:1.2rem;}
  .brand-sub{font-size:.6rem;letter-spacing:.18em;}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation:none !important;
    transition:none !important;
    scroll-behavior:auto !important;
  }
}
