.pc-anim-stage { --pc-anim-ink:#2a0904; --pc-anim-gold:#fbbf30; --pc-anim-cream:#fcf8f4; --pc-anim-red:#fa3f59; --pc-anim-blue:#1898fc; position:relative; width:100%; min-height:280px; overflow:hidden; isolation:isolate; border-radius:24px; background:#fcf8f4; color:#2a0904; }
.pc-anim-stage *, .pc-anim-stage *::before, .pc-anim-stage *::after { box-sizing:border-box; }
.pc-anim-scene { position:absolute; inset:0; min-height:280px; overflow:hidden; font-family:Arial,"Microsoft JhengHei",sans-serif; }
.pc-anim-halo { position:absolute; width:260px; height:260px; left:calc(50% - 130px); top:8px; border-radius:50%; background:radial-gradient(circle,rgba(251,191,48,.38) 0,rgba(251,191,48,.1) 60%,transparent 72%); }
.pc-anim-orbit { position:absolute; width:216px; height:216px; left:calc(50% - 108px); top:24px; border:1px dashed rgba(251,191,48,.6); border-radius:50%; }
.pc-anim-orbit-b { width:248px; height:248px; left:calc(50% - 124px); top:8px; border-style:solid; border-color:rgba(251,191,48,.16); }
.pc-anim-topline { position:absolute; left:0; right:0; top:14px; text-align:center; color:#79593d; font-size:12px; font-weight:700; letter-spacing:.12em; z-index:8; }
.pc-anim-caption { position:absolute; left:0; right:0; top:35px; text-align:center; font-size:17px; line-height:1.3; z-index:8; }
.pc-anim-card, .pc-anim-ghost { position:absolute; left:50%; top:64px; width:116px; height:144px; border:3px solid #2a0904; border-radius:18px; transform:translate(-50%,0); }
.pc-anim-ghost { background:#fbbf30; opacity:0; box-shadow:0 8px 0 rgba(42,9,4,.1); }
.pc-anim-card { z-index:4; background:#fbbf30; box-shadow:0 8px 0 rgba(42,9,4,.12),0 12px 24px rgba(42,9,4,.08); transform-origin:50% 60%; }
.pc-anim-card-border { position:absolute; inset:6px; border:1px solid rgba(42,9,4,.3); border-radius:11px; }
.pc-anim-card-back, .pc-anim-card-front { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; flex-direction:column; }
.pc-anim-card-mark { display:grid; place-items:center; width:65px; height:65px; margin-top:-8px; background:#fcf8f4; border:2px solid #2a0904; border-radius:50%; font-size:48px; font-weight:900; line-height:1; }
.pc-anim-card-word { position:absolute; bottom:14px; font-size:8px; font-weight:900; letter-spacing:.1em; }
.pc-anim-card-front { opacity:0; gap:5px; padding:12px 8px; justify-content:flex-start; }
.pc-anim-result-symbol { width:36px; height:36px; display:grid; place-items:center; background:#fcf8f4; border:2px solid #2a0904; border-radius:50%; font-size:26px; line-height:1; font-weight:900; }
.pc-anim-result-label { font-size:18px; letter-spacing:.04em; line-height:1.25; }
.pc-anim-result-class { font-size:10px; line-height:1; opacity:.78; }
.pc-anim-result-note { display:none; }
.pc-anim-mascot { position:absolute; left:50%; bottom:0; width:min(210px,70%); transform:translate(-50%,0); z-index:6; pointer-events:none; }
.pc-anim-mascot img { display:block; width:100%; height:auto; filter:drop-shadow(0 4px 0 rgba(42,9,4,.08)); }
.pc-anim-particle { position:absolute; left:calc(50% - 7px); top:114px; color:#fbbf30; font-size:21px; z-index:7; opacity:0; pointer-events:none; }
.pc-anim-p2, .pc-anim-p5 { color:#ef4c7c; font-size:17px; }
.pc-anim-p3, .pc-anim-p6 { color:#1898fc; font-size:25px; }
.pc-anim-lightning { position:absolute; top:57px; font-size:79px; color:#fa3f59; opacity:0; z-index:3; line-height:1; }
.pc-anim-lightning-left { left:calc(50% - 112px); }
.pc-anim-lightning-right { right:calc(50% - 112px); }
.pc-anim-stamp { position:absolute; top:109px; left:50%; transform:translate(-50%,-50%) rotate(-14deg); border:3px solid #fa3f59; border-radius:6px; padding:3px 9px; background:#2a0904; color:#fa3f59; font-size:26px; font-weight:900; letter-spacing:.1em; z-index:9; opacity:0; box-shadow:0 0 0 4px rgba(252,248,244,.6); }
.pc-anim-stage[data-pc-anim-mode="forced"] { background:#351810; }
.pc-anim-stage[data-pc-anim-mode="forced"] .pc-anim-halo { background:radial-gradient(circle,rgba(250,63,89,.34),rgba(250,63,89,.12) 57%,transparent 72%); }
.pc-anim-stage[data-pc-anim-mode="forced"] .pc-anim-orbit { border-color:rgba(250,63,89,.38); }
.pc-anim-stage[data-pc-anim-mode="forced"] .pc-anim-topline { color:#fcf8f4; font-size:13px; letter-spacing:.2em; }
.pc-anim-stage[data-pc-anim-mode="forced"] .pc-anim-caption { color:#fcf8f4; }
.pc-anim-stage[data-pc-anim-mode="forced"] .pc-anim-card { background:#fa3f59; border-color:#fcf8f4; box-shadow:0 8px 0 #1d0c07,0 0 32px rgba(250,63,89,.18); }
.pc-anim-stage[data-pc-anim-mode="forced"] .pc-anim-ghost { background:#792735; border-color:#fa3f59; }
.pc-anim-stage[data-pc-anim-mode="forced"] .pc-anim-card-border { border-color:rgba(252,248,244,.45); }
.pc-anim-stage[data-pc-anim-mode="forced"] .pc-anim-card-back .pc-anim-card-word { color:#fcf8f4; }
.pc-anim-stage[data-pc-anim-mode="forced"] .pc-anim-mascot img { filter:drop-shadow(0 0 7px rgba(252,248,244,.14)); }
.pc-anim-revealed .pc-anim-card-back { opacity:0; }
.pc-anim-revealed .pc-anim-card-front { opacity:1; }
.pc-anim-stage[data-pc-anim-result="small_penalty"] .pc-anim-revealed .pc-anim-card { background:#1898fc; }
.pc-anim-stage[data-pc-anim-result="large_penalty"] .pc-anim-revealed .pc-anim-card { background:#fa3f59; }
.pc-anim-complete .pc-anim-card, .pc-anim-cancelled .pc-anim-card { transform:translate(-50%,0); opacity:1; }
.pc-anim-complete .pc-anim-mascot, .pc-anim-cancelled .pc-anim-mascot { transform:translate(-50%,0); }
.pc-anim-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (prefers-reduced-motion:reduce) { .pc-anim-stage * { animation:none !important; transition:none !important; } }