/* 每日卡包：按住撕開 → 光爆 → 翻出卡牌 */
.pk-ov { position:fixed; inset:0; z-index:9500; display:flex; align-items:center; justify-content:center; background:radial-gradient(circle at 50% 45%, rgba(255,255,255,.99) 0%, rgba(220,251,238,.99) 55%, rgba(170,238,212,.99) 100%); animation:pkFade .35s ease; overflow:hidden; }
.pk-ov[hidden] { display:none; }
@keyframes pkFade { from { opacity:0; } }
.pk-rays { position:absolute; left:50%; top:46%; width:1400px; height:1400px; margin:-700px 0 0 -700px; opacity:0; pointer-events:none;
  background:var(--pk-burst, repeating-conic-gradient(from 0deg, rgba(255,226,122,.55) 0 8deg, rgba(255,226,122,0) 8deg 20deg)); border-radius:50%;
  -webkit-mask-image:radial-gradient(circle, #000 0%, transparent 70%); mask-image:radial-gradient(circle, #000 0%, transparent 70%); }
.pk-ov.burst .pk-rays { animation:pkRays 2.6s ease-out forwards; }
@keyframes pkRays { 0% { opacity:0; transform:scale(.3) rotate(0); } 15% { opacity:1; } 100% { opacity:.55; transform:scale(1) rotate(60deg); } }
.pk-skip { position:absolute; top:calc(var(--tv-bezel, 34px) + 14px); right:22px; z-index:5; border:2px solid #123E35; background:#fff; border-radius:16px; padding:8px 14px; font:700 13px/1 'Rubik','ResourceHanRoundedCN',sans-serif; color:#123E35; cursor:pointer; }
.pk-skip:hover { background:var(--modo-emerald); }
.pk-stage { position:relative; width:min(92vw, 420px); height:min(86vh, 640px); display:flex; flex-direction:column; align-items:center; justify-content:center; }
.pk-title { position:absolute; top:0; margin:0; font:800 22px/1.3 'Rubik','ResourceHanRoundedCN',sans-serif; color:#123E35; text-align:center; }
.pk-title small { display:block; font:600 13px/1.4 'Rubik','ResourceHanRoundedCN',sans-serif; color:#3D5A52; margin-top:4px; }

/* 卡包（CSS 佔位；可用 assets/pack/pack-closed.png 取代） */
.pk-pack { position:relative; width:220px; height:320px; cursor:grab; touch-action:none; user-select:none; -webkit-user-select:none; filter:drop-shadow(0 14px 0 rgba(18,62,53,.18)) drop-shadow(0 26px 24px rgba(18,62,53,.25));
  transform:rotate(calc(var(--sh, 0) * 1deg)) scale(calc(1 + var(--p, 0) * .06)); transition:filter .2s; animation:pkFloat 2.6s ease-in-out infinite; }
.pk-pack.holding { animation:none; cursor:grabbing; }
.pk-pack.torn { animation:none; pointer-events:none; }
@keyframes pkFloat { 0%,100% { transform:translateY(0) rotate(-2deg); } 50% { transform:translateY(-12px) rotate(2deg); } }
.pk-body { position:absolute; left:0; right:0; top:34px; bottom:0; border:4px solid #123E35; border-top:none; border-radius:0 0 14px 14px; overflow:hidden;
  background:linear-gradient(160deg, #8DF0D0 0%, #2DA888 45%, #0E8160 100%); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; }
.pk-body::before { content:''; position:absolute; inset:0; background:repeating-linear-gradient(115deg, rgba(255,255,255,.14) 0 10px, rgba(255,255,255,0) 10px 24px); }
.pk-body img { position:relative; width:118px; filter:drop-shadow(0 4px 0 rgba(18,62,53,.3)); }
.pk-body b { position:relative; font:900 30px/1 'Rubik',sans-serif; letter-spacing:4px; color:#fff; text-shadow:0 3px 0 #0A5F47; }
.pk-body span { position:relative; font:800 13px/1 'Rubik','ResourceHanRoundedCN',sans-serif; color:#093027; background:#FFD25A; border:2px solid #123E35; border-radius:10px; padding:5px 12px; }
.pk-body::after { content:''; position:absolute; top:-30%; bottom:-30%; width:40px; left:-60px; background:linear-gradient(90deg, transparent, rgba(255,255,255,.75), transparent); transform:rotate(18deg); animation:pkShine 3s ease-in-out infinite; }
@keyframes pkShine { 0% { left:-60px; } 55%,100% { left:130%; } }
.pk-top { position:absolute; left:-6px; right:-6px; top:0; height:40px; border:4px solid #123E35; border-radius:10px 10px 0 0; z-index:2;
  background:linear-gradient(180deg, #C9FBE8, #5BD6AE); transform-origin:0 100%; }
.pk-top::after { content:''; position:absolute; left:0; right:0; bottom:-8px; height:8px; background:repeating-linear-gradient(90deg, #123E35 0 6px, transparent 6px 12px); clip-path:polygon(0 0,100% 0,100% 100%,0 100%); opacity:.35; }
.pk-pack.has-art .pk-body, .pk-pack.has-art .pk-top { display:none; }
.pk-pack .pk-art { display:none; width:100%; height:100%; object-fit:contain; }
.pk-pack.has-art .pk-art { display:block; }
.pk-pack.torn .pk-top { animation:pkTop .8s cubic-bezier(.3,.6,.4,1) forwards; }
.pk-pack.torn .pk-body { animation:pkBody .9s ease-in .15s forwards; }
@keyframes pkTop { to { transform:translate(120px,-260px) rotate(50deg); opacity:0; } }
@keyframes pkBody { to { transform:translateY(160px) scale(.9); opacity:0; } }
.pk-hold { position:absolute; bottom:70px; left:50%; width:64px; height:64px; margin-left:-32px; pointer-events:none; opacity:0; transition:opacity .2s; }
.pk-hold.on { opacity:1; }
.pk-hold svg { width:100%; height:100%; transform:rotate(-90deg); }
.pk-hold circle { fill:none; stroke-width:8; stroke-linecap:round; }
.pk-hold .bg { stroke:rgba(18,62,53,.15); } .pk-hold .fg { stroke:#0E8160; stroke-dasharray:176; stroke-dashoffset:calc(176 - 176 * var(--p, 0)); }
.pk-hint { position:absolute; bottom:8px; margin:0; font:800 16px/1.4 'Rubik','ResourceHanRoundedCN',sans-serif; color:#123E35; text-align:center; animation:pkBlink 1.6s ease-in-out infinite; }
.pk-hint.hide { display:none; }
@keyframes pkBlink { 0%,100% { opacity:.55; } 50% { opacity:1; } }

/* 卡牌 */
.pk-card { position:absolute; left:50%; top:50%; width:238px; margin:-190px 0 0 -119px; perspective:1200px; opacity:0; transform:scale(.3); pointer-events:none; }
.pk-card.show { animation:pkCardIn .7s cubic-bezier(.2,.9,.3,1.25) forwards; }
@keyframes pkCardIn { to { opacity:1; transform:scale(1); } }
.pk-card-inner { position:relative; width:100%; transform-style:preserve-3d; transition:transform .9s cubic-bezier(.3,.1,.2,1); transform:rotateY(180deg); }
.pk-card.flipped .pk-card-inner { transform:rotateY(0); }
.pk-front { backface-visibility:hidden; -webkit-backface-visibility:hidden; }
.pk-front .bc-flip:hover .bc-flip-inner { transform:none; }
.pk-front .bc-flipbtn { display:none !important; }
.pk-front .bc-flip { filter:drop-shadow(0 10px 0 rgba(18,62,53,.16)) drop-shadow(0 22px 26px rgba(18,62,53,.25)); }
.pk-back { position:absolute; inset:0; transform:rotateY(180deg); backface-visibility:hidden; -webkit-backface-visibility:hidden; border:4px solid #123E35; border-radius:14px; overflow:hidden;
  background:var(--pk-back, linear-gradient(160deg,#5BD6AE,#0E8160)); display:flex; align-items:center; justify-content:center; }
.pk-back::before { content:''; position:absolute; inset:0; background:repeating-linear-gradient(45deg, rgba(255,255,255,.14) 0 8px, transparent 8px 18px); }
.pk-back img { position:relative; width:110px; filter:drop-shadow(0 4px 0 rgba(18,62,53,.3)); }
.pk-result { position:absolute; left:0; right:0; bottom:0; display:flex; flex-direction:column; align-items:center; gap:10px; opacity:0; transform:translateY(20px); pointer-events:none; transition:opacity .5s .9s, transform .5s .9s; }
.pk-result.show { opacity:1; transform:none; pointer-events:auto; }
.pk-rarity { font:900 15px/1 'Rubik','ResourceHanRoundedCN',sans-serif; letter-spacing:2px; padding:7px 16px; border-radius:16px; border:2px solid #123E35; }
.pk-rarity.common { background:#D9F7EE; color:#0B4A3B; } .pk-rarity.rare { background:#EAF6F1; color:#0E8160; }
.pk-rarity.epic { background:linear-gradient(90deg,#FFE27A,#FFD25A); color:#5A3D00; } .pk-rarity.legend { background:linear-gradient(90deg,#FFE27A,#FFF3C7,#FFD25A,#FFE27A); color:#5A3D00; animation:pkLegend 2s linear infinite; background-size:300% 100%; }
@keyframes pkLegend { to { background-position:-300% 0; } }
.pk-name { font:800 18px/1.2 'Rubik','ResourceHanRoundedCN',sans-serif; color:#123E35; }
.pk-btns { display:flex; gap:10px; }
.pk-star { position:absolute; z-index:6; width:24px; margin:-12px 0 0 -12px; pointer-events:none; image-rendering:pixelated; animation:fxStar 1.3s cubic-bezier(.2,.8,.3,1) both; }
.pk-flash { position:absolute; inset:0; background:#fff; opacity:0; pointer-events:none; z-index:7; }
.pk-flash.go { animation:pkFlash .7s ease-out; }
@keyframes pkFlash { 0% { opacity:.95; } 100% { opacity:0; } }

/* 首頁：今日卡包入口 */
.pk-daily { position:absolute; top:14px; right:16px; z-index:5; display:flex; align-items:center; gap:10px; padding:8px 14px 8px 8px; border:2px solid #123E35; border-radius:16px; background:#F4FAF7; cursor:pointer; font:800 14px/1.2 'Rubik','ResourceHanRoundedCN',sans-serif; color:#123E35; box-shadow:0 6px 22px rgba(18,62,53,.09); }
.pk-daily i { width:34px; height:44px; border:2px solid #123E35; border-radius:6px; background:linear-gradient(160deg,#8DF0D0,#0E8160); display:block; flex:none; }
.pk-daily small { display:block; font:600 11px/1.3 'Rubik','ResourceHanRoundedCN',sans-serif; color:#3D5A52; }
.pk-daily.ready { animation:pkGlow 1.6s ease-in-out infinite; }
.pk-daily.ready i { animation:pkWiggle 1.6s ease-in-out infinite; }
.pk-daily.done { background:#fff; color:#3D5A52; } .pk-daily.done i { filter:grayscale(.8); opacity:.7; } .pk-daily.done small { color:var(--text-muted); }
@keyframes pkGlow { 0%,100% { box-shadow:0 6px 22px rgba(18,62,53,.09), 0 0 0 0 rgba(117,240,205,.8); } 50% { box-shadow:0 6px 22px rgba(18,62,53,.09), 0 0 0 10px rgba(255,210,90,0); } }
@keyframes pkWiggle { 0%,100% { transform:rotate(-6deg); } 50% { transform:rotate(6deg); } }
@media (prefers-reduced-motion: reduce) { .pk-pack, .pk-hint, .pk-daily.ready, .pk-daily.ready i, .pk-body::after { animation:none; } }

@media (max-width: 900px) { .pk-daily { position: static; grid-column: 1 / -1; justify-self: start; } }

.pk-ov img { pointer-events: none; }
