/* Full-width hub and standalone Celestial storefront. Shared by both entry points. */
body.bossfight-page { --bf-muted:#a4b1c5; --bf-gutter:clamp(18px,2.3vw,72px); background:#080e18; font-size:16px; }
.bossfight-page [hidden] { display:none!important; }
#bf-app { width:100%; max-width:none; min-height:calc(100dvh - 96px); padding:24px var(--bf-gutter) 72px; margin:0; }
#bf-bg { background:linear-gradient(#080e18eb,#080e18f8),url('../image/bossfight/arena_bossfight.webp') center/cover; }
/* Elemental light fills the viewport, including the shop and lower panels. */
body.bossfight-page { --bf-world-light:.38; --bf-world-rays:.18; --bf-light-period:18s; }
body[data-bf-tier="2"] { --bf-world-light:.58; --bf-world-rays:.36; --bf-light-period:16s; }
body[data-bf-tier="3"] { --bf-world-light:.8; --bf-world-rays:.65; --bf-light-period:14s; }
body[data-bf-tier="4"] { --bf-world-light:1; --bf-world-rays:1; --bf-light-period:12s; }
#bf-vignette {
 z-index:1; overflow:hidden; isolation:isolate;
 background:radial-gradient(ellipse at 50% -15%,color-mix(in srgb,var(--bf-accent) 34%,transparent),transparent 62%),
 radial-gradient(ellipse at 50% 120%,color-mix(in srgb,var(--bf-accent) 20%,transparent),transparent 58%);
 opacity:var(--bf-world-light); transition:opacity 1.2s ease;
}
#bf-vignette::before,#bf-vignette::after { content:""; position:absolute; pointer-events:none; }
#bf-vignette::before {
 inset:-12%;
 background:radial-gradient(ellipse at 3% 35%,color-mix(in srgb,var(--bf-accent) 58%,transparent),transparent 35%),
 radial-gradient(ellipse at 97% 75%,color-mix(in srgb,var(--bf-accent) 48%,transparent),transparent 38%),
 radial-gradient(ellipse at 70% 0%,color-mix(in srgb,var(--bf-accent) 28%,transparent),transparent 34%);
 animation:bf-world-tide var(--bf-light-period) ease-in-out infinite alternate;
}
#bf-vignette::after {
 inset:-25%; opacity:var(--bf-world-rays); transform-origin:50% 0%;
 background:repeating-conic-gradient(from 162deg at 50% -8%,transparent 0deg 8deg,color-mix(in srgb,var(--bf-accent) 19%,transparent) 10deg,transparent 13deg 24deg);
 mask-image:linear-gradient(#000,transparent 90%);
 animation:bf-world-rays calc(var(--bf-light-period) * 1.8) ease-in-out infinite alternate;
}
@keyframes bf-world-tide { from { transform:translate3d(-2%,-3%,0) scale(1); opacity:.68; } to { transform:translate3d(3%,4%,0) scale(1.08); opacity:1; } }
@keyframes bf-world-rays { from { transform:rotate(-7deg) scale(1); } to { transform:rotate(7deg) scale(1.07); } }
body.bf-vfx-paused #bf-vignette::before,body.bf-vfx-paused #bf-vignette::after,
body.bf-vfx-suspended #bf-vignette::before,body.bf-vfx-suspended #bf-vignette::after { animation-play-state:paused; }
@media (prefers-reduced-motion:reduce) { #bf-vignette { transition:none; } #bf-vignette::before,#bf-vignette::after { animation:none; } }
.bf-page-heading { margin-bottom:22px; }
.bf-page-heading h2 { font-size:clamp(30px,2.3vw,54px); }
.bf-eyebrow { display:block; font-size:11px; line-height:1.5; letter-spacing:.16em; }
.bf-season { font-size:12px; }
.bf-season>span:last-child { font-size:15px; }
.bf-tabs { gap:8px; margin:0 0 28px; padding:0; align-items:stretch; border-color:#ffffff20; scroll-margin-top:110px; }
.bf-tabs>button,.bf-tabs>button:first-child { padding:18px clamp(16px,1.8vw,42px); font-size:clamp(13px,.78vw,18px); font-weight:500; letter-spacing:.035em; text-transform:none; }
.bf-tabs>button:first-child { padding-left:0; padding-right:30px; }
.bf-cec { gap:10px; padding:8px 0 8px 20px; background:none; border:0; }
.bf-cec>span { font-size:10px; }
.bf-cec img { width:32px; height:32px; }
.bf-cec b { font-size:22px; font-weight:500; }
.bf-panel { padding:0; }
.bf-btn { padding:13px 20px; min-height:44px; border-radius:4px; font-size:13px; line-height:1.3; font-weight:600; letter-spacing:.015em; text-transform:none; }
.bf-btn:disabled { cursor:default; color:#97a2b2; background:#202936; border-color:#ffffff12; opacity:1; filter:none; box-shadow:none; }
.bf-btn-primary { background:linear-gradient(115deg,#f1d4a1,#c19b60); color:#21180d; }
.bf-btn-ghost { background:#ffffff06; color:#e4d0ae; border-color:#ad95613a; }
.bf-btn-ghost:hover:not(:disabled) { background:#cfb37a15; border-color:#c6aa7370; }
/* A large arena, a legible command panel and a horizontal tier progression. */
.bf-hero { grid-template-columns:minmax(0,1fr) clamp(310px,24vw,520px); border-radius:7px; }
.bf-stage { min-height:clamp(530px,57vh,860px); padding:clamp(26px,2.8vw,70px); }
/* Keep the complete artwork in frame at every stage aspect ratio.
   Scaling the image for the breathing effect would crop its top edge again. */
.bf-hero-art { display:flex; justify-content:flex-end; }
.bf-hero-art img { width:auto; max-width:100%; object-fit:contain; object-position:right top; animation:none; mask-image:linear-gradient(90deg,transparent,#000 12%); }
.bf-stage-shade { background:linear-gradient(90deg,#080f1ad9,#080f1a95 28%,#080f1a05 72%),linear-gradient(0deg,#080f1af0,transparent 55%,#080f1a60); }
.bf-kicker { font-size:12px; }
.bf-motion-toggle { padding:8px 12px; font-size:12px; }
.bf-hero-info { width:min(55%,650px); margin:clamp(50px,7vh,130px) 0 40px; }
.bf-element { font-size:11px; margin-bottom:15px; }
.bf-hero-info h1 { font-size:clamp(56px,5.4vw,132px); margin-bottom:18px; }
.bf-boss-title { font-size:clamp(20px,1.45vw,35px); color:color-mix(in srgb,var(--bf-accent) 75%,white); margin-bottom:20px; }
.bf-boss-desc { font-size:clamp(14px,.95vw,21px); line-height:1.7; max-width:40ch; color:#c1c9d5; margin-bottom:32px; }
.bf-ability-heading { font-size:11px; }
.bf-abilities { gap:12px; }
.bf-ability { width:clamp(50px,3.3vw,80px); height:clamp(50px,3.3vw,80px); border-radius:5px; }
.bf-ability i { font-size:13px; }
.bf-countdown span { font-size:13px; }
.bf-countdown b { font-size:clamp(20px,1.3vw,32px); }
.bf-stage-caption span { font-size:10px; }
.bf-stage-caption b { font-size:13px; }
.bf-hero-side { display:flex; grid-column:auto; padding:clamp(24px,2.3vw,54px); gap:24px; background:linear-gradient(145deg,#1a2533,#0d1521); }
.bf-challenge-heading h2 { font-size:clamp(25px,1.7vw,40px); margin-bottom:10px; }
.bf-challenge-heading p { font-size:clamp(13px,.85vw,18px); line-height:1.6; color:#a7b4c6; }
.bf-intel { grid-template-columns:1fr 1fr; border:0; border-top:1px solid #ffffff10; border-bottom:1px solid #ffffff10; margin:0; background:none; }
.bf-intel>div { padding:18px 0; }
.bf-intel>div:nth-child(even) { padding-left:12px; }
.bf-intel>div:nth-child(n+3) { border-top:1px solid #ffffff0c; }
.bf-intel>div+div::before { display:none; }
.bf-intel span { font-size:10px; letter-spacing:.07em; color:#95a4b9; }
.bf-intel strong { font-size:clamp(20px,1.4vw,32px); white-space:nowrap; }
.bf-intel small { font-size:10px; }
.bf-intel i { margin:0 6px; font-size:14px; }
.bf-intel-reward { gap:10px; }
.bf-intel-reward>img { width:32px; height:32px; }
.bf-intel-reward strong { font-size:20px; }
.bf-intel-reward small { display:block; margin:3px 0 0; font-size:9px; }
.bf-fight-card { gap:18px; }
.bf-boss-immunities { margin:0; color:var(--bf-accent,#f2c14e); font-size:12px; line-height:1.6; }
.bf-energy { gap:18px; }
.bf-energy>img { width:60px; height:60px; }
.bf-energy-label { font-size:11px; }
.bf-energy-stock strong { font-size:36px; }
.bf-energy-stock>span { font-size:18px; }
.bf-energy small { font-size:12px; }
.bf-fight-btn { min-height:60px; padding:20px; border-radius:4px; font-size:clamp(13px,.82vw,19px); background:linear-gradient(115deg,#f1d5a2,#c69e5d); }
.bf-fight-note { font-size:12px; line-height:1.6; }
.bf-next { padding-top:22px; gap:14px; }
.bf-next img { width:52px; height:52px; border-radius:4px; }
.bf-next small { font-size:10px; }
.bf-next strong { font-size:20px; }
.bf-next span { font-size:12px; }
.bf-progression { display:grid; grid-template-columns:240px minmax(0,1fr); gap:24px; align-items:center; padding:28px 0 34px; border-bottom:1px solid #ffffff15; margin-bottom:34px; }
.bf-progression-title h2 { font:400 24px/1.4 "AOW",Georgia,serif; margin:0; }
.bf-tiers { grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.bf-tier { flex-wrap:wrap; gap:14px; padding:22px; border-radius:5px; background:linear-gradient(110deg,#1a2431,#0d1623); }
.bf-tier-number { width:auto; font-size:clamp(30px,2vw,46px); }
.bf-tier-copy { gap:5px; }
.bf-tier-copy b { font-size:16px; }
.bf-tier-copy>span { font-size:13px; }
.bf-tier em { font-size:10px; }
/* Reward journey: visible contents, large icons and one clear state per stop. */
.bf-section-heading,.bf-store-section-title { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:0 0 24px; }
.bf-section-heading h2 { font:400 clamp(28px,2vw,44px)/1.3 "AOW",Georgia,serif; margin:0 0 10px; }
.bf-section-heading p { margin:0; font-size:15px; color:#a0aec2; line-height:1.6; }
.bf-subtabs { gap:6px; padding:5px; margin:0; background:#101925; border:1px solid #ffffff12; border-radius:5px; flex-shrink:0; }
.bf-subtabs button { display:flex; align-items:center; gap:8px; padding:12px 20px; background:none; border:1px solid transparent; border-radius:3px; color:#9aa9be; font-size:14px; }
.bf-subtabs button.is-active { color:#efd7a9; background:#c7a56c14; border-color:#c7a56c50; }
.bf-subtabs img { width:14px; height:14px; object-fit:contain; }
.bf-reward-overview { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) 230px; gap:32px; padding:28px 32px; margin-bottom:30px; border:1px solid #ffffff18; border-radius:6px; background:linear-gradient(110deg,#182230,#0d1521); align-items:center; }
.bf-record-head { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.bf-record-head>span:last-child { font-size:11px; color:#b7c3d4; }
.bf-record-value { font-size:clamp(28px,2.5vw,52px); color:#f0d6a3; font-weight:500; margin:5px 0 15px; }
.bf-record-value small { color:#8697ad; font-size:16px; font-weight:400; }
.bf-record .bf-progress { height:6px; margin:0; }
.bf-record p { font-size:12px; color:#93a3ba; line-height:1.6; margin:12px 0 0; }
.bf-record p b { color:#dbcfba; font-weight:500; }
.bf-loot-total { border-left:1px solid #ffffff12; padding-left:30px; }
.bf-loot-total>div { display:flex; gap:24px; flex-wrap:wrap; margin-top:18px; }
.bf-loot-item { display:flex; align-items:center; gap:12px; }
.bf-loot-item img { width:42px; height:42px; object-fit:contain; filter:drop-shadow(0 4px 10px #0006); }
.bf-loot-item strong { display:block; font-size:clamp(18px,1.2vw,27px); font-weight:500; font-variant-numeric:tabular-nums; }
.bf-loot-item span { display:block; color:#92a2b9; font-size:11px; margin-top:2px; }
.bf-claim-summary { display:flex; flex-direction:column; gap:16px; }
.bf-claim-summary>strong { font-size:28px; font-weight:500; color:#f0d6a3; }
.bf-claim-summary small { font-size:13px; color:#a5b3c8; font-weight:400; }
.bf-reward-road { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:14px; }
.bf-reward-stop { display:flex; flex-direction:column; border:1px solid #ffffff14; border-radius:5px; background:linear-gradient(160deg,#192333,#0e1723); padding:22px; position:relative; overflow:hidden; }
.bf-stop-index { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:26px; }
.bf-stop-index>span { font:400 16px "AOW",serif; color:#687c99; }
.bf-stop-index small { font-size:9px; letter-spacing:.07em; color:#8b9bb2; }
.bf-reward-stop header { padding-bottom:22px; border-bottom:1px solid #ffffff10; margin-bottom:20px; }
.bf-reward-stop header>strong { display:block; font-size:clamp(30px,2vw,44px); font-weight:400; line-height:1; color:#d8e1ee; }
.bf-reward-stop header small { font-size:16px; color:#7487a3; margin-left:2px; }
.bf-reward-stop header>span { display:block; color:#8f9fb6; font-size:12px; margin-top:10px; }
.bf-stop-loot { display:grid; gap:18px; margin-bottom:28px; }
.bf-reward-stop footer { margin-top:auto; min-height:45px; display:flex; align-items:center; }
.bf-reward-stop footer .bf-btn { width:100%; padding:12px 8px; font-size:12px; }
.bf-reward-stop.is-ready { border-color:#caaa6a66; background:linear-gradient(150deg,#8e70421e,#17202d 40%,#0d1521); }
.bf-reward-stop.is-ready::before { content:""; position:absolute; top:0; height:2px; left:20px; right:20px; background:#d4b171; box-shadow:0 0 18px #d4b17155; }
.bf-reward-stop.is-ready .bf-stop-index small,.bf-reward-stop.is-ready header>strong { color:#f0d4a0; }
.bf-reward-stop.is-claimed { background:#0f1823; }
.bf-reward-stop.is-claimed .bf-stop-index small,.bf-reward-collected { color:#8dbdaa; }
.bf-reward-collected { font-size:12px; }
.bf-reward-remaining { display:flex; gap:8px; align-items:center; font-size:11px; line-height:1.5; color:#8a9ab0; }
.bf-reward-remaining img { width:18px; height:18px; object-fit:contain; }
.bf-reward-remaining b { color:#bfccde; font-weight:500; }
.bf-victory-bonus { display:flex; align-items:center; gap:22px; padding:26px 30px; margin-top:26px; border:1px solid #c2a16b2a; background:linear-gradient(90deg,#79623b14,#111a26); border-radius:5px; }
.bf-victory-bonus>img { width:64px; height:64px; object-fit:contain; }
.bf-victory-bonus strong { font-weight:500; font-size:18px; color:#e7d1aa; }
.bf-victory-bonus p { color:#92a1b7; font-size:13px; margin:8px 0 0; }
.bf-weekly-coins { margin-left:auto; white-space:nowrap; padding-left:25px; border-left:1px solid #ffffff18; }
.bf-weekly-coins>span { display:block; font-size:12px; color:#96a6bd; }
.bf-weekly-coins b { display:block; margin-top:6px; font-size:32px; font-weight:500; }
.bf-weekly-coins small { font-size:16px; color:#7c8da7; }
/* Celestial boutique. Entire source illustrations are contained, never cropped. */
.bf-store-heading { display:flex; justify-content:space-between; align-items:center; gap:40px; padding:clamp(26px,2vw,50px) 0 36px; }
.bf-store-heading .bf-eyebrow { color:#b7a1d9; }
.bf-store-heading h2 { font:400 clamp(44px,3.5vw,80px)/1.15 "AOW",Georgia,serif; margin:0 0 16px; letter-spacing:-.035em; }
.bf-store-heading h2 em { font-style:normal; color:#e7cba0; }
.bf-store-heading p { font-size:clamp(15px,1vw,22px); color:#a9b5c9; margin:0; }
.bf-store-wallet { display:flex; gap:20px; align-items:center; padding:24px 30px; border:1px solid #d5b88535; border-radius:5px; background:radial-gradient(ellipse at 0%,#9f7c3920,transparent 80%),#131c2a; }
.bf-store-wallet>img { width:72px; height:72px; object-fit:contain; filter:drop-shadow(0 0 16px #d7b55f20); }
.bf-store-wallet span { color:#9fadc2; font-size:11px; letter-spacing:.12em; }
.bf-store-wallet strong { display:block; font-size:38px; font-weight:500; margin-top:4px; color:#eed1a0; }
.bf-store-wallet small { font-size:14px; font-weight:400; color:#c5b493; }
.bf-store-nav { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:16px 0; border-top:1px solid #ffffff13; border-bottom:1px solid #ffffff13; margin-bottom:34px; }
.bf-store-nav>div { display:flex; gap:8px; flex-wrap:wrap; }
.bf-store-nav button { padding:12px 18px; border:1px solid transparent; background:none; border-radius:4px; color:#9eacc2; font:14px "Outfit",sans-serif; cursor:pointer; }
.bf-store-nav button span { margin-left:12px; font-size:11px; color:#6f819c; }
.bf-store-nav button.is-active { background:#bba3de12; color:#e0cffa; border-color:#b39bcf35; }
.bf-store-refresh { color:#8e9db4; font-size:12px; }
.bf-store-refresh b { color:#cdd6e6; font-weight:500; margin-left:10px; }
.bf-store-section-title h3 { margin:0; font:400 clamp(25px,1.65vw,38px) "AOW",Georgia,serif; }
.bf-store-section-title p { color:#8f9fb6; font-size:13px; }
.bf-product-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:clamp(16px,1.1vw,30px); }
.bf-product { --rarity:#ac87df; min-width:0; display:flex; flex-direction:column; border:1px solid #aa88d546; border-radius:7px; overflow:hidden; background:linear-gradient(155deg,#252238,#101927 75%); transition:border-color .2s,box-shadow .2s; }
.bf-product:hover { border-color:#b59ae39c; box-shadow:0 10px 36px #0003; }
.bf-product.is-legendary { --rarity:#e6bc6f; border-color:#cfaa6475; background:linear-gradient(155deg,#352d20,#141c28 75%); }
.bf-product.is-legendary:hover { border-color:#e6bc6f; }
.bf-product>header { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:16px 20px; }
.bf-product .bf-rarity { color:var(--rarity); font-size:11px; font-weight:500; letter-spacing:.14em; }
.bf-product>header>span:last-child { font-size:9px; letter-spacing:.07em; color:#a6a6b8; }
.bf-product-art { position:relative; display:block; width:100%; padding:0; border:0; background:#080f1a; cursor:zoom-in; overflow:hidden; }
.bf-product-art>img { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:contain; }
.bf-product-art>span { display:block; padding:9px 10px; background:#0d1422; font-size:11px; color:#9eafc6; text-align:center; opacity:1; transition:color .2s; }
.bf-product-art:hover>span,.bf-product-art:focus-visible>span { opacity:1; }
.bf-product-info { padding:22px; display:flex; flex-direction:column; flex:1; }
.bf-product-hero { font-size:11px; color:#95a2b8; }
.bf-product-hero i { color:#536077; margin:0 7px; font-style:normal; }
.bf-product-info h3 { font:400 clamp(20px,1.3vw,30px)/1.4 "AOW",Georgia,serif; margin:10px 0 20px; }
.bf-product-price { display:flex; gap:9px; align-items:center; }
.bf-product-price>img { width:30px; height:30px; object-fit:contain; }
.bf-product-price strong { font-size:27px; font-weight:500; color:#f0d6a2; }
.bf-product-price>span { font-size:11px; color:#9aa9be; }
.bf-product-info>.bf-product-price { margin-top:auto; margin-bottom:20px; }
.bf-product-info>.bf-btn { width:100%; }
.bf-product.is-owned .bf-product-info>.bf-btn { color:#9cc6b6; }
.bf-store-supplies { margin-top:46px; }
.bf-supply-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.bf-supply { display:flex; align-items:center; flex-wrap:wrap; gap:22px; padding:28px; border:1px solid #ffffff16; border-radius:6px; background:linear-gradient(125deg,#1d293b,#101a29); }
.bf-supply-image { display:grid; place-items:center; flex:0 0 84px; height:100px; background:radial-gradient(#8671ab22,transparent 70%); }
.bf-supply-image>img { width:80px; height:80px; object-fit:contain; filter:drop-shadow(0 6px 14px #0005); }
.bf-supply-info { flex:1; min-width:140px; }
.bf-supply-info .bf-eyebrow { font-size:9px; color:#a0afc6; letter-spacing:.09em; }
.bf-supply h3 { font-size:18px; line-height:1.4; font-weight:500; margin:0 0 8px; }
.bf-supply p { font-size:12px; line-height:1.6; color:#94a5bf; margin:0; }
.bf-supply-pips { display:flex; gap:5px; margin-top:12px; }
.bf-supply-pips i { width:22px; height:3px; background:#ffffff0b; }
.bf-supply-pips i.is-available { background:#baa16b; }
.bf-supply-purchase { display:flex; align-items:center; justify-content:space-between; gap:18px; border-top:1px solid #ffffff10; padding-top:20px; flex:0 0 100%; }
.bf-supply-purchase .bf-btn { min-width:120px; }
.bf-store-footer { display:flex; align-items:center; gap:16px; margin-top:32px; padding:24px 0; border-top:1px solid #ffffff12; }
.bf-store-footer>img { width:30px; height:30px; object-fit:contain; }
.bf-store-footer p { font-size:13px; color:#98a7bf; line-height:1.7; }
.bf-store-footer>.bf-btn { margin-left:auto; flex-shrink:0; }
.bf-skin-dialog { position:fixed; inset:0; width:min(1600px,94vw); max-width:none; max-height:94dvh; padding:0; border:1px solid #d6b98465; border-radius:7px; background:#0a121e; color:#edf0f6; box-shadow:0 30px 100px #0009; overflow:auto; }
.bf-skin-dialog::backdrop { background:#020610e8; backdrop-filter:blur(12px); }
.bf-skin-full { display:block; width:100%; height:min(72dvh,900px); object-fit:contain; background:#050910; }
.bf-skin-close { position:absolute; top:16px; right:16px; display:flex; align-items:center; gap:15px; padding:10px 16px; border:1px solid #ffffff40; border-radius:4px; background:#0c1525e8; color:#eee; font-size:13px; cursor:pointer; }
.bf-skin-close span { font-size:24px; }
.bf-skin-dialog footer { display:flex; align-items:center; gap:28px; padding:24px 32px; }
.bf-skin-dialog h2 { margin:0; font:400 28px "AOW",Georgia,serif; }
.bf-skin-dialog .bf-product-price { margin-left:auto; }
.bf-track-head h2 { font-size:32px; }
.bf-track-head p { font-size:15px; }
.bf-top-reward,.bf-lb-row,.bf-history-card { padding:18px 22px; }
.bf-chip { font-size:14px; padding:7px 10px; }
.bf-chip img { width:26px; height:26px; }
@media (min-width:2200px) {
 .bf-stage { min-height:68vh; } .bf-hero-side { gap:34px; }
 .bf-product-info { padding:28px; } .bf-product-info>.bf-btn { min-height:54px; font-size:15px; }
 .bf-reward-stop { padding:26px; }
}
@media (max-width:1800px) {
 .bf-reward-road { grid-template-columns:repeat(4,minmax(0,1fr)); }
 .bf-stop-loot { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
 .bf-stop-loot .bf-loot-item { flex-direction:column; text-align:center; gap:8px; }
 .bf-stop-loot .bf-loot-item span { font-size:10px; }
 .bf-stop-index { margin-bottom:18px; }
 .bf-reward-stop header { display:flex; justify-content:space-between; align-items:center; gap:10px; }
 .bf-reward-overview { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
 .bf-claim-summary { grid-column:1/-1; flex-direction:row; align-items:center; justify-content:space-between; padding-top:20px; border-top:1px solid #ffffff12; }
 .bf-product-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .bf-progression { grid-template-columns:180px minmax(0,1fr); }
 .bf-tier { padding:18px; } .bf-tier em { flex:0 0 100%; margin-left:0; }
}
@media (max-width:1200px) {
 .bf-hero { grid-template-columns:minmax(0,1fr) 300px; }
 .bf-hero-side { padding:24px; gap:22px; }
 .bf-intel { grid-template-columns:1fr; }
 .bf-intel>div { padding:10px 0!important; display:flex; justify-content:space-between; align-items:center; gap:10px; }
 .bf-intel span { margin:0; } .bf-intel>div:nth-child(n+3) { border-top:0; }
 .bf-intel .bf-intel-reward { justify-content:flex-start; }
 .bf-intel-reward>div { display:flex; justify-content:space-between; align-items:center; gap:10px; flex:1; }
 .bf-intel-reward small { display:none; }
 .bf-hero-info { width:80%; } .bf-hero-info h1 { font-size:62px; } .bf-boss-desc { max-width:30ch; }
 .bf-progression { grid-template-columns:1fr; }
 .bf-progression-title { display:flex; align-items:center; gap:24px; }
 .bf-progression-title h2 { font-size:20px; } .bf-progression-title br { display:none; }
 .bf-progression-title .bf-eyebrow { margin:0; }
 .bf-store-wallet { padding:20px; } .bf-store-wallet>img { width:50px; height:50px; }
 .bf-store-wallet strong { font-size:30px; }
 .bf-supply-grid { gap:14px; } .bf-supply { padding:20px; gap:16px; }
 .bf-supply-purchase { align-items:flex-start; flex-direction:column; } .bf-supply-purchase>.bf-btn { width:100%; }
}
@media (max-width:950px) {
 body.bossfight-page { padding-top:68px; } #bf-app { padding-top:20px; }
 .bf-tabs { scroll-margin-top:70px; }
 .bf-tabs>button { padding:16px 12px; font-size:13px; } .bf-cec>span { display:none; }
 .bf-hero { grid-template-columns:1fr; } .bf-stage { min-height:560px; }
 .bf-hero-info { width:70%; margin-top:70px; }
 .bf-hero-side { display:grid; grid-template-columns:1fr 1fr; gap:24px; border-left:0; border-top:1px solid #bba17335; }
 .bf-challenge-heading { grid-column:1; grid-row:1; }
 .bf-intel { grid-column:1; grid-row:2; }
 .bf-fight-card { grid-column:2; grid-row:1/3; margin-top:0; justify-content:center; }
 .bf-hero-side .bf-next { grid-column:1/-1; grid-row:3; }
 .bf-reward-road { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .bf-section-heading { align-items:flex-start; flex-direction:column; }
 .bf-store-heading { gap:20px; } .bf-store-wallet { min-width:220px; }
 .bf-store-wallet strong small { display:block; } .bf-store-heading h2 { font-size:44px; }
 .bf-store-nav { align-items:flex-start; flex-direction:column; }
 .bf-product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .bf-supply-grid { grid-template-columns:1fr; } .bf-supply { flex-wrap:nowrap; }
 .bf-supply-purchase { flex:0 0 190px; border-top:0; padding:0 0 0 20px; border-left:1px solid #ffffff15; }
 .bf-store-footer { flex-wrap:wrap; }
}
@media (max-width:600px) {
 body.bossfight-page { --bf-gutter:16px; }
 .bf-page-heading { margin-bottom:14px; }
 .bf-page-heading .bf-eyebrow { font-size:8px; letter-spacing:.08em; }
 .bf-page-heading .bf-eyebrow span { margin:0 5px; } .bf-page-heading h2 { font-size:28px; }
 .bf-season { display:none; }
 .bf-tabs { display:grid; grid-template-columns:1fr 1fr; position:relative; gap:0; margin-bottom:20px; overflow:visible; }
 .bf-tabs>button,.bf-tabs>button:first-child { padding:14px 9px; font-size:13px; text-align:center; }
 .bf-cec { position:absolute; right:0; top:-52px; padding:0; margin:0; }
 .bf-cec img { width:26px; height:26px; } .bf-cec b { font-size:19px; } .bf-cec>span { display:none; }
 .bf-stage { min-height:650px; padding:24px 20px; }
 .bf-stage-shade { background:linear-gradient(0deg,#070e19 3%,#070e19e6 22%,#070e1985 52%,transparent 83%); }
 .bf-hero-art img { width:100%; object-position:center top; mask-image:none; }
 .bf-hero-info { width:100%; margin:190px 0 30px; }
 .bf-hero-info h1 { font-size:51px; } .bf-boss-title { font-size:22px; }
 .bf-boss-desc { font-size:14px; margin-bottom:24px; max-width:none; }
 .bf-element { font-size:9px; } .bf-kicker { font-size:10px; } .bf-motion-toggle { font-size:10px; }
 .bf-abilities { gap:8px; } .bf-ability { width:clamp(38px,10.8vw,46px); height:clamp(38px,10.8vw,46px); } .bf-ability-passive { margin-right:4px; }
 .bf-stage-caption span { font-size:8px; } .bf-stage-caption b { font-size:10px; } .bf-countdown span { font-size:11px; }
 .bf-hero-side { display:flex; padding:24px; }
 .bf-intel { grid-template-columns:1fr 1fr; }
 .bf-intel>div { display:block; padding:14px 0!important; }
 .bf-intel strong { display:block; margin-top:7px; font-size:21px; }
 .bf-intel .bf-intel-reward { display:flex; gap:8px; } .bf-intel-reward>div { display:block; }
 .bf-energy { justify-content:center; }
 .bf-progression { gap:18px; } .bf-progression-title { display:block; } .bf-progression-title .bf-eyebrow { margin-bottom:8px; }
 .bf-tiers { grid-template-columns:1fr 1fr; gap:10px; }
 .bf-tier { padding:16px; gap:10px; } .bf-tier-number { font-size:30px; }
 .bf-tier-copy b { font-size:14px; } .bf-tier-copy>span { font-size:11px; } .bf-tier em { font-size:9px; }
 .bf-section-heading h2 { font-size:29px; } .bf-section-heading p { font-size:14px; }
 .bf-subtabs { width:100%; flex-wrap:nowrap; } .bf-subtabs button { flex:1; justify-content:center; padding:10px 6px; font-size:12px; } .bf-subtabs img { width:11px; height:11px; }
 .bf-reward-overview { grid-template-columns:1fr; padding:22px; gap:24px; }
 .bf-record-value small { font-size:13px; } .bf-record-head { align-items:flex-start; } .bf-record-head>span:last-child { font-size:9px; }
 .bf-loot-total { border-left:0; padding:20px 0 0; border-top:1px solid #ffffff12; }
 .bf-loot-total>div { justify-content:space-between; gap:12px; }
 .bf-loot-total .bf-loot-item { flex-direction:column; text-align:center; gap:8px; }
 .bf-claim-summary { flex-direction:column; align-items:stretch; }
 .bf-reward-road { grid-template-columns:1fr; } .bf-reward-stop { padding:22px; }
 .bf-stop-index { margin-bottom:12px; }
 .bf-stop-loot .bf-loot-item { flex-direction:row; text-align:left; gap:8px; }
 .bf-stop-loot .bf-loot-item img { width:32px; height:32px; } .bf-stop-loot .bf-loot-item strong { font-size:17px; } .bf-stop-loot .bf-loot-item span { font-size:9px; }
 .bf-victory-bonus { padding:22px; gap:16px; flex-wrap:wrap; } .bf-victory-bonus>img { width:46px; height:46px; }
 .bf-victory-bonus>div:nth-child(2) { flex:1; min-width:190px; } .bf-victory-bonus strong { font-size:16px; }
 .bf-weekly-coins { border-left:0; border-top:1px solid #ffffff12; padding:16px 0 0; width:100%; display:flex; justify-content:space-between; align-items:center; } .bf-weekly-coins b { margin:0; }
 .bf-store-heading { padding:0 0 20px; flex-direction:column; align-items:stretch; gap:18px; }
 .bf-store-heading h2 { font-size:34px; margin-bottom:10px; } .bf-store-heading p { font-size:14px; line-height:1.6; }
 .bf-store-wallet { padding:12px; gap:12px; } .bf-store-wallet strong { font-size:28px; } .bf-store-wallet span { font-size:9px; } .bf-store-wallet strong small { display:inline; font-size:11px; } .bf-store-wallet>img { width:44px; height:44px; }
 .bf-store-nav { padding:12px 0; margin-bottom:22px; gap:12px; }
 .bf-store-nav>div { flex-wrap:nowrap; width:100%; overflow-x:auto; }
 .bf-store-nav button { padding:10px 9px; font-size:11px; white-space:nowrap; } .bf-store-nav button span { margin-left:6px; }
 .bf-store-refresh { font-size:11px; }
 .bf-store-section-title { display:block; margin-bottom:18px; } .bf-store-section-title h3 { font-size:26px; } .bf-store-section-title p { font-size:12px; margin:10px 0 0; }
 .bf-product-grid { grid-template-columns:1fr; gap:24px; }
 .bf-product-art>span { opacity:1; font-size:10px; }
 .bf-product-info { padding:22px; } .bf-product-info h3 { font-size:25px; } .bf-product-info>.bf-btn { min-height:48px; }
 .bf-supply { flex-wrap:wrap; } .bf-supply-image { flex-basis:64px; height:75px; } .bf-supply-image>img { width:64px; height:64px; }
 .bf-supply-purchase { flex:0 0 100%; border-left:0; border-top:1px solid #ffffff12; padding:18px 0 0; flex-direction:row; align-items:center; }
 .bf-supply-purchase>.bf-btn { width:auto; min-width:100px; }
 .bf-supply-purchase .bf-product-price { flex-wrap:wrap; gap:6px; } .bf-product-price>span { font-size:10px; }
 .bf-store-footer>.bf-btn { margin:0; width:100%; }
 .bf-skin-dialog { width:96vw; } .bf-skin-full { height:auto; max-height:65dvh; aspect-ratio:3/2; }
 .bf-skin-close { position:relative; top:auto; right:auto; margin:12px 12px 12px auto; }
 .bf-skin-dialog footer { padding:20px; flex-wrap:wrap; gap:16px; }
 .bf-skin-dialog footer>div:first-child { width:100%; } .bf-skin-dialog h2 { font-size:23px; }
 .bf-skin-dialog .bf-product-price { margin:0; } .bf-skin-dialog footer>.bf-btn { width:100%; }
 .bf-track-head { flex-wrap:wrap; } .bf-lb-row { padding:12px 8px; }
}