#battlepass-open{position:fixed;right:128px;top:calc(128px + env(safe-area-inset-top));z-index:12;min-height:44px;padding:10px 14px;border:1px solid #e8d09b;border-radius:14px;background:#143446ec;color:#f4e2ac;font-weight:bold;cursor:pointer;touch-action:manipulation}
body.front-open #battlepass-open,body.kit-open #battlepass-open,body.bp-open #battlepass-open,body.hud-blocked #battlepass-open,body.touch #battlepass-open{display:none!important}
#battle-pass[hidden]{display:none}
#battle-pass{position:fixed;inset:0;z-index:1150;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;box-sizing:border-box;padding:0 0 48px;background:#071018;color:#f6eed7;-webkit-overflow-scrolling:touch}
.bp-hero-banner{position:relative;min-height:180px;overflow:hidden;background:linear-gradient(120deg,#0b2430 0%,#1a3d4f 35%,#3a2a12 70%,#0b1c28 100%);border-bottom:1px solid #fbbf2444}
.bp-hero-glow{position:absolute;inset:-20% -10% auto;height:140%;background:radial-gradient(ellipse at 30% 40%,#5eead466 0%,transparent 55%),radial-gradient(ellipse at 75% 30%,#fbbf2455 0%,transparent 50%);pointer-events:none}
.bp-hero-copy{position:relative;max-width:1100px;margin:0 auto;padding:36px 20px 28px}
.bp-hero-copy small{letter-spacing:4px;color:#fde68a;font-weight:bold}
.bp-hero-copy h1{font:800 clamp(40px,7vw,72px) Georgia,serif;margin:8px 0;color:#fff4d0;text-shadow:0 6px 30px #0008,0 0 40px #fbbf2444}
.bp-hero-copy p{color:#cfe8df;max-width:520px}
.bp-header{display:flex;justify-content:space-between;gap:14px;max-width:1100px;margin:18px auto 0;padding:0 16px;align-items:flex-start}
.bp-header h1{font:700 clamp(24px,4vw,36px) Georgia,serif;margin:6px 0;color:#ffe6ad}
.bp-header-actions{display:flex;gap:8px;flex-wrap:wrap}
#battle-pass button{min-height:44px;border:1px solid #d7bc78;border-radius:12px;background:linear-gradient(#e9d497,#bda66e);color:#142b36;font-weight:bold;padding:10px 12px;cursor:pointer;touch-action:manipulation}
#battle-pass button:disabled{opacity:.55;cursor:default}
#battle-pass button:focus-visible{outline:3px solid #78e9e3;outline-offset:3px}
#bp-jump{background:#1f3b4a;color:#e7f6f0;border-color:#5eead4}
.bp-status{max-width:1100px;margin:14px auto 8px;padding:12px 16px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center;border:1px solid #e4ce9266;border-radius:16px;background:#0a1a29cc}
.bp-status strong{color:#ffe6ad;font-size:18px;display:block}
.bp-xp{color:#a8e3d2;font-size:12px}
.bp-countdown{font:bold 17px ui-monospace,Menlo,monospace;color:#a8e3d2}
.bp-track-glow{max-width:1100px;margin:0 auto 14px;padding:0 16px}
.bp-bar{position:relative;height:16px;border-radius:999px;background:#132836;border:1px solid #e4ce9244;overflow:visible}
.bp-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#5eead4,#fbbf24,#fde68a);box-shadow:0 0 18px #5eead488}
.bp-bar-glow{position:absolute;top:50%;width:22px;height:22px;margin:-11px 0 0 -11px;border-radius:50%;background:#fff8d6;box-shadow:0 0 18px 6px #fbbf24cc;pointer-events:none}
.bp-premium-row{max-width:1100px;margin:0 auto 16px;padding:14px 16px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center;border:1px solid #fbbf2466;border-radius:16px;background:linear-gradient(135deg,#3a2a12cc,#1a2430ee)}
.bp-premium-row b{color:#fde68a}#bp-buy{background:#2a3340;color:#fde68a;border-color:#fbbf24}
.bp-finale{max-width:1100px;margin:0 auto 18px;padding:16px;display:grid;grid-template-columns:180px 1fr;gap:16px;align-items:center;border:1px solid #fbbf2488;border-radius:22px;background:radial-gradient(circle at 20% 30%,#fbbf2433,transparent 55%),linear-gradient(135deg,#2a1d0fcc,#102433ee)}
.bp-finale h2{margin:8px 0;color:#ffe6ad;font:700 26px Georgia,serif}
.bp-finale-parts{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.bp-finale-parts figure{margin:0;width:88px;text-align:center}
.bp-finale-parts figcaption{font-size:10px;color:#e7d3a0;margin-top:4px}
.bp-tracks{max-width:1100px;margin:0 auto;padding:0 12px;display:flex;flex-direction:column;gap:8px}
.bp-tier{display:grid;grid-template-columns:48px 1fr 1fr;gap:8px;align-items:stretch;padding:10px;border-radius:16px;border:1px solid #e4ce9240;background:#0d2130cc}
.bp-tier.reached{border-color:#5eead466;box-shadow:0 0 0 1px #5eead422}
.bp-tier-num{display:flex;align-items:center;justify-content:center;font:700 18px Georgia,serif;color:#ffe6ad;background:#17394b;border-radius:12px}
.bp-free,.bp-prem{display:grid;grid-template-columns:72px 1fr;gap:8px;align-items:center;padding:8px;border-radius:14px;background:#122838;border:1px solid transparent}
.bp-meta{display:flex;flex-direction:column;gap:4px;min-width:0}
.bp-free small{color:#86efac;letter-spacing:1px;font-size:10px}
.bp-prem small{color:#fbbf24;letter-spacing:1px;font-size:10px}
.bp-free b,.bp-prem b{font-size:13px;color:#f3ebd4;line-height:1.25}
.bp-preview{position:relative;width:72px;height:72px;border-radius:16px;overflow:hidden;background:#143044;border:2px solid #64748b88;box-shadow:inset 0 0 12px #0006}
.bp-preview img{width:100%;height:100%;object-fit:cover;display:block}
.bp-preview.big{width:160px;height:160px;border-radius:22px;border-width:3px}
.bp-preview.rarity-common{border-color:#94a3b8}.bp-free.rarity-common,.bp-prem.rarity-common{box-shadow:inset 0 0 0 1px #94a3b833}
.bp-preview.rarity-rare{border-color:#38bdf8}.bp-free.rarity-rare,.bp-prem.rarity-rare{box-shadow:inset 0 0 0 1px #38bdf855}
.bp-preview.rarity-epic{border-color:#a78bfa}.bp-free.rarity-epic,.bp-prem.rarity-epic{box-shadow:inset 0 0 0 1px #a78bfa66}
.bp-preview.rarity-legendary,.bp-preview.limited{border-color:#fbbf24;box-shadow:0 0 16px #fbbf2444, inset 0 0 10px #fbbf2222}
.bp-prem.rarity-legendary,.bp-prem.limited,.bp-tier.has-limited{border-color:#fbbf2466}
.bp-shine{pointer-events:none;position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,#ffffff55 48%,transparent 60%);transform:translateX(-120%)}
.bp-preview.limited .bp-shine,.bp-preview.rarity-legendary .bp-shine{animation:bp-shine 2.8s ease-in-out infinite}
@keyframes bp-shine{0%,55%{transform:translateX(-130%)}80%,100%{transform:translateX(130%)}}
@media (prefers-reduced-motion:reduce){.bp-preview .bp-shine{animation:none!important;display:none}.bp-bar-glow{box-shadow:0 0 8px 2px #fbbf2488}}
.bp-limited-badge{display:inline-block;padding:3px 10px;border-radius:999px;background:linear-gradient(#fbbf24,#d97706);color:#1c1408;font:bold 10px system-ui;letter-spacing:1px;text-transform:uppercase;width:max-content}
.bp-limited-cd{font-size:11px;color:#fde68a}.bp-never{font-size:11px;color:#fca5a5;font-weight:bold}
.bp-prem.limited{background:linear-gradient(180deg,#3a2a1688,#122838)}
#bp-message{text-align:center;max-width:900px;margin:16px auto;color:#bfece3;padding:0 12px}
@media(max-width:720px){
  .bp-hero-copy{padding:28px 14px 22px}
  .bp-header,.bp-status,.bp-premium-row,.bp-finale,.bp-track-glow{margin-left:10px;margin-right:10px;padding-left:12px;padding-right:12px}
  .bp-tracks{padding:0 8px}
  .bp-tier{grid-template-columns:1fr;gap:8px}
  .bp-finale{grid-template-columns:1fr}
  .bp-preview.big{width:100%;max-width:220px;height:220px;margin:0 auto}
  .bp-tier-num{min-height:40px}
  #battle-pass button{min-height:48px}
}
