/* 财神报喜 v2：画风对齐现在的界面（玻璃卡片 + 香槟金细边）。
   深色主题＝黑金，浅色主题＝象牙白配金；登录前（海洋界面）按深色处理。只覆盖 .cs-v2，旧类名的结构不变。 */
.cs-mask{background:radial-gradient(110vmax 80vmax at 50% 42%,rgba(8,22,34,.5),rgba(2,8,14,.82) 70%);
  -webkit-backdrop-filter:blur(9px) saturate(.9);backdrop-filter:blur(9px) saturate(.9);z-index:410}
.cs-v2{position:relative;z-index:2;--cs-bg1:#1b1d22;--cs-bg2:#0d0f13;--cs-ink:#f5eedf;--cs-dim:#a9a395;--cs-gold:#e2bf7c;--cs-gold-hi:#fbe2a8;--cs-line:rgba(226,191,124,.38);--cs-halo:rgba(226,191,124,.32);
  width:min(360px,100%);border-radius:26px;color:var(--cs-ink);
  background:radial-gradient(120% 70% at 50% 0%,rgba(226,191,124,.16),transparent 62%),linear-gradient(170deg,var(--cs-bg1),var(--cs-bg2));
  border:1px solid var(--cs-line);box-shadow:0 40px 110px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.08);
  animation:csV2In .7s cubic-bezier(.2,.85,.2,1) both}
html[data-oc-theme=light] .cs-v2{--cs-bg1:#fffdf8;--cs-bg2:#f3ede1;--cs-ink:#1f2a36;--cs-dim:#6c7480;--cs-gold:#a8823e;--cs-gold-hi:#c79a4a;--cs-line:rgba(168,130,62,.42);--cs-halo:rgba(199,154,74,.28);
  box-shadow:0 40px 110px rgba(10,20,30,.38),inset 0 1px 0 #fff}
.cs-v2 .cs-top{position:relative;line-height:0;padding-top:14px}
.cs-v2 .cs-top::after{display:none}
.cs-v2 .cs-halo{position:absolute;left:50%;top:46%;width:310px;height:310px;transform:translate(-50%,-50%);pointer-events:none}
.cs-v2 .cs-halo i{position:absolute;inset:0;border-radius:50%}
.cs-v2 .cs-halo i:first-child{background:repeating-conic-gradient(from 0deg,var(--cs-halo) 0 4deg,transparent 4deg 18deg);
  -webkit-mask:radial-gradient(circle,#000 18%,transparent 66%);mask:radial-gradient(circle,#000 18%,transparent 66%);animation:csSpin 26s linear infinite}
.cs-v2 .cs-halo i:last-child{inset:56px;border:1px solid var(--cs-line);box-shadow:0 0 60px var(--cs-halo),inset 0 0 40px var(--cs-halo);animation:csBreath 3.2s ease-in-out infinite}
.cs-v2 .cs-stars b{position:absolute;width:10px;height:10px;background:var(--cs-gold-hi);
  clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);opacity:0;animation:csTwinkle 2.4s ease-in-out infinite}
.cs-v2 .cs-stars b:nth-child(1){left:18%;top:22%;animation-delay:.2s}.cs-v2 .cs-stars b:nth-child(2){left:78%;top:18%;animation-delay:.9s;transform:scale(.7)}
.cs-v2 .cs-stars b:nth-child(3){left:84%;top:60%;animation-delay:1.5s}.cs-v2 .cs-stars b:nth-child(4){left:12%;top:66%;animation-delay:.5s;transform:scale(.6)}
.cs-v2 .cs-stars b:nth-child(5){left:30%;top:8%;animation-delay:1.9s;transform:scale(.5)}.cs-v2 .cs-stars b:nth-child(6){left:66%;top:84%;animation-delay:1.2s;transform:scale(.6)}
.cs-v2 .cs-stars b:nth-child(7){left:50%;top:2%;animation-delay:.6s;transform:scale(.8)}
.cs-v2 .cs-pic-wrap{height:min(240px,28vh);margin:0 auto;filter:drop-shadow(0 18px 26px rgba(0,0,0,.35))}
.cs-v2 .cs-body{padding:6px 24px 22px}
.cs-v2 .cs-kicker{display:inline-flex;align-items:center;gap:10px;font:600 11px/1 "Segoe UI",system-ui,sans-serif;letter-spacing:.28em;color:var(--cs-gold);margin-top:6px}
.cs-v2 .cs-kicker::before,.cs-v2 .cs-kicker::after{content:"";width:22px;height:1px;background:var(--cs-gold);opacity:.7}
.cs-v2 .cs-title{margin-top:10px;font:600 22px/1.35 "Noto Serif SC","Source Han Serif SC","Songti SC","STSong",serif;letter-spacing:.14em;color:var(--cs-ink);text-shadow:none}
.cs-v2 .cs-amount{margin-top:8px;font:700 40px/1.15 "Segoe UI",system-ui,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:.01em;text-shadow:none;
  background:linear-gradient(180deg,var(--cs-gold-hi),var(--cs-gold) 60%,#9b7434);-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 6px 18px var(--cs-halo))}
.cs-v2 .cs-sub{color:var(--cs-dim);font-size:13px;margin-top:10px}
.cs-v2 .cs-sub b{color:var(--cs-gold);font-weight:600}
.cs-v2 .cs-note{color:var(--cs-dim);opacity:.75;font-size:11px;margin-top:8px}
.cs-v2 .cs-btn{margin-top:18px;min-height:46px;border-radius:14px;font-size:14px;font-weight:600;letter-spacing:.16em;color:#2a1d07;
  background:linear-gradient(120deg,#f6dca0,#d6aa5c);box-shadow:0 10px 28px rgba(214,170,92,.32);transition:transform .2s,box-shadow .2s}
.cs-v2 .cs-btn:hover{background:linear-gradient(120deg,#fae6b6,#dfb569);transform:translateY(-2px);box-shadow:0 14px 34px rgba(214,170,92,.4)}
.cs-v2 .cs-btn:focus-visible{outline:2px solid var(--cs-gold);outline-offset:3px}
/* 金币：带厚度的金色圆片，下落时绕竖轴翻转并左右摆 */
.cs-mask .cs-coin{background:radial-gradient(circle at 34% 28%,#fff6cf,#f1c85a 45%,#b7801a 100%);color:#7a5208;font-weight:800;
  box-shadow:0 0 14px rgba(255,200,90,.45),inset 0 0 0 2px rgba(255,236,170,.55),inset 0 -2px 3px rgba(120,70,0,.35);
  animation-name:csFall2;transform-style:preserve-3d}
.cs-mask .cs-coin span{display:block;animation:csFlip var(--flip,.8s) linear infinite}
@keyframes csV2In{0%{opacity:0;transform:translateY(28px) scale(.92);filter:blur(8px)}100%{opacity:1;transform:none;filter:none}}
@keyframes csSpin{to{transform:rotate(360deg)}}
@keyframes csBreath{0%,100%{opacity:.55;transform:scale(.97)}50%{opacity:1;transform:scale(1.03)}}
@keyframes csTwinkle{0%,100%{opacity:0}45%{opacity:1}}
@keyframes csFall2{0%{transform:translate(0,0) rotateY(0);opacity:0}8%{opacity:1}100%{transform:translate(var(--sway,0),112vh) rotateY(1080deg);opacity:.15}}
@keyframes csFlip{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.15)}}
@media(max-width:600px){.cs-v2 .cs-amount{font-size:34px}.cs-v2 .cs-halo{width:260px;height:260px}}
@media(prefers-reduced-motion:reduce){.cs-v2,.cs-v2 .cs-halo i,.cs-v2 .cs-stars b,.cs-mask .cs-coin,.cs-mask .cs-coin span{animation:none!important}.cs-mask .cs-coin{display:none}.cs-v2 .cs-stars b{opacity:.6}}
