.pb-stage{--pb-a:#3ddc84;--pb-b:#ffb648;--pb-c:#5fd4ff;gap:var(--space-3);padding:var(--space-4);background:radial-gradient(70% 55% at 50% 58%, color-mix(in srgb, var(--accent) 20%, transparent), transparent 72%), linear-gradient(180deg, #03070540, #03070599), url(/assets/minigames/packs/cover-bg.webp) center 40% / cover, #061009;grid-template-rows:auto 1fr auto;display:grid;position:relative;overflow:hidden;container:pb/inline-size}.pb-rays{z-index:0;pointer-events:none;opacity:.16;background:repeating-conic-gradient(from 0deg, color-mix(in srgb, var(--accent) 50%, transparent) 0deg 7deg, transparent 7deg 20deg);animation:46s linear infinite pb-spin;position:absolute;inset:-40%;-webkit-mask-image:radial-gradient(circle,#000 20%,#0000 62%);mask-image:radial-gradient(circle,#000 20%,#0000 62%)}.pb-phase-shake .pb-rays{opacity:.32;animation-duration:6s}@keyframes pb-spin{to{transform:rotate(360deg)}}.pb-race{z-index:2;justify-self:center;gap:6px;width:100%;max-width:640px;display:grid;position:relative}.pb-race-row{--rc:var(--pb-b);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:box-shadow .3s, opacity .3s, transform .3s var(--ease-out);background:#06100b9e;border-radius:12px;grid-template-columns:minmax(0,92px) minmax(0,1fr) 64px;align-items:center;gap:8px;padding:5px 8px;display:grid;box-shadow:inset 0 0 0 1px #ffffff14}.pb-race-row:nth-child(3){--rc:var(--pb-c)}.pb-race-row.is-me{--rc:var(--pb-a);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--pb-a) 45%, transparent)}.pb-race-name{text-overflow:ellipsis;white-space:nowrap;color:var(--text-secondary);font-size:12px;font-weight:800;overflow:hidden}.pb-race-row.is-me .pb-race-name{color:var(--text-primary)}.pb-race-bar{background:#ffffff14;border-radius:99px;height:10px;position:relative;overflow:hidden}.pb-race-bar i{border-radius:inherit;background:linear-gradient(90deg, color-mix(in srgb, var(--rc) 55%, transparent), var(--rc));box-shadow:0 0 12px color-mix(in srgb, var(--rc) 60%, transparent);transition:width .9s cubic-bezier(.2,1,.3,1);position:absolute;inset:0 auto 0 0}.pb-race-row.is-lead .pb-race-bar i:after{content:"";border-radius:inherit;background:linear-gradient(90deg,#0000,#ffffff8c,#0000) 0 0/50% 100% no-repeat;animation:1.6s ease-in-out infinite pb-shine;position:absolute;inset:0}@keyframes pb-shine{0%{background-position:-60% 0}to{background-position:160% 0}}.pb-race-num{text-align:right;white-space:nowrap;color:var(--rc);transform-origin:100%;animation:pb-bump .45s var(--ease-out);font-size:15px;font-weight:900}@keyframes pb-bump{40%{transform:scale(1.25)}}.pb-race-row.is-won{box-shadow:inset 0 0 0 2px var(--rc), 0 0 22px color-mix(in srgb, var(--rc) 45%, transparent);transform:scale(1.02)}.pb-race-row.is-lost{opacity:.6}.pb-lanes{z-index:2;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;align-content:center;place-self:center;gap:6px;width:100%;max-width:760px;display:grid;position:relative}.pb-lane{min-width:0;transition:transform .35s var(--ease-out), opacity .35s, box-shadow .35s, filter .35s;background:linear-gradient(#ffffff12,#06100b8c);border-radius:16px;align-content:start;justify-items:center;gap:6px;padding:8px 4px;display:grid;box-shadow:inset 0 0 0 1px #ffffff17}.pb-lane.is-me{box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--pb-a) 70%, transparent)}.pb-seats-4 .pb-lane{border-top:3px solid var(--pb-b)}.pb-seats-4 .pb-lane.pb-team-0{border-top-color:var(--pb-c)}.pb-lane.is-edge{margin-left:8px}.pb-lane.is-won{box-shadow:inset 0 0 0 2px var(--accent), 0 0 26px color-mix(in srgb, var(--accent) 45%, transparent);animation:1.4s ease-in-out infinite pb-won;transform:translateY(-3px)}@keyframes pb-won{50%{box-shadow:inset 0 0 0 2px var(--accent), 0 0 40px color-mix(in srgb, var(--accent) 65%, transparent)}}.pb-lane.is-lost{opacity:.55;filter:saturate(.6)}.pb-lane-name{text-overflow:ellipsis;white-space:nowrap;max-width:100%;color:var(--text-secondary);align-items:center;gap:4px;font-size:12px;font-weight:800;display:inline-flex;overflow:hidden}.pb-lane.is-me .pb-lane-name{color:var(--text-primary)}.pb-lane-sum{color:var(--text-primary);font-size:18px;font-weight:900;line-height:1}.pb-lane.is-won .pb-lane-sum{color:var(--accent);text-shadow:0 0 14px color-mix(in srgb, var(--accent) 60%, transparent)}.pb-slot{place-items:center;width:100%;display:grid;position:relative}.pb-pack{aspect-ratio:3/4;place-items:center;width:22px;display:grid}.pb-pack.is-big{width:min(70%,120px)}.pb-pack-img{object-fit:contain;filter:drop-shadow(0 8px 16px #00000073);width:100%;height:100%}.pb-pack-draw{color:#08140d;background:linear-gradient(160deg,#fff3c4,#ffd36b 45%,#8a6a1c);border-radius:6px;place-items:center;width:100%;height:100%;font-size:12px;font-weight:900;display:grid}.pb-pack-elite .pb-pack-draw{background:linear-gradient(160deg,#c9ffe0,#3ddc84 45%,#0f6b3a)}.pb-pack-legend .pb-pack-draw{background:linear-gradient(160deg,#eedcff,#c792ff 45%,#5b2f8f)}.pb-pack-icon .pb-pack-draw{background:linear-gradient(160deg,#fff,#e7e0c9 45%,#8f8566)}.pb-pack-live .pb-pack-draw{color:#fff;background:linear-gradient(160deg,#ffd0d0,#ff6b6b 45%,#8a1f1f)}.pb-opening{place-items:center;width:100%;display:grid;position:relative}.pb-opening.is-wait{animation:2.6s ease-in-out infinite pb-float}@keyframes pb-float{50%{transform:translateY(-5px)rotate(-1.5deg)}}.pb-phase-shake .pb-opening{animation:.75s cubic-bezier(.3,0,.6,1) both pb-shake}@keyframes pb-shake{0%{transform:scale(1)}15%{transform:scale(1.04)rotate(-4deg)}30%{transform:scale(1.06)rotate(4deg)}45%{transform:scale(1.08)rotate(-5deg)}60%{transform:scale(1.1)rotate(5deg)}80%{filter:brightness(1.8);transform:scale(1.16)rotate(0)}to{opacity:0;filter:brightness(2.4);transform:scale(.4)}}.pb-flash{pointer-events:none;opacity:0;background:radial-gradient(circle, #fff 0 10%, color-mix(in srgb, var(--accent) 70%, #fff) 30%, transparent 62%);position:absolute;inset:-30%}.pb-phase-shake .pb-flash{animation:.75s ease-out both pb-flash}@keyframes pb-flash{0%,70%{opacity:0;transform:scale(.5)}85%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.3)}}.pb-card{perspective:700px;place-items:center;animation:.6s cubic-bezier(.2,1.25,.4,1) both pb-card-in;display:grid;position:relative}.pb-card:before{content:"";z-index:-1;background:radial-gradient(circle, color-mix(in srgb, var(--pk-c) 70%, transparent), transparent 70%);filter:blur(14px);border-radius:30%;animation:2.4s ease-in-out infinite pb-halo;position:absolute;inset:4%}@keyframes pb-card-in{0%{opacity:0;transform:rotateY(90deg)scale(.5)}}@keyframes pb-halo{0%,to{opacity:.65;transform:scale(.94)}50%{opacity:1;transform:scale(1.06)}}.pb-card.is-drawn{width:calc(var(--pb-card) * .72);aspect-ratio:3/4;background:linear-gradient(160deg, color-mix(in srgb, var(--pk-c) 70%, #fff) 0%, var(--pk-c) 40%, color-mix(in srgb, var(--pk-c) 40%, #000) 100%);border-radius:12px;align-content:center;gap:2px;box-shadow:0 12px 26px #00000080,inset 0 0 0 2px #ffffff59}.pb-card.is-drawn b{font-size:calc(var(--pb-card) * .26);color:#08140d;font-weight:900;line-height:1}.pb-card.is-drawn small{color:#08140dcc;text-transform:uppercase;letter-spacing:.04em;text-overflow:ellipsis;white-space:nowrap;max-width:92%;font-size:12px;font-weight:900;overflow:hidden}.pb-mult{z-index:3;white-space:nowrap;color:#08140d;background:var(--pk-c);box-shadow:0 0 16px color-mix(in srgb, var(--pk-c) 70%, transparent);border-radius:99px;padding:2px 8px;font-size:14px;font-weight:900;animation:.5s cubic-bezier(.2,1.4,.4,1) both pb-mult;position:absolute;bottom:-2px;left:50%;translate:-50%}@keyframes pb-mult{0%{opacity:0;transform:scale(.2)}}.pb-strip{flex-wrap:wrap;justify-content:center;gap:3px;display:flex}.pb-strip i{opacity:.55;background:#ffffff0f;border-radius:6px;place-items:center;min-width:24px;height:24px;padding:0 2px;font-size:12px;font-style:normal;font-weight:900;line-height:1;display:grid}.pb-strip i .pb-pack{width:16px}.pb-strip i.is-open{opacity:1;color:#08140d;background:var(--pk-c);animation:pb-pip .4s var(--ease-out)}@keyframes pb-pip{0%{transform:scale(1.8)}}.pb-strip i.is-now{opacity:1;box-shadow:inset 0 0 0 1.5px var(--accent);animation:.5s ease-in-out infinite alternate pb-now}@keyframes pb-now{to{transform:translateY(-2px)}}.pb-tip{z-index:2;text-align:center;min-height:20px;font-size:var(--text-sm);color:var(--text-secondary);margin:0;font-weight:700;position:relative}.pb-stage.is-done .pb-tip{color:var(--text-primary)}@media (prefers-reduced-motion:reduce){.pb-rays,.pb-race-num,.pb-race-bar i:after,.pb-lane,.pb-opening,.pb-flash,.pb-card,.pb-card:before,.pb-mult,.pb-strip i{animation:none!important}}@media (max-width:520px){.pb-stage{gap:var(--space-2);padding:var(--space-3)}.pb-race-row{gap:6px;padding:4px 6px}.pb-race-num{font-size:14px}.pb-lanes{gap:4px}.pb-lane{border-radius:12px;padding:6px 2px}.pb-lane.is-edge{margin-left:4px}.pb-lane-sum{font-size:15px}.pb-race-row{grid-template-columns:minmax(0,100px) minmax(0,1fr) 56px}.pb-mult{padding:1px 6px;font-size:12px}}.pb-modes{margin-bottom:var(--space-3);background:var(--surface);box-shadow:var(--ring);border-radius:14px;gap:6px;width:fit-content;max-width:100%;padding:4px;display:flex}.pb-modes a{font-size:var(--text-sm);color:var(--text-secondary);border-radius:10px;padding:8px 14px;font-weight:800;text-decoration:none;transition:background .2s,color .2s}.pb-modes a.is-on{color:#08140d;background:var(--accent);box-shadow:0 0 14px color-mix(in srgb, var(--accent) 45%, transparent)}@container pb (max-width:479px){.pb-seats-4 .pb-lanes{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row;row-gap:14px}.pb-seats-4 .pb-lane.is-edge{margin-left:0}.pb-seats-4 .pb-lane:nth-child(3):before{content:"VS";z-index:3;color:#08140d;background:var(--accent);border-radius:99px;padding:2px 8px;font-size:12px;font-weight:900;position:absolute;top:-14px;left:calc(100% + 3px);translate:-50% -50%}.pb-seats-4 .pb-lane{position:relative}}@media (max-width:520px){.pvp-stage-wrap:has(.pb-seats-3,.pb-seats-4) .pvp-players{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.pvp-stage-wrap:has(.pb-seats-3) .pvp-players{grid-template-columns:repeat(3,minmax(0,1fr))}.pvp-stage-wrap:has(.pb-seats-3,.pb-seats-4) .pvp-player{text-align:center;flex-direction:column;gap:4px;padding:6px 4px}.pvp-stage-wrap:has(.pb-seats-3,.pb-seats-4) .pvp-player-name{align-items:center;max-width:100%;font-size:12px}}
