/* entertainment.css */

:root{
  --gold-1:#B89F7D;
  --gold-2:#9C8568;
  --gold-3:#7A6851;

  --text:#1F1F1F;
  --bg:#F6F6F6;

  --blue:#5A8B9E;
  --green:#6D8C7D;
  --red:#B87A7A;
  --purple:#8A7A8E;
  --orange:#B88A5A;

  --font-head:'Orbitron', sans-serif;
  --font-sub:'Exo 2', sans-serif;
  --font-body:'Noto Sans SC', sans-serif;

  --transition:all .25s ease;
}

*{margin:0;padding:0;box-sizing:border-box;}
html,body{height:100%;overflow-x:hidden;}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  line-height:1.6;
  position:relative;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

body::before{
  content:'';
  position:fixed;inset:0;
  background:
    radial-gradient(1100px 760px at 18% 80%, rgba(184,159,125,.16) 0%, transparent 62%),
    radial-gradient(900px 700px at 82% 24%, rgba(90,139,158,.12) 0%, transparent 62%),
    radial-gradient(880px 680px at 52% 30%, rgba(138,122,142,.10) 0%, transparent 64%),
    linear-gradient(180deg, #FFFFFF 0%, #F6F6F6 55%, #FFFFFF 100%);
  pointer-events:none;
  z-index:-3;
}
body::after{
  content:'';
  position:fixed;inset:0;
  background-image:
    linear-gradient(rgba(184,159,125,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(184,159,125,.04) 1px, transparent 1px);
  background-size:64px 64px;
  pointer-events:none;
  z-index:-2;
  opacity:.22;
}

.container{width:100%;max-width:1100px;margin:0 auto;padding:0 22px;}

.top-nav{
  position:fixed;
  top:0; left:0; right:0;
  padding:12px 22px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  z-index:1000;
  background:rgba(255,255,255,.85);
  backdrop-filter:blur(10px);
  box-shadow:0 2px 20px rgba(18,18,18,.05);
}

.back-btn,.auth-icon{
  width:40px;height:40px;
  border-radius:12px;
  border:none;
  background:rgba(255,255,255,.9);
  color:var(--gold-3);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.2rem;
  box-shadow:0 4px 12px rgba(18,18,18,.08);
  transition:var(--transition);
}
.back-btn:hover,.auth-icon:hover{
  transform:translateY(-2px);
  background:white;
  box-shadow:0 8px 20px rgba(18,18,18,.12);
}

.top-header{
  padding: 5rem 0 1.5rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}

.brand{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.55rem;
  margin-bottom:1.05rem;
}
.cyber-db-logo{
  position:relative;
  width:66px;height:66px;
  display:flex;align-items:center;justify-content:center;
}
.db-container{
  position:relative;
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
}
.db-letter{
  font-family:var(--font-head);
  font-weight:800;
  font-size:2.05rem;
  background: linear-gradient(to bottom, var(--gold-1), var(--gold-3));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  position:relative;
  z-index:2;
  text-shadow:0 0 8px rgba(184,159,125,.55);
  animation: dbGlow 3s infinite alternate;
  user-select:none;
}
@keyframes dbGlow{
  0%{text-shadow:0 0 8px rgba(184,159,125,.50);}
  100%{text-shadow:0 0 15px rgba(184,159,125,.70), 0 0 25px rgba(184,159,125,.25);}
}
.db-ring{
  position:absolute;
  width:100%;height:100%;
  border:2px solid rgba(184,159,125,.72);
  border-radius:50%;
  box-shadow:0 0 10px rgba(184,159,125,.35);
  animation: rotate 20s linear infinite;
}
@keyframes rotate{
  0%{transform:rotate(0deg);}
  100%{transform:rotate(360deg);}
}

.site-title{
  font-family:var(--font-head);
  font-size:2.05rem;
  font-weight:900;
  letter-spacing:1.1px;
  background:linear-gradient(90deg, var(--gold-1), var(--gold-2), var(--gold-3));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 2px 14px rgba(18,18,18,.06);
  line-height:1.1;
}

.time-display{
  text-align:center;
  margin-top:.35rem;
  font-family:var(--font-sub);
  font-size:1.0rem;
  color:rgba(31,31,31,.78);
  letter-spacing:.8px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:6px;
  font-weight:900;
}

main{flex:1;padding: 0 0 2rem;}

.lottery-cards{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
  gap:1.5rem;
  margin-bottom:2rem;
}

.lottery-card{
  background: rgba(255,255,255,.92);
  border-radius:18px;
  padding:1.5rem;
  box-shadow:0 12px 30px rgba(18,18,18,.08);
  border:1px solid rgba(31,31,31,.05);
  transition:var(--transition);
  display:flex;
  flex-direction:column;
}
.lottery-card:hover{
  transform:translateY(-5px);
  box-shadow:0 18px 40px rgba(18,18,18,.12);
}

.card-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:1rem;
}

.card-title{
  font-family:var(--font-head);
  font-weight:800;
  font-size:1.3rem;
  display:flex;
  align-items:center;
  gap:.5rem;
}

.ssq-title{color:var(--red);}
.kl8-title{color:var(--green);}
.dlt-title{color:var(--gold-3);}
.qlc-title{color:var(--purple);}
.fc3d-title{color:var(--orange);}
.qxc-title{color:var(--blue);}
.pl5-title{color:var(--red);}
.pl3-title{color:var(--orange);}
.check-title{color:var(--purple);}

.screenshot-btn{
  border:none;
  cursor:pointer;
  padding:.45rem .75rem;
  border-radius:999px;
  background: rgba(0,0,0,.04);
  color: rgba(31,31,31,.78);
  font-weight:900;
  font-family: var(--font-sub);
  transition: var(--transition);
  white-space:nowrap;
  display:flex;
  align-items:center;
  gap:.4rem;
}
.screenshot-btn:hover{ background: rgba(0,0,0,.08); color: rgba(31,31,31,.92); }
.screenshot-btn:disabled{ opacity:.5; cursor:not-allowed; }

.numbers-display{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
  margin:1.5rem 0 .55rem;
  min-height:60px;
}
.empty-numbers{
  color:rgba(31,31,31,.3);
  font-weight:900;
  font-style:italic;
  text-align:center;
  width:100%;
  padding:1rem;
}

.lottery-ball{
  width:46px;height:46px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  color:white;
  font-size:1.2rem;
  box-shadow:0 10px 18px rgba(18,18,18,.16);
  opacity:0;
  transform:scale(0);
  transition:all .45s ease;
}
.lottery-ball.show{
  opacity:1;
  transform:scale(1);
  animation: popBounce .38s ease-out;
}
@keyframes popBounce {
  0% { transform: scale(.2); opacity: 0; }
  60% { transform: scale(1.12); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}

.red-ball{ background: linear-gradient(145deg, var(--red), #A96B6B); }
.blue-ball{ background: linear-gradient(145deg, var(--blue), #4E7F93); }
.green-ball{ background: linear-gradient(145deg, var(--green), #5A7B6B); }
.gold-ball{ background: linear-gradient(145deg, var(--gold-2), var(--gold-3)); }
.purple-ball{ background: linear-gradient(145deg, var(--purple), #7A688A); }
.orange-ball{ background: linear-gradient(145deg, var(--orange), #A67A4A); }

.hint-line{
  padding: 0 .2rem;
  margin-bottom: 12px;
  min-height: 1.6rem;
  line-height: 1.6rem;
  text-align:center;
  color: rgba(31,31,31,.55);
  font-weight:900;
  font-size:.95rem;
  font-family: var(--font-sub);
  word-break: break-word;
}

/* 按钮上方：最新开奖号（小号展示） */
.latest-result{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 4px 8px;
  margin-bottom: 8px;
  background: rgba(31,31,31,.04);
  border-radius: 8px;
  font-size: .72rem;
  color: rgba(31,31,31,.55);
  min-height: 0;
  flex-wrap: wrap;
}
.latest-result .lr-ball{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  font-size: .65rem;
  font-weight: 700;
  color: #fff;
  line-height: 1;
  flex-shrink: 0;
}
.latest-result .lr-red{ background: radial-gradient(circle at 35% 35%, #e84c4c, #b83232); }
.latest-result .lr-blue{ background: radial-gradient(circle at 35% 35%, #4c7ee8, #2d5bb8); }
.latest-result .lr-sep{ color: rgba(31,31,31,.35); font-size: .6rem; margin: 0 1px; }
.latest-result .lr-label{ font-size: .68rem; color: rgba(31,31,31,.4); margin-right: 4px; white-space: nowrap; }

.generate-btn{
  width:100%;
  border:none;
  cursor:pointer;
  padding:1rem;
  border-radius:14px;
  font-weight:900;
  font-size:1.1rem;
  color:#fff;
  box-shadow:0 10px 22px rgba(18,18,18,.10);
  transition: var(--transition);
  font-family:var(--font-sub);
  position:relative;
  overflow:hidden;
  margin-top:auto;
}
.generate-btn:disabled{ opacity:.7; cursor:not-allowed; }
.generate-btn::after{
  content:'';
  position:absolute;
  top:0; left:-100%;
  width:100%; height:100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.3), transparent);
  transition:left .7s;
}
.generate-btn:active::after{ left:100%; }
.generate-btn:hover:not(:disabled){
  transform: translateY(-2px);
  box-shadow:0 14px 28px rgba(18,18,18,.15);
}

.ssq-btn{ background:linear-gradient(45deg, var(--red), #CFA0A0); }
.kl8-btn{ background:linear-gradient(45deg, var(--green), #A5BFB0); }
.dlt-btn{ background:linear-gradient(45deg, var(--gold-2), var(--gold-3)); }
.qlc-btn{ background:linear-gradient(45deg, var(--purple), #A89AB2); }
.fc3d-btn{ background:linear-gradient(45deg, var(--orange), #D4B089); }
.qxc-btn{ background:linear-gradient(45deg, var(--blue), #8BB1C3); }
.pl5-btn{ background:linear-gradient(45deg, var(--red), #CFA0A0); }
.pl3-btn{ background:linear-gradient(45deg, var(--orange), #D4B089); }

.kl8-selector{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-bottom:.55rem;
  flex-wrap:wrap;
}
.kl8-selector label{ font-weight:900; color:rgba(31,31,31,.7); }
.kl8-selector select{
  padding:.4rem .8rem;
  border-radius:10px;
  border:1px solid rgba(31,31,31,.1);
  background:rgba(255,255,255,.9);
  font-weight:900;
  color:rgba(31,31,31,.8);
  outline:none;
}

/* 查开奖号码按钮居中 */
.check-links{
  display:flex;
  gap:12px;
  margin-top:.25rem;
}
.check-links.check-center{
  justify-content:center;
  align-items:center;
  padding: .75rem 0 .25rem;
}
.check-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  text-decoration:none;
  padding:.85rem 1.25rem;
  border-radius:14px;
  font-weight:900;
  font-family:var(--font-sub);
  color:#fff;
  box-shadow:0 8px 20px rgba(18,18,18,.10);
  transition:var(--transition);
  min-width:120px;
}
.check-link:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 24px rgba(18,18,18,.15);
}
.check-link.fc{ background:linear-gradient(135deg, #E74C3C, #C0392B); }
.check-link.tc{ background:linear-gradient(135deg, #3498DB, #2980B9); }

/* 游戏区 */
.games-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));
  gap:1.5rem;
  margin-bottom:2rem;
}

.game-card{
  background: rgba(255,255,255,.92);
  border-radius:18px;
  padding:1.5rem;
  box-shadow:0 12px 30px rgba(18,18,18,.08);
  border:1px solid rgba(31,31,31,.05);
  display:flex;
  flex-direction:column;
  transition:var(--transition);
}
.game-card:hover{
  transform:translateY(-5px);
  box-shadow:0 18px 40px rgba(18,18,18,.12);
}
.game-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:1rem;
  gap:.6rem;
}
.game-title{
  font-family:var(--font-head);
  font-weight:800;
  font-size:1.3rem;
  display:flex;
  align-items:center;
  gap:.5rem;
}

.muyu-title{color:#8B7355;}
.dice-title{color:var(--blue);}
.wheel-title{color:var(--gold-3);}
.slot-title{color:var(--red);}
.box-title{color:var(--purple);}
.help-title{color:var(--green);}

.game-body{
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:1rem 0;
}

/* 木鱼声音开关（放在模块上右上角） */
.sound-toggle{
  width:38px;height:38px;
  border-radius:12px;
  border:none;
  cursor:pointer;
  background: rgba(0,0,0,.04);
  color: rgba(31,31,31,.78);
  box-shadow:0 8px 18px rgba(18,18,18,.08);
  transition: var(--transition);
  display:flex;
  align-items:center;
  justify-content:center;
}
.sound-toggle:hover{
  transform: translateY(-2px);
  background: rgba(0,0,0,.07);
  color: rgba(31,31,31,.92);
}
.sound-toggle.is-off{
  color: rgba(184,122,122,.95);
  background: rgba(184,122,122,.10);
}

/* 电子木鱼 */
.muyu-container{
  position:relative;
  width:160px;
  height:160px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  margin:.5rem 0;
}
.muyu-stand{
  width:100px;height:20px;
  background:linear-gradient(to right, #8B7355, #A67C52);
  border-radius:10px;
  position:relative;
  z-index:2;
  box-shadow:0 5px 15px rgba(0,0,0,.2);
}
.muyu-body{
  width:130px;height:100px;
  background:radial-gradient(ellipse at center, #D4A76A, #8B4513);
  border-radius:50% 50% 40% 40%;
  position:relative;
  top:-5px;
  z-index:1;
  box-shadow:0 10px 25px rgba(0,0,0,.25);
  cursor:pointer;
  transition:transform .1s ease;
  display:flex;
  align-items:center;
  justify-content:center;
}
.muyu-body:active{ transform:scale(0.97); }
.muyu-body.tapped{ animation: muyuTap .3s ease; }
@keyframes muyuTap {
  0% { transform: scale(1); }
  50% { transform: scale(0.95); }
  100% { transform: scale(1); }
}
.muyu-strike{
  position:absolute;
  width:10px;height:40px;
  background:linear-gradient(to bottom, #B8860B, #8B6508);
  border-radius:5px;
  top:-20px; left:50%;
  transform:translateX(-50%) rotate(0deg);
  transition:transform .3s ease;
  z-index:3;
}
.muyu-strike.swing{ animation: strikeSwing .5s ease; }
@keyframes strikeSwing {
  0% { transform:translateX(-50%) rotate(0deg); }
  50% { transform:translateX(-50%) rotate(45deg); }
  100% { transform:translateX(-50%) rotate(0deg); }
}
.muyu-knob{
  position:absolute;
  width:18px;height:18px;
  background:radial-gradient(circle at 30% 30%, #FFD700, #B8860B);
  border-radius:50%;
  top:10px; left:50%;
  transform:translateX(-50%);
  box-shadow:0 0 10px rgba(255,215,0,.5);
}
.muyu-text{
  font-family:var(--font-head);
  font-weight:900;
  font-size:1.8rem;
  color:#FFF8DC;
  text-shadow:1px 1px 3px rgba(0,0,0,.7);
  letter-spacing:1px;
}
.merit-count{
  font-family:var(--font-head);
  font-weight:900;
  font-size:2.2rem;
  color:var(--gold-3);
  text-shadow:0 2px 8px rgba(184,159,125,.3);
  margin:.5rem 0;
}
.merit-sub{
  font-family:var(--font-sub);
  font-weight:900;
  color:rgba(31,31,31,.65);
  font-size:.9rem;
  margin-top:.3rem;
}
.merit-rate{
  font-family:var(--font-sub);
  font-weight:900;
  color:rgba(31,31,31,.5);
  font-size:.85rem;
  margin-top:.2rem;
}

/* 色子 */
.dice-row{ display:flex; align-items:center; justify-content:center; gap:12px; margin:.75rem 0 .55rem; }
.die{
  width:52px;height:52px;
  border-radius:14px;
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(31,31,31,.10);
  box-shadow: 0 10px 22px rgba(18,18,18,.08);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family: var(--font-head);
  font-weight:900;
  font-size:1.5rem;
  color: rgba(31,31,31,.82);
  user-select:none;
  transition:all .3s ease;
}
.die.rolling{ animation: diceRoll .8s ease-in-out infinite; }
@keyframes diceRoll {
  0% { transform: rotate(0deg) scale(1); }
  25% { transform: rotate(90deg) scale(1.1); }
  50% { transform: rotate(180deg) scale(1); }
  75% { transform: rotate(270deg) scale(1.1); }
  100% { transform: rotate(360deg) scale(1); }
}
.dice-result{
  margin:.65rem 0 .85rem;
  text-align:center;
  font-family: var(--font-head);
  font-weight:900;
  font-size:1.65rem;
  letter-spacing:.6px;
  color: rgba(31,31,31,.88);
  height:2.2rem;
}
.dice-sub{
  text-align:center;
  color: rgba(31,31,31,.65);
  font-weight:900;
  font-size:.98rem;
  margin-bottom:1rem;
  height:1.5rem;
}

/* 转盘 - 10种颜色 */
.wheel-area{ position:relative; width:200px;height:200px; margin:0 auto; }
.wheel{
  width:200px;height:200px;
  border-radius:50%;
  border: 1px solid rgba(31,31,31,.10);
  box-shadow:0 18px 40px rgba(18,18,18,.10);
  overflow:hidden;
  background: conic-gradient(
    from 0deg,
    #FF6B6B 0deg 36deg,   /* 珊瑚红 */
    #4ECDC4 36deg 72deg,  /* 青绿 */
    #45B7D1 72deg 108deg, /* 天蓝 */
    #96CEB4 108deg 144deg, /* 薄荷绿 */
    #FFEAA7 144deg 180deg,/* 柠檬黄 */
    #DDA0DD 180deg 216deg,/* 梅红 */
    #98D8C8 216deg 252deg,/* 翡翠绿 */
    #F7DC6F 252deg 288deg,/* 金黄 */
    #BB8FCE 288deg 324deg,/* 紫罗兰 */
    #85C1E9 324deg 360deg /* 浅蓝 */
  );
  transition: transform 0.1s linear;
  display:flex;
  align-items:center;
  justify-content:center;
  position: relative;
}
.wheel-indicator{
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 16px solid #ff4757;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.2));
  z-index: 10;
}
.wheel-center{
  position:absolute;
  width:60px;height:60px;
  border-radius:50%;
  background: rgba(255,255,255,.95);
  border: 1px solid rgba(31,31,31,.08);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family: var(--font-sub);
  font-weight:900;
  color: rgba(31,31,31,.60);
  z-index:5;
  box-shadow:0 4px 12px rgba(0,0,0,.1);
}
.wheel-result{
  margin:.65rem 0 .85rem;
  text-align:center;
  font-family: var(--font-head);
  font-weight:900;
  font-size:1.65rem;
  letter-spacing:.6px;
  color: rgba(31,31,31,.88);
  height:2.2rem;
}

/* 老虎机 */
.slot-frame{
  margin:.75rem 0 .55rem;
  border-radius:18px;
  background: rgba(255,255,255,.9);
  border: 1px solid rgba(31,31,31,.10);
  box-shadow: 0 12px 28px rgba(18,18,18,.09);
  padding: 14px 12px;
  position:relative;
  overflow:hidden;
}
.slot-row{ display:flex; align-items:center; justify-content:center; gap:12px; position:relative; z-index:1; }
.reel-window{
  width:70px;height:74px;
  border-radius:16px;
  border: 1px solid rgba(31,31,31,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.76));
  box-shadow: inset 0 10px 18px rgba(18,18,18,.06);
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
}
.reel-window::after{
  content:'';
  position:absolute;
  left:10px; right:10px;
  top:50%;
  transform: translateY(-50%);
  height:3px;
  background: rgba(184,159,125,.45);
  border-radius:999px;
  pointer-events:none;
  z-index:2;
}
.slot-digit{
  font-family: var(--font-head);
  font-weight:900;
  font-size:2.8rem;
  color: rgba(31,31,31,.85);
  letter-spacing:.5px;
  user-select:none;
  text-shadow: 0 2px 4px rgba(0,0,0,.1);
  height:74px;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.slot-digit.show{ opacity: 1; }

.slot-hint{
  text-align:center;
  color: rgba(31,31,31,.62);
  font-weight:900;
  font-size:.98rem;
  margin-top:.35rem;
  margin-bottom:1rem;
  height:1.5rem;
}
.slot-win .slot-frame{
  border-color: rgba(184,159,125,.85);
  box-shadow: 0 0 0 3px rgba(184,159,125,.18), 0 18px 44px rgba(18,18,18,.12);
  animation: slotWinGlow 1s ease-in-out 3;
}
@keyframes slotWinGlow {
  0%, 100% { box-shadow: 0 0 0 3px rgba(184,159,125,.18), 0 18px 44px rgba(18,18,18,.12); }
  50% { box-shadow: 0 0 0 6px rgba(184,159,125,.35), 0 18px 44px rgba(18,18,18,.15); }
}

/* 通用按钮 */
.game-btn{
  width:100%;
  border:none;
  cursor:pointer;
  padding:.9rem 1rem;
  border-radius:14px;
  font-weight:900;
  font-size:1.05rem;
  color:#fff;
  background: linear-gradient(135deg, var(--gold-2), var(--gold-3));
  box-shadow:0 10px 22px rgba(18,18,18,.10);
  transition: var(--transition);
  font-family:var(--font-sub);
  position:relative;
  overflow:hidden;
}
.game-btn:disabled{ opacity:.7; cursor:not-allowed; }
.game-btn::after{
  content:'';
  position:absolute;
  top:0; left:-100%;
  width:100%; height:100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.3), transparent);
  transition:left .7s;
}
.game-btn:active::after{ left:100%; }
.game-btn:hover:not(:disabled){
  transform: translateY(-2px);
  box-shadow:0 14px 28px rgba(18,18,18,.15);
}

/* 盲盒 */
.card-stage{ width: 220px; height: 140px; display:flex; align-items:center; justify-content:center; margin: .25rem 0 .6rem; }
.poker-card{
  width: 180px;height: 120px;
  border-radius: 18px;
  border: 1px solid rgba(31,31,31,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,255,255,.86));
  box-shadow: 0 18px 40px rgba(18,18,18,.10);
  position: relative;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  transform: scale(.92);
  opacity: 0;
}
.poker-card.show{
  opacity: 1;
  transform: scale(1);
  animation: popBounce .42s ease-out;
}
.poker-center{
  font-family: var(--font-head);
  font-weight: 900;
  font-size: 2.6rem;
  letter-spacing: .5px;
  color: rgba(31,31,31,.88);
  display:flex;
  align-items:center;
  gap:10px;
}
.poker-corner{
  position:absolute;
  font-family: var(--font-sub);
  font-weight: 900;
  color: rgba(31,31,31,.75);
  font-size: 1rem;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  line-height: 1.1;
}
.poker-corner.tr{ top:12px; right:12px; align-items:flex-end; }
.poker-corner.bl{ bottom:12px; left:12px; }
.poker-suit{ font-size: 1.15rem; margin-top: 2px; opacity:.92; }
.poker-red .poker-center,.poker-red .poker-corner{ color: rgba(184,122,122,.95); }
.poker-black .poker-center,.poker-black .poker-corner{ color: rgba(31,31,31,.88); }

.blindbox-hint{
  text-align:center;
  color: rgba(31,31,31,.62);
  font-weight:900;
  font-size:.98rem;
  margin-top:.25rem;
  margin-bottom:1rem;
  height:1.5rem;
  font-family: var(--font-sub);
}

/* 捐助支持模块：LOGO 静态 */
.donate-card-center{
  width: 220px;
  height: 140px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.donate-logo{
  position:relative;
  width:76px;height:76px;
  display:flex;
  align-items:center;
  justify-content:center;
  filter: drop-shadow(0 10px 18px rgba(18,18,18,.10));
}
.donate-logo-ring{
  position:absolute;
  width:100%;height:100%;
  border-radius:50%;
  border:2px solid rgba(184,159,125,.72);
  box-shadow:0 0 10px rgba(184,159,125,.35);
  animation: rotate 18s linear infinite;
}
.donate-logo-core{
  width: 60px;height: 60px;
  border-radius: 18px;
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(31,31,31,.08);
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow: inset 0 10px 18px rgba(18,18,18,.05);
}
.donate-logo-text{
  font-family: var(--font-head);
  font-weight: 900;
  font-size: 1.55rem;
  background: linear-gradient(90deg, var(--gold-1), var(--gold-2), var(--gold-3));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:0 0 12px rgba(184,159,125,.25);
}

/* ===========================
   开奖结果面板
=========================== */
.check-item-expand{ cursor: pointer; }
.check-item-expand:hover{ background: rgba(31,31,31,.04); }

/* 最新开奖：小号紧凑展示（显示在模块行内） */
.latest-draw {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 8px;
  font-size: .72rem;
  color: rgba(31,31,31,.6);
  vertical-align: middle;
}
.latest-draw .ld-ball {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  font-size: .68rem;
  font-weight: 700;
  color: #fff;
  line-height: 1;
  flex-shrink: 0;
}
.latest-draw .ld-red { background: radial-gradient(circle at 35% 35%, #e84c4c, #b83232); }
.latest-draw .ld-blue { background: radial-gradient(circle at 35% 35%, #4c7ee8, #2d5bb8); }
.latest-draw .ld-sep { color: rgba(31,31,31,.35); font-size: .6rem; }

/* 开奖结果展开面板 */
.lottery-result-panel{
  background: rgba(31,31,31,.025);
  border-left: 3px solid rgba(184,159,125,.45);
  margin: 0 0 6px 0;
  padding: 8px 12px;
  border-radius: 0 10px 10px 0;
}
.lrp-loading{ color: var(--gold-2); font-size: .82rem; padding: 6px 0; }
.lrp-row{
  display: flex; align-items: center; gap: 8px;
  padding: 5px 0; border-bottom: 1px solid rgba(31,31,31,.06); flex-wrap: wrap;
}
.lrp-row:last-child{ border-bottom: none; }
.lrp-qihao{ font-size: .78rem; color: var(--text); opacity: .55; white-space: nowrap; min-width: 82px; }
.lrp-date{ font-size: .72rem; color: var(--text); opacity: .4; white-space: nowrap; }
.lrp-balls{ display: flex; gap: 3px; flex-wrap: wrap; align-items: center; }
.lrp-ball{
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%;
  font-size: .75rem; font-weight: 900; font-family: var(--font-sub); color: #fff;
  flex-shrink: 0;
}
.lrp-red{ background: radial-gradient(circle at 35% 35%, #e84c4c, #b83232); box-shadow: 0 1px 3px rgba(184,50,50,.25); }
.lrp-blue{ background: radial-gradient(circle at 35% 35%, #4c7ee8, #2d5bb8); box-shadow: 0 1px 3px rgba(45,91,184,.25); }

/* 静态：禁用旋转 */
.donate-logo-static .donate-logo-ring{
  animation: none !important;
  transform: rotate(0deg);
}

/* 重要提醒 */
.warning-box{
  margin-top:2rem;
  background:rgba(184,159,125,.10);
  border:1px solid rgba(184,159,125,.20);
  border-radius:16px;
  padding:1.5rem;
}
.warning-box h4{
  display:flex;align-items:center;gap:.55rem;
  color:rgba(122,104,81,.98);
  font-family:var(--font-head);
  font-weight:900;
  font-size:1.2rem;
  margin-bottom:.75rem;
  letter-spacing:.4px;
}
.warning-box p{ color:rgba(31,31,31,.8); line-height:1.7; }

/* 站内入口按钮（重要提醒下方） */
.site-actions{
  margin-top: 1rem;
  display:flex;
  justify-content:center;
  gap:12px;
  flex-wrap:wrap;
}
.site-action-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:.85rem 1.25rem;
  border-radius:14px;
  text-decoration:none;
  font-weight:900;
  font-family:var(--font-sub);
  color:#fff;
  background: linear-gradient(135deg, rgba(90,139,158,.95), rgba(122,104,81,.95));
  box-shadow:0 10px 22px rgba(18,18,18,.10);
  transition: var(--transition);
  min-width: 120px;
}
.site-action-btn:hover{
  transform: translateY(-2px);
  box-shadow:0 14px 28px rgba(18,18,18,.15);
}

/* 页脚 */
.site-footer{
  padding:1.5rem 0;
  width:100%;
  margin-top:auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  height:120px;
  font-family:var(--font-sub);
  font-size:0.9rem;
  color:rgba(31,31,31,0.55);
}
.footer-links{ display:flex; justify-content:center; gap:10px; }
.site-footer a{
  color:rgba(31,31,31,0.65);
  text-decoration:none;
  padding:0.35rem 0.9rem;
  border-radius:999px;
  background:rgba(0,0,0,0.03);
  transition:var(--transition);
}
.site-footer a:hover{
  background:rgba(0,0,0,0.06);
  color:rgba(31,31,31,0.85);
}
.copyright{
  font-size:.78rem;
  color:rgba(31,31,31,.40);
  letter-spacing:.2px;
  text-align:center;
}

/* 模态框 */
.modal{
  display:none;
  position:fixed;inset:0;
  background:rgba(18,18,18,.35);
  backdrop-filter:blur(10px);
  z-index:2000;
  padding:12px;
  align-items:center;
  justify-content:center;
}
.auth-box,.check-box,.help-modal-box{
  width:min(520px, 100%);
  border-radius:18px;
  background: rgba(255,255,255,.92);
  box-shadow:0 26px 68px rgba(18,18,18,.18);
  overflow:hidden;
  position:relative;
}
.auth-header,.check-header,.help-header{
  padding: .95rem 1.05rem .75rem;
  border-bottom:1px solid rgba(31,31,31,.08);
}
.auth-header h2,.check-header h2,.help-header h2{
  font-family: var(--font-head);
  font-weight: 900;
  font-size: 1.25rem;
  background:linear-gradient(90deg, var(--gold-3), var(--gold-2));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  letter-spacing:.5px;
}
.auth-tabs{ display:flex; gap:8px; padding:.75rem 1.05rem .25rem; }
.tab-btn{
  flex:1;
  border:none;
  cursor:pointer;
  padding:.7rem .8rem;
  border-radius:14px;
  font-weight:900;
  font-family: var(--font-sub);
  background: rgba(0,0,0,.04);
  color: rgba(31,31,31,.78);
  transition: var(--transition);
}
.tab-btn.active{
  background: linear-gradient(135deg, rgba(184,159,125,.35), rgba(156,133,104,.20));
  color: rgba(31,31,31,.92);
}
.auth-body,.check-body,.help-body{
  padding: .75rem 1.05rem 1rem;
  max-height: 70vh;
  overflow-y: auto;
}
.form-row{ display:flex; flex-direction:column; gap:8px; margin-bottom:10px; }
.form-row label{ font-weight:900; color: rgba(31,31,31,.70); font-size:.95rem; }
.form-row input{
  padding:.85rem .9rem;
  border-radius:14px;
  border:1px solid rgba(31,31,31,.10);
  outline:none;
  background: rgba(255,255,255,.88);
  font-weight:800;
  font-size:1rem;
}
.auth-actions{ display:flex; gap:10px; margin-top:10px; }
.btn-gold{
  flex:1;
  border:none;
  cursor:pointer;
  padding:.9rem 1rem;
  border-radius:14px;
  font-weight:900;
  font-size:1.02rem;
  color:#fff;
  background: linear-gradient(135deg, var(--gold-2), var(--gold-3));
  box-shadow:0 10px 22px rgba(18,18,18,.10);
  transition: var(--transition);
}
.btn-gold:hover{ transform: translateY(-2px); }
.btn-ghost{
  border:none;
  cursor:pointer;
  padding:.9rem 1rem;
  border-radius:14px;
  font-weight:900;
  font-size:1.02rem;
  color: rgba(31,31,31,.78);
  background: rgba(0,0,0,.04);
  transition: var(--transition);
}
.btn-ghost:hover{ background: rgba(0,0,0,.07); }

.check-list{ display:flex; flex-direction:column; gap:12px; }
.check-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:1rem;
  border-radius:14px;
  background:rgba(0,0,0,.03);
  border:1px solid rgba(31,31,31,.05);
  transition:var(--transition);
  cursor:pointer;
}
.check-item:hover{
  background:rgba(0,0,0,.06);
  transform:translateY(-2px);
}
.check-item-icon{
  width:44px;height:44px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.3rem;
  color:#fff;
}
.check-item-icon.ssq{ background:var(--red); }
.check-item-icon.kl8{ background:var(--green); }
.check-item-icon.qlc{ background:var(--purple); }
.check-item-icon.fc3d{ background:var(--orange); }
.check-item-icon.dlt{ background:var(--gold-3); }
.check-item-icon.qxc{ background:var(--blue); }
.check-item-icon.pl3{ background:var(--orange); }
.check-item-icon.pl5{ background:var(--red); }
.check-item-text{ flex:1; }
.check-item-text h4{
  font-family:var(--font-sub);
  font-weight:900;
  font-size:1.05rem;
  color:rgba(31,31,31,.9);
  margin-bottom:2px;
}
.check-item-text p{
  font-size:.85rem;
  color:rgba(31,31,31,.6);
}
.check-item-arrow{
  color:rgba(31,31,31,.4);
  font-size:1.1rem;
}

.close-modal{
  position:absolute;top:10px;right:10px;
  width:42px;height:42px;
  border-radius:14px;
  border:none;
  background:rgba(255,255,255,.86);
  box-shadow:0 12px 24px rgba(18,18,18,.12);
  cursor:pointer;
  font-size:1.05rem;
  color:var(--gold-3);
  transition:var(--transition);
  display:flex;align-items:center;justify-content:center;
  z-index:5;
}
.close-modal:hover{transform:translateY(-2px);}

/* 捐助模态框内容 */
.donate-box{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.donate-row{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding: 14px 14px;
  border-radius:16px;
  background: rgba(0,0,0,.03);
  border: 1px solid rgba(31,31,31,.06);
}
.donate-ico{
  width:44px;height:44px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(184,159,125,.18);
  color: rgba(122,104,81,.98);
  box-shadow: 0 8px 18px rgba(18,18,18,.08);
  flex: 0 0 auto;
}
.donate-ico.usdt{
  background: rgba(38,161,123,.14);
  color: rgba(38,161,123,.95);
}
.usdt-svg{ width:28px;height:28px; }
.usdt-svg circle{ fill: rgb(38,161,123); }
.usdt-svg path{ fill: #fff; }

.donate-text{ flex:1; min-width:0; }
.donate-label{
  font-family: var(--font-sub);
  font-weight: 900;
  color: rgba(31,31,31,.70);
  font-size: .92rem;
  margin-bottom: 4px;
}
.donate-net{
  display:inline-block;
  margin-left:6px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(0,0,0,.06);
  color: rgba(31,31,31,.70);
  font-size: .78rem;
  font-weight: 900;
}
.donate-value{
  font-family: var(--font-body);
  font-weight: 900;
  color: rgba(31,31,31,.90);
  font-size: 1rem;
  line-height:1.25;
  word-break: break-all;
}
.donate-note{
  margin-top:6px;
  font-weight:900;
  color: rgba(31,31,31,.55);
  font-size: .9rem;
  font-family: var(--font-sub);
}
.donate-copy{
  border:none;
  cursor:pointer;
  padding: .65rem .85rem;
  border-radius: 12px;
  background: rgba(0,0,0,.04);
  color: rgba(31,31,31,.78);
  font-weight: 900;
  font-family: var(--font-sub);
  transition: var(--transition);
  flex: 0 0 auto;
}
.donate-copy:hover{
  background: rgba(0,0,0,.07);
  color: rgba(31,31,31,.92);
  transform: translateY(-2px);
}
.donate-split{
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 6px 0 2px;
}
.donate-hint{
  min-height: 1.2rem;
  text-align:center;
  font-weight: 900;
  color: rgba(122,104,81,.92);
  font-family: var(--font-sub);
}

/* 移动端适配 */
@media (max-width:768px){
  .lottery-cards,.games-grid{ grid-template-columns:1fr; }
  .site-title{font-size:1.9rem;}
  .lottery-card,.game-card{ padding:1.2rem; }
  .wheel-area{ width:180px; height:180px; }
  .wheel{ width:180px; height:180px; }
  .slot-digit{ font-size: 2.4rem; height: 64px; }
  .reel-window{ width:60px; height:64px; }
  .site-footer{ height:auto; padding:1.5rem 0; }
  .top-header{ padding: 4rem 0 1.5rem; }
  .card-stage{ width:100%; }
  .poker-card{ width: 170px; height: 112px; }
  .muyu-container{ width:140px; height:140px; }
}
@media (max-width:480px){
  .container{padding:0 16px;}
  .lottery-ball{ width:42px; height:42px; font-size:1.1rem; }
  .die{ width:46px; height:46px; font-size:1.3rem; }
  .reel-window{ width:56px; height:60px; }
  .slot-digit{ font-size:2.2rem; height:60px; }
  .wheel-area{ width:160px; height:160px; }
  .wheel{ width:160px; height:160px; }
  .wheel-center{ width:50px; height:50px; }
  .poker-card{ width: 160px; height: 108px; }
  .poker-center{ font-size: 2.25rem; }
  .check-item{ padding:.8rem; }
  .check-item-icon{ width:40px; height:40px; font-size:1.2rem; }
}