/* ===== 盛典大放送（gala）：紫黑星空 / 星云紫白 ===== */

.gala-page .page-body{padding-bottom:2px}
.gala-page .card{scroll-margin-top:58px}

/* ---------- 头图 ---------- */
.gala-hero{
  position:relative;overflow:hidden;border-radius:var(--r-l);
  padding:20px 16px 16px;margin-top:4px;
  background:
    radial-gradient(300px 190px at 78% -6%,rgba(124,92,255,.42),transparent 62%),
    radial-gradient(260px 180px at 4% 106%,rgba(76,40,160,.40),transparent 68%),
    linear-gradient(160deg,#140b28,#0a0614 62%,#07030f);
  border:1px solid rgba(185,167,255,.28);
  box-shadow:inset 0 0 0 1px rgba(185,167,255,.06),0 16px 40px rgba(0,0,0,.5),0 0 46px rgba(124,92,255,.20);
}
.gala-hero-glow{
  position:absolute;right:-58px;top:-74px;width:206px;height:206px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(185,167,255,.34),rgba(124,92,255,.10) 52%,transparent 70%);
}
.gala-hero-mark{
  position:absolute;right:24px;top:34px;font-size:40px;line-height:1;pointer-events:none;
  color:rgba(244,240,255,.92);text-shadow:0 0 22px rgba(179,162,255,.85);
  transform:rotate(10deg);animation:floaty 3.4s ease-in-out infinite;
}
.gala-star{
  position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;border-radius:50%;background:#fff;
  box-shadow:0 0 8px 1px rgba(205,191,255,.9);
  animation:twinkle 3s ease-in-out infinite;animation-delay:var(--d);
}
.gala-hero-kicker{
  display:flex;align-items:center;gap:5px;font-size:9.5px;letter-spacing:1px;color:var(--text-2);
}
.gala-hero-kicker svg{color:var(--violet-2)}
.gala-hero-title{
  margin-top:10px;font-family:var(--font-display);font-size:29px;font-weight:800;letter-spacing:4px;line-height:1.25;
  background:linear-gradient(180deg,#ffffff,#e7e0ff 48%,#b3a2ff 96%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 2px 14px rgba(124,92,255,.45));
}
.gala-hero-sub{margin-top:4px;font-size:10.5px;color:var(--text-2);letter-spacing:.6px}
.gala-hero-meta{display:flex;align-items:center;gap:8px;margin-top:12px;position:relative;z-index:2}
.gala-hero-time{
  display:inline-flex;align-items:center;gap:4px;height:23px;padding:0 10px;border-radius:var(--r-pill);
  font-size:10px;color:var(--violet-1);background:rgba(185,167,255,.10);border:1px solid var(--line);
  font-variant-numeric:tabular-nums;
}

/* ---------- 档位进度 ---------- */
.gala-prog{padding:13px 14px 12px}
.gala-prog-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:9px}
.gala-prog-label{font-size:10px;color:var(--text-3)}
.gala-prog-num{
  font-family:var(--font-display);font-size:27px;font-weight:800;line-height:1.1;letter-spacing:.5px;
  color:var(--text-1);font-variant-numeric:tabular-nums;text-shadow:0 0 20px rgba(124,92,255,.5);
}
.gala-prog-num small{font-family:var(--font-body);font-size:10px;font-weight:400;color:var(--text-3);margin-left:3px}
.gala-prog-next{flex:none;text-align:right;font-size:10px;line-height:1.6;color:var(--text-2);font-variant-numeric:tabular-nums}
.gala-prog-next span{color:var(--text-3)}
.gala-prog-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:9px;font-size:10px;color:var(--text-3)}
.gala-prog-foot .chip{height:20px}

/* ---------- 档位横滑卡牌 ---------- */
.gala-block-title{
  display:flex;align-items:center;gap:6px;margin:14px 2px 8px;
  font-size:12px;font-weight:600;color:var(--violet-2);letter-spacing:.5px;
}
.gala-cards{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:2px 0 5px;
}
.gala-tier{
  position:relative;
  display:flex;flex-direction:column;align-items:center;gap:6px;
  padding:9px 9px 9px;border-radius:16px;
  background:linear-gradient(168deg,rgba(255,255,255,.055),rgba(255,255,255,.012) 56%,rgba(124,92,255,.10));
  border:1px solid var(--line-soft);box-shadow:0 8px 20px rgba(0,0,0,.28);
}
.gala-tier.is-ready{
  background:linear-gradient(168deg,rgba(185,167,255,.20),rgba(124,92,255,.08) 58%,rgba(255,255,255,.02));
  border-color:rgba(185,167,255,.46);box-shadow:0 0 22px rgba(124,92,255,.22);
}
.gala-tier.is-claimed{opacity:.55;filter:saturate(.7)}
.gala-tier-need{font-size:9px;line-height:1.4;min-height:12px;text-align:center;color:var(--text-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.gala-tier.is-ready .gala-tier-need{color:var(--violet-2)}
.gala-tier-icon{
  width:42px;height:42px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  color:var(--violet-2);
  background:radial-gradient(circle at 50% 30%,rgba(185,167,255,.20),rgba(124,92,255,.06));
  border:1px solid var(--line-soft);box-shadow:inset 0 0 14px rgba(124,92,255,.22);
}
.gala-tier.is-ready .gala-tier-icon{color:var(--text-1);border-color:var(--line-strong);box-shadow:inset 0 0 16px rgba(124,92,255,.4)}
.gala-tier-name{min-height:30px;font-size:11px;font-weight:600;line-height:1.4;text-align:center;color:var(--text-1)}
.gala-tier.is-claimed .gala-tier-name{color:var(--text-3)}
.gala-tier-act{margin-top:auto;width:100%;display:flex;flex-direction:column;align-items:center;gap:4px}
.gala-tier-prog{width:100%;display:flex;flex-direction:column;align-items:center;gap:4px}
.gala-tier-prog .progress{width:100%;height:5px}
.gala-tier-done{display:inline-flex;align-items:center;gap:3px;font-size:10px;color:var(--text-3)}
.gala-tier .btn.xs{height:26px;padding:0 14px}
.gala-tier .chip{height:19px}

/* 大额自动点亮 */
.gala-auto{
  display:flex;align-items:center;gap:10px;margin-top:12px;padding:11px 12px;
  background:linear-gradient(120deg,rgba(124,92,255,.18),rgba(255,255,255,.02) 72%);
  border-color:rgba(167,139,250,.26);
}
.gala-auto-ic{
  flex:none;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:var(--violet-2);background:rgba(185,167,255,.10);border:1px solid var(--line);
}
.gala-auto-body{flex:1;min-width:0}
.gala-auto-title{font-size:12px;font-weight:600;color:var(--text-1)}
.gala-auto-desc{margin-top:2px;font-size:10px;line-height:1.5;color:var(--text-3)}
.gala-auto .btn{flex:none}

/* ---------- 盛典转盘 ---------- */
.gala-wheel-card .card-hd{margin-bottom:0}
.gala-wheel-wrap{position:relative;width:250px;height:250px;margin:8px auto 0}
.gala-wheel-wrap:before{
  content:"";position:absolute;inset:-20px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(124,92,255,.34),rgba(124,92,255,.05) 60%,transparent 72%);
}
.gala-wheel{position:absolute;inset:0}
.gala-wheel-disc{
  position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(from -22.5deg,
    rgba(185,167,255,.36) 0deg 45deg,
    rgba(66,36,134,.78) 45deg 90deg,
    rgba(185,167,255,.36) 90deg 135deg,
    rgba(66,36,134,.78) 135deg 180deg,
    rgba(185,167,255,.36) 180deg 225deg,
    rgba(66,36,134,.78) 225deg 270deg,
    rgba(185,167,255,.36) 270deg 315deg,
    rgba(66,36,134,.78) 315deg 360deg);
  border:1px solid rgba(205,191,255,.5);
  box-shadow:inset 0 0 52px rgba(0,0,0,.7),0 0 0 7px rgba(124,92,255,.08),0 0 30px rgba(124,92,255,.45);
  transition:transform 2.8s cubic-bezier(.16,.82,.18,1);
  will-change:transform;
}
.gala-wheel-disc:before{
  content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 50% 36%,rgba(255,255,255,.16),transparent 64%);
}
.gala-wheel-disc:after{
  content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none;
  background:repeating-conic-gradient(from -22.5deg,rgba(205,191,255,.26) 0deg .5deg,transparent .5deg 45deg);
  opacity:.9;
}
.gala-seg{position:absolute;left:50%;top:50%;width:0;height:0;z-index:2;transform:rotate(var(--a))}
.gala-seg-in{
  position:absolute;left:-32px;top:-104px;width:64px;
  display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;
  transform:rotate(calc(-1 * var(--a)));
}
.gala-seg-ic{display:flex;color:var(--text-1);filter:drop-shadow(0 2px 5px rgba(0,0,0,.55))}
.gala-seg-in em{
  font-style:normal;font-size:8.5px;line-height:1.15;letter-spacing:.1px;
  color:rgba(246,243,255,.92);text-shadow:0 1px 3px rgba(0,0,0,.7);
}
.gala-pointer{position:absolute;left:50%;top:-14px;width:20px;height:36px;margin-left:-10px;z-index:4;pointer-events:none}
.gala-pointer:before{
  content:"";position:absolute;left:1px;top:0;width:18px;height:18px;border-radius:50%;
  background:radial-gradient(circle at 40% 30%,#ffffff,#cdbfff 46%,#7c5cff 90%);
  box-shadow:0 0 16px rgba(179,162,255,.9);
}
.gala-pointer:after{
  content:"";position:absolute;left:50%;top:15px;margin-left:-7px;width:0;height:0;
  border-left:7px solid transparent;border-right:7px solid transparent;border-top:13px solid #cdbfff;
  filter:drop-shadow(0 0 7px rgba(179,162,255,.8));
}
.gala-spin{
  position:absolute;left:50%;top:50%;z-index:5;width:78px;height:78px;margin:-39px 0 0 -39px;
  border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
  background:radial-gradient(circle at 50% 26%,#efe9ff,#b3a2ff 42%,#7c5cff 78%,#5b46c8);
  color:#110826;font-family:var(--font-display);font-size:17px;font-weight:800;letter-spacing:1px;line-height:1.1;
  box-shadow:0 0 0 4px rgba(10,6,20,.92),0 0 0 5px rgba(185,167,255,.55),0 8px 24px rgba(0,0,0,.55),0 0 30px rgba(124,92,255,.55);
  transition:transform .15s ease,filter .2s ease;
}
.gala-spin small{
  font-family:var(--font-body);font-size:8px;font-weight:500;letter-spacing:0;color:rgba(17,8,38,.6);
}
.gala-spin:active{transform:scale(.96)}
.gala-spin.is-busy{filter:saturate(.6) brightness(.85)}
.gala-wheel-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px}
.gala-wheel-foot .btn-line{flex:none}

/* ---------- 集字 ---------- */
.gala-words-card .card-hd{margin-bottom:10px}
.gala-words{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:12px}
.gala-word{display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--text-3)}
.gala-word-frame{
  width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:15px;line-height:1;color:var(--text-4);
  background:rgba(255,255,255,.03);border:1.5px dashed rgba(255,255,255,.14);
}
.gala-word.is-on{color:var(--violet-2)}
.gala-word.is-on .gala-word-frame{
  color:var(--text-1);
  background:radial-gradient(circle at 45% 30%,rgba(255,255,255,.22),rgba(124,92,255,.20));
  border:1.5px solid rgba(185,167,255,.68);
  box-shadow:0 0 14px rgba(124,92,255,.4),inset 0 0 0 2px rgba(10,6,20,.5);
}
.gala-word .tiny{font-size:8.5px;line-height:1.2;text-align:center;white-space:nowrap}
.gala-collect{
  display:flex;align-items:center;gap:8px;margin-top:12px;padding:9px 10px;border-radius:12px;
  background:rgba(124,92,255,.10);border:1px dashed rgba(185,167,255,.28);
  color:var(--text-2);line-height:1.5;
}
.gala-collect-ic{flex:none;display:flex;color:var(--violet-2)}
.gala-collect-wrap{margin-top:12px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.gala-collect-note{font-size:9px;color:var(--text-4);line-height:1.5}
.gala-collect.is-done{width:100%;margin-top:0}
/* 集齐后：选择头像框 */
.gala-frames{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.gala-frame-opt{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px;border-radius:12px;
  background:rgba(255,255,255,.04);border:1px solid var(--line-soft);color:var(--text-2);font-size:9.5px}
.gala-frame-opt .gala-word-frame{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:rgba(124,92,255,.14);border:1px solid rgba(185,167,255,.22);color:var(--violet-1)}
.gala-frame-opt.on{border-color:var(--line-strong);background:rgba(185,167,255,.14);box-shadow:0 0 14px rgba(124,92,255,.25);color:var(--text-1)}
.gala-frame-opt.on .gala-word-frame{background:linear-gradient(135deg,#b3a2ff,#7c5cff);color:#fff;border-color:transparent}
.gala-gift-row{margin-top:14px}
.gala-gift-input{width:100%;height:38px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid var(--line-soft);
  color:var(--text-1);font-size:11px;padding:0 12px;outline:none}
.gala-gift-input::placeholder{color:var(--text-4)}
.gala-gift-input:focus{border-color:rgba(185,167,255,.45)}

/* ---------- 规则 ---------- */
.gala-rules{display:flex;flex-direction:column;gap:8px}
.gala-rules li{display:flex;gap:7px;font-size:10.5px;line-height:1.65;color:var(--text-2)}
.gala-rules li i{
  flex:none;width:15px;height:15px;margin-top:1px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-style:normal;font-size:8.5px;color:var(--violet-2);
  background:rgba(124,92,255,.16);border:1px solid rgba(185,167,255,.22);
}
.gala-rules.is-sheet li{font-size:11.5px}
.gala-rules-figure{
  margin-top:12px;padding:14px 12px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  font-size:10px;letter-spacing:1px;color:var(--text-4);
  border:1px dashed rgba(255,255,255,.12);background:rgba(255,255,255,.015);
}

/* ---------- 弹层内容 ---------- */
.gala-sheet{display:block}
.gala-sheet .note{margin-top:10px}
.gala-win{display:flex;flex-direction:column;align-items:center;gap:10px;padding:8px 0 8px;text-align:center}
.gala-win-icon{
  width:92px;height:92px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:var(--violet-1);
  background:radial-gradient(circle at 50% 32%,rgba(185,167,255,.28),rgba(124,92,255,.16) 62%,rgba(255,255,255,.02));
  border:1px solid var(--line-strong);
  box-shadow:0 0 36px rgba(124,92,255,.45),inset 0 0 28px rgba(124,92,255,.3);
}
.gala-win-name{
  font-family:var(--font-display);font-size:19px;font-weight:700;letter-spacing:.5px;color:var(--text-1);
}
.gala-pool{display:flex;flex-direction:column;gap:6px}
.gala-pool-row{
  display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:11px;
  font-size:11.5px;color:var(--text-1);
  background:linear-gradient(120deg,rgba(255,255,255,.05),rgba(255,255,255,.012));
  border:1px solid var(--line-soft);
}
.gala-pool-ic{
  flex:none;width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  color:var(--violet-2);background:rgba(124,92,255,.14);
}
.gala-tips{margin-top:12px;display:flex;flex-direction:column;gap:6px}
.gala-tips li{position:relative;padding-left:12px;font-size:11px;line-height:1.65;color:var(--text-2)}
.gala-tips li:before{content:"✦";position:absolute;left:0;top:0;font-size:8px;color:var(--violet-2)}