/*
 * Beat Outlaws premium style-pack foundation.
 *
 * Ninety-nine premium packs share an intentionally small structural language:
 * 18 desktop layouts, 12 comment grammars and 12 navigation/chrome grammars.
 * Each pack combines those pieces with its own accessible palette, full-page
 * motif, typography, shape system and lightweight JS flourish. Mobile always
 * collapses to one predictable reading column.
 */

.bo-stylepack-premium {
  --bo-pack-nav-bg: var(--bo-pack-surface);
  --bo-pack-nav-text: var(--bo-pack-text);
  --bo-pack-footer-bg: var(--bo-pack-bg);
  --bo-pack-footer-text: var(--bo-pack-text);
  --bo-pack-on-accent: #fff;
  --bo-pack-avatar-radius: calc(var(--bo-pack-radius) * .8);
  --bo-pack-page-pattern: none;
  --bo-pack-pattern-size: auto;
  --bo-pack-card-tilt: 0deg;
  --bo-fx-color: var(--bo-pack-accent);
  --bo-fx-color-2: var(--bo-pack-accent-2);
  --bo-fx-count: 14;
  --bo-fx-speed: 9s;
}

body:has(.bo-stylepack-premium) {
  background: var(--bo-pack-bg);
  color: var(--bo-pack-text);
}

body:has(.bo-stylepack-premium) main.py-5 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  background: var(--bo-pack-bg);
}

body:has(.bo-stylepack-premium) .page__content {
  min-height: 70vh;
  background-color: var(--bo-pack-bg);
}

body:has(.bo-stylepack-premium) .page__content::before {
  opacity: .98;
  background-image: var(--bo-pack-page-pattern);
  background-size: var(--bo-pack-pattern-size);
  background-attachment: fixed;
}

body:has(.bo-stylepack-premium) .page__content::after {
  background:
    radial-gradient(circle at var(--bo-pack-page-glow-x, 50%) var(--bo-pack-page-glow-y, 16%), color-mix(in srgb, var(--bo-pack-accent) 10%, transparent), transparent 34%),
    linear-gradient(90deg, color-mix(in srgb, var(--bo-pack-bg) 82%, transparent), transparent 16% 84%, color-mix(in srgb, var(--bo-pack-bg) 82%, transparent));
}

body:has(.bo-stylepack-premium) .page__content > .container {
  position: relative;
  z-index: 1;
  max-width: 100%;
  padding-inline: clamp(.75rem, 2vw, 2rem);
}

.bo-stylepack-premium,
.bo-stylepack-premium .bo-stylepack-user__header,
.bo-stylepack-premium .bo-stylepack-user__social,
.bo-stylepack-premium .bo-stylepack-user__intro,
.bo-stylepack-premium .bo-stylepack-user__wall,
.bo-stylepack-premium .bo-stylepack-performer__content,
.bo-stylepack-premium .bo-stylepack-performer__added-by,
.bo-stylepack-premium .bo-stylepack-performer__social,
.bo-stylepack-premium .bo-stylepack-performer__wall {
  color: var(--bo-pack-text);
}

.bo-stylepack-premium .bo-stylepack-user__header,
.bo-stylepack-premium .bo-stylepack-user__social,
.bo-stylepack-premium .bo-stylepack-user__intro,
.bo-stylepack-premium .bo-stylepack-user__wall,
.bo-stylepack-premium .bo-stylepack-performer__content,
.bo-stylepack-premium .bo-stylepack-performer__added-by,
.bo-stylepack-premium .bo-stylepack-performer__social,
.bo-stylepack-premium .bo-stylepack-performer__wall {
  border-color: var(--bo-pack-line);
  background: color-mix(in srgb, var(--bo-pack-surface) 96%, transparent);
  box-shadow: var(--bo-pack-shadow);
}

.bo-stylepack-premium .bo-stylepack-user__header,
.bo-stylepack-premium .bo-stylepack-performer__content {
  transform: rotate(var(--bo-pack-card-tilt));
}

.bo-stylepack-premium .bo-stylepack-user__avatar,
.bo-stylepack-premium .bo-stylepack-user__avatar img {
  border-radius: var(--bo-pack-avatar-radius);
}

.bo-stylepack-premium :where(h1,h2,h3,h4,.field__label,.bo-profile-member-for__label) {
  color: var(--bo-pack-heading);
  font-family: var(--bo-pack-heading-font);
  text-shadow: none;
}

.bo-stylepack-premium :where(p,li,.field__item,.bo-comment__body,.bo-comment__time,.bo-comment__authorline) {
  color: var(--bo-pack-text);
  font-family: var(--bo-pack-font);
  text-shadow: none;
}

.bo-stylepack-premium a,
.bo-stylepack-premium .bo-comment__actions a,
.bo-stylepack-premium .bo-comment__permalink a,
.bo-stylepack-premium .bo-comment__thread-toggle {
  color: var(--bo-pack-accent);
  text-shadow: none;
}

.bo-stylepack-premium a:hover,
.bo-stylepack-premium a:focus-visible {
  color: var(--bo-pack-accent-2);
}

.bo-stylepack-premium :where(a,button,input,textarea,select):focus-visible {
  outline: 3px solid var(--bo-pack-accent);
  outline-offset: 3px;
}

.bo-stylepack-premium .bo-profile-account-link,
.bo-stylepack-premium .bo-stylepack-user__utility-action :where(a,button,input[type="submit"]),
.bo-stylepack-premium .beat-social-profile-controls :where(a,button),
.bo-stylepack-premium .button:not(.button--primary) {
  border-color: var(--bo-pack-line);
  background: var(--bo-pack-surface-2);
  color: var(--bo-pack-accent);
}

.bo-stylepack-premium .button--primary,
.bo-stylepack-premium input[type="submit"].button--primary {
  border-color: var(--bo-pack-accent);
  background: var(--bo-pack-accent);
  color: var(--bo-pack-on-accent);
}

/* Keep third-party cards legible. They retain their own light surface instead
 * of inheriting a dark pack's prose color. */
.bo-stylepack-premium :where(.bo-link-card,.bo-media-card,.bo-soundcloud-card,.bo-embed-card) {
  color: #20242a;
}

/* Full page chrome. The top blue utility bar lives outside these selectors. */
body:has(.bo-stylepack-premium) .page > nav.navbar {
  border-bottom: 2px solid var(--bo-pack-line);
  background: var(--bo-pack-nav-bg);
  color: var(--bo-pack-nav-text);
  box-shadow: 0 8px 24px color-mix(in srgb, var(--bo-pack-bg) 34%, transparent);
}

body:has(.bo-stylepack-premium) .page > nav.navbar :where(.nav-link,.navbar-brand) {
  color: var(--bo-pack-nav-text);
  font-family: var(--bo-pack-heading-font);
  text-shadow: none;
}

body:has(.bo-stylepack-premium) .page > nav.navbar .nav-link:hover,
body:has(.bo-stylepack-premium) .page > nav.navbar .nav-link:focus-visible {
  color: var(--bo-pack-accent);
}

body:has(.bo-stylepack-premium) .page > nav.navbar .navbar-brand__logo img {
  border: 2px solid var(--bo-pack-line);
  border-radius: calc(var(--bo-pack-radius) * .7);
  box-shadow: 0 4px 16px color-mix(in srgb, var(--bo-pack-accent) 18%, transparent);
}

body:has(.bo-stylepack-premium) header.page__header {
  border-bottom: 1px solid var(--bo-pack-line);
  background: var(--bo-pack-nav-bg);
  color: var(--bo-pack-nav-text);
}

body:has(.bo-stylepack-premium) header.page__header :where(.page-title,h1,h2) {
  color: var(--bo-pack-nav-text);
  font-family: var(--bo-pack-heading-font);
  text-shadow: none;
}

body:has(.bo-stylepack-premium) .page__footer {
  border-top: 2px solid var(--bo-pack-line);
  background: var(--bo-pack-footer-bg);
  color: var(--bo-pack-footer-text);
}

body:has(.bo-stylepack-premium) .page__footer :where(p,div,li,span,strong,em) {
  color: var(--bo-pack-footer-text);
}

body:has(.bo-stylepack-premium) .page__footer a {
  color: var(--bo-pack-accent);
  font-weight: 700;
}

body:has(.bo-stylepack-premium) .page__footer .bo-user-nav {
  border-color: var(--bo-pack-line);
  background: var(--bo-pack-surface-2);
}

/* Navigation grammars -------------------------------------------------- */
body:has(.bo-stylepack-chrome--underline) .page > nav.navbar .nav-link { border-bottom: 3px solid transparent; }
body:has(.bo-stylepack-chrome--underline) .page > nav.navbar .nav-link:hover { border-bottom-color: var(--bo-pack-accent); }
body:has(.bo-stylepack-chrome--boxed) .page > nav.navbar .nav-link { margin:.2rem; border:1px solid var(--bo-pack-line); padding:.35rem .7rem; }
body:has(.bo-stylepack-chrome--tabs) .page > nav.navbar .nav-link { margin-top:.35rem; border-radius:10px 10px 0 0; background:var(--bo-pack-surface-2); }
body:has(.bo-stylepack-chrome--rail) .page > nav.navbar { border-top:4px solid var(--bo-pack-accent); border-bottom:4px solid var(--bo-pack-accent-2); }
body:has(.bo-stylepack-chrome--minimal) .page > nav.navbar { box-shadow:none; border-bottom-width:1px; }
body:has(.bo-stylepack-chrome--marquee) .page > nav.navbar { box-shadow: inset 0 -4px 0 var(--bo-pack-accent), inset 0 -7px 0 var(--bo-pack-accent-2); }
body:has(.bo-stylepack-chrome--deco) .page > nav.navbar::after { content:"◆  ◆  ◆"; margin-left:auto; color:var(--bo-pack-accent); letter-spacing:.7em; font-size:.7rem; }
body:has(.bo-stylepack-chrome--terminal) .page > nav.navbar .nav-link { text-transform:uppercase; letter-spacing:.08em; border-left:1px solid var(--bo-pack-line); }
body:has(.bo-stylepack-chrome--pill) .page > nav.navbar .nav-link { margin:.15rem; border-radius:999px; padding:.36rem .72rem; background:var(--bo-pack-surface-2); }
body:has(.bo-stylepack-chrome--poster) .page > nav.navbar .nav-link { text-transform:uppercase; font-weight:900; letter-spacing:.04em; }
body:has(.bo-stylepack-chrome--gallery) .page > nav.navbar { padding-block:.35rem; }
body:has(.bo-stylepack-chrome--gallery) .page > nav.navbar .nav-link { font-family:var(--bo-pack-font); letter-spacing:.06em; }
body:has(.bo-stylepack-chrome--lounge) .page > nav.navbar .container { max-width:980px; }

/* Comment grammars ----------------------------------------------------- */
.bo-stylepack-premium .bo-comment {
  border: 1px solid var(--bo-pack-line);
  border-radius: calc(var(--bo-pack-radius) * .72);
  background: var(--bo-pack-surface-2);
  color: var(--bo-pack-text);
}

.bo-stylepack-premium .bo-comment__time,
.bo-stylepack-premium .bo-comment__audience,
.bo-stylepack-premium .bo-comment__meta-actions { color:var(--bo-pack-muted); }

.bo-stylepack-comments--bubble .bo-comment { border-radius:24px 24px 24px 5px; margin-block:.55rem; }
.bo-stylepack-comments--ticket .bo-comment { border-left:6px solid var(--bo-pack-accent); border-right:2px dashed var(--bo-pack-line); border-radius:4px; }
.bo-stylepack-comments--terminal .bo-comment { border-radius:0; border-left:3px solid var(--bo-pack-accent); font-family:"Courier New",monospace; }
.bo-stylepack-comments--ledger .bo-comment { border-radius:0; border-width:0 0 1px 4px; background:transparent; }
.bo-stylepack-comments--placard .bo-comment { border-radius:2px; box-shadow:4px 5px 0 color-mix(in srgb,var(--bo-pack-line) 70%,transparent); }
.bo-stylepack-comments--quote .bo-comment { border-width:0 0 0 5px; border-radius:0; background:color-mix(in srgb,var(--bo-pack-surface-2) 82%,transparent); }
.bo-stylepack-comments--tape .bo-comment { border-radius:1px; transform:rotate(-.08deg); }
.bo-stylepack-comments--tape .bo-comment:nth-child(even) { transform:rotate(.08deg) translateX(.35rem); }
.bo-stylepack-comments--glass .bo-comment { background:color-mix(in srgb,var(--bo-pack-surface-2) 86%,transparent); backdrop-filter:blur(7px); }
.bo-stylepack-comments--postcard .bo-comment { border-radius:4px 14px 4px 14px; border-top:4px solid var(--bo-pack-accent-2); }
.bo-stylepack-comments--manuscript .bo-comment { border-width:1px 1px 1px 7px; border-radius:0; }
.bo-stylepack-comments--panel .bo-comment { border-radius:calc(var(--bo-pack-radius) * .35); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--bo-pack-accent) 14%,transparent); }
.bo-stylepack-comments--ribbon .bo-comment { border-radius:12px; border-top:5px solid var(--bo-pack-accent); border-bottom:5px solid var(--bo-pack-accent-2); }

/* Desktop structural vocabulary --------------------------------------- */
@media (min-width:1100px) {
  .bo-stylepack-premium { position:relative; left:50%; transform:translateX(-50%); width:min(1360px,calc(100vw - 2rem)); max-width:none; }
  .bo-stylepack-premium.bo-stylepack-user { display:grid; gap:1rem; align-items:start; }
  .bo-stylepack-premium .bo-stylepack-user__header { margin:0; }
  .bo-stylepack-premium .bo-stylepack-user__intro { margin:0; min-width:0; grid-column:1 / -1; }
  .bo-stylepack-premium .bo-stylepack-user__social { margin:0; }
  .bo-stylepack-premium .bo-stylepack-user__wall { margin:0; min-width:0; }

  .bo-stylepack-layout--sidecar-left.bo-stylepack-user { grid-template-columns:minmax(280px,360px) minmax(0,1fr); grid-template-areas:"head wall" "intro wall" "social wall"; }
  .bo-stylepack-layout--sidecar-left .bo-stylepack-user__header { grid-area:head; grid-template-columns:1fr; position:sticky; top:5.2rem; }
  .bo-stylepack-layout--sidecar-left .bo-stylepack-user__intro { grid-area:intro; grid-column:auto; }
  .bo-stylepack-layout--sidecar-left .bo-stylepack-user__social { grid-area:social; }
  .bo-stylepack-layout--sidecar-left .bo-stylepack-user__wall { grid-area:wall; }

  .bo-stylepack-layout--sidecar-right.bo-stylepack-user { grid-template-columns:minmax(0,1fr) minmax(280px,360px); grid-template-areas:"wall head" "wall intro" "wall social"; }
  .bo-stylepack-layout--sidecar-right .bo-stylepack-user__header { grid-area:head; grid-template-columns:1fr; position:sticky; top:5.2rem; }
  .bo-stylepack-layout--sidecar-right .bo-stylepack-user__intro { grid-area:intro; grid-column:auto; }
  .bo-stylepack-layout--sidecar-right .bo-stylepack-user__social { grid-area:social; }
  .bo-stylepack-layout--sidecar-right .bo-stylepack-user__wall { grid-area:wall; }

  .bo-stylepack-layout--hero-centered.bo-stylepack-user { width:min(1180px,calc(100vw - 2rem)); grid-template-columns:1fr; }
  .bo-stylepack-layout--hero-centered .bo-stylepack-user__header { width:min(900px,88%); margin-inline:auto; text-align:center; }
  .bo-stylepack-layout--hero-centered .bo-stylepack-user__header { grid-template-columns:minmax(180px,280px) minmax(0,1fr); }
  .bo-stylepack-layout--hero-centered .bo-stylepack-user__social { width:min(760px,76%); margin-inline:auto; }

  .bo-stylepack-layout--split-header.bo-stylepack-user { grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr); grid-template-areas:"head social" "intro intro" "wall wall"; }
  .bo-stylepack-layout--split-header .bo-stylepack-user__header { grid-area:head; }
  .bo-stylepack-layout--split-header .bo-stylepack-user__social { grid-area:social; min-height:100%; display:flex; align-items:flex-end; }
  .bo-stylepack-layout--split-header .bo-stylepack-user__intro { grid-area:intro; grid-column:auto; }
  .bo-stylepack-layout--split-header .bo-stylepack-user__wall { grid-area:wall; }

  .bo-stylepack-layout--editorial-offset.bo-stylepack-user { grid-template-columns:repeat(12,1fr); }
  .bo-stylepack-layout--editorial-offset .bo-stylepack-user__header { grid-column:1 / 8; grid-row:1; }
  .bo-stylepack-layout--editorial-offset .bo-stylepack-user__social { grid-column:8 / 13; grid-row:1; margin-top:2rem; }
  .bo-stylepack-layout--editorial-offset .bo-stylepack-user__intro { grid-column:2 / 12; grid-row:2; }
  .bo-stylepack-layout--editorial-offset .bo-stylepack-user__wall { grid-column:2 / 13; grid-row:3; }

  .bo-stylepack-layout--poster-stack.bo-stylepack-user { width:min(900px,calc(100vw - 2rem)); grid-template-columns:1fr; }
  .bo-stylepack-layout--poster-stack .bo-stylepack-user__header { border-width:3px; grid-template-columns:minmax(230px,340px) 1fr; }
  .bo-stylepack-layout--poster-stack .bo-stylepack-user__social { width:72%; margin-left:auto; }

  .bo-stylepack-layout--dashboard.bo-stylepack-user { grid-template-columns:2fr 1fr; grid-template-areas:"head social" "intro intro" "wall wall"; }
  .bo-stylepack-layout--dashboard .bo-stylepack-user__header { grid-area:head; }
  .bo-stylepack-layout--dashboard .bo-stylepack-user__social { grid-area:social; height:100%; }
  .bo-stylepack-layout--dashboard .bo-stylepack-user__intro { grid-area:intro; grid-column:auto; }
  .bo-stylepack-layout--dashboard .bo-stylepack-user__wall { grid-area:wall; }

  .bo-stylepack-layout--gallery.bo-stylepack-user { width:min(1450px,calc(100vw - 2rem)); }
  .bo-stylepack-layout--gallery .bo-stylepack-user__header { grid-template-columns:minmax(280px,420px) minmax(0,1fr); }
  .bo-stylepack-layout--gallery .bo-stylepack-user__wall { width:min(1120px,86%); margin-inline:auto; }

  .bo-stylepack-layout--terminal.bo-stylepack-user { width:min(1500px,calc(100vw - 1rem)); }
  .bo-stylepack-layout--terminal :where(.bo-stylepack-user__header,.bo-stylepack-user__intro,.bo-stylepack-user__social,.bo-stylepack-user__wall) { border-radius:0; box-shadow:none; }
  .bo-stylepack-layout--terminal .bo-stylepack-user__header { grid-template-columns:220px minmax(0,1fr); }

  .bo-stylepack-layout--lounge.bo-stylepack-user { width:min(980px,calc(100vw - 2rem)); }
  .bo-stylepack-layout--lounge .bo-stylepack-user__header { width:88%; margin-inline:auto; }
  .bo-stylepack-layout--lounge .bo-stylepack-user__social { width:72%; margin-inline:auto; }

  .bo-stylepack-layout--stage.bo-stylepack-user { width:min(1480px,calc(100vw - 1rem)); }
  .bo-stylepack-layout--stage .bo-stylepack-user__header { width:min(1080px,82%); margin-inline:auto; }
  .bo-stylepack-layout--stage .bo-stylepack-user__social { width:min(980px,72%); margin-inline:auto; }
  .bo-stylepack-layout--stage .bo-stylepack-user__wall { width:min(1180px,88%); margin-inline:auto; }

  .bo-stylepack-layout--rail-top.bo-stylepack-user { grid-template-columns:1fr 1fr; grid-template-areas:"head head" "intro intro" "social wall"; }
  .bo-stylepack-layout--rail-top .bo-stylepack-user__header { grid-area:head; grid-template-columns:200px 1fr; }
  .bo-stylepack-layout--rail-top .bo-stylepack-user__intro { grid-area:intro; grid-column:auto; }
  .bo-stylepack-layout--rail-top .bo-stylepack-user__social { grid-area:social; position:sticky; top:5.2rem; }
  .bo-stylepack-layout--rail-top .bo-stylepack-user__wall { grid-area:wall; }

  .bo-stylepack-layout--album-sleeve.bo-stylepack-user { width:min(1120px,calc(100vw - 2rem)); }
  .bo-stylepack-layout--album-sleeve .bo-stylepack-user__header { grid-template-columns:minmax(320px,46%) minmax(0,1fr); align-items:center; }
  .bo-stylepack-layout--album-sleeve .bo-stylepack-user__social { width:62%; margin-left:auto; }

  .bo-stylepack-layout--floating-card.bo-stylepack-user { width:min(1320px,calc(100vw - 2rem)); }
  .bo-stylepack-layout--floating-card .bo-stylepack-user__header { width:min(760px,64%); margin-left:4%; }
  .bo-stylepack-layout--floating-card .bo-stylepack-user__social { width:min(520px,46%); margin-left:auto; margin-right:5%; }
  .bo-stylepack-layout--floating-card .bo-stylepack-user__wall { width:90%; margin-inline:auto; }

  .bo-stylepack-layout--wide-canvas.bo-stylepack-user { width:min(1540px,calc(100vw - .75rem)); }
  .bo-stylepack-layout--wide-canvas .bo-stylepack-user__header { width:74%; }
  .bo-stylepack-layout--wide-canvas .bo-stylepack-user__social { width:42%; margin-left:auto; }

  .bo-stylepack-layout--column-shift.bo-stylepack-user { grid-template-columns:180px minmax(0,1fr); grid-template-areas:"social head" "social intro" ". wall"; }
  .bo-stylepack-layout--column-shift .bo-stylepack-user__header { grid-area:head; }
  .bo-stylepack-layout--column-shift .bo-stylepack-user__intro { grid-area:intro; grid-column:auto; }
  .bo-stylepack-layout--column-shift .bo-stylepack-user__social { grid-area:social; position:sticky; top:5.2rem; }
  .bo-stylepack-layout--column-shift .bo-stylepack-user__wall { grid-area:wall; }

  .bo-stylepack-layout--profile-banner.bo-stylepack-user { width:min(1420px,calc(100vw - 1.5rem)); }
  .bo-stylepack-layout--profile-banner .bo-stylepack-user__header { grid-template-columns:220px 1fr; border-radius:0; border-left-width:8px; border-right-width:8px; }
  .bo-stylepack-layout--profile-banner .bo-stylepack-user__social { width:54%; margin-left:auto; }

  .bo-stylepack-layout--asymmetric-duo.bo-stylepack-user { grid-template-columns:repeat(10,1fr); }
  .bo-stylepack-layout--asymmetric-duo .bo-stylepack-user__header { grid-column:1 / 7; grid-row:1; }
  .bo-stylepack-layout--asymmetric-duo .bo-stylepack-user__social { grid-column:7 / 11; grid-row:1; align-self:end; }
  .bo-stylepack-layout--asymmetric-duo .bo-stylepack-user__intro { grid-column:2 / 10; grid-row:2; }
  .bo-stylepack-layout--asymmetric-duo .bo-stylepack-user__wall { grid-column:2 / 11; grid-row:3; }

  /* Performer pages reuse the same vocabulary without reordering fields. */
  .bo-stylepack-premium.bo-stylepack-performer { width:min(1360px,calc(100vw - 2rem)); }
  .bo-stylepack-layout--sidecar-left.bo-stylepack-performer .field--name-field-images,
  .bo-stylepack-layout--album-sleeve.bo-stylepack-performer .field--name-field-images { float:left; width:min(44%,520px); margin:0 1.5rem 1rem 0; }
  .bo-stylepack-layout--sidecar-right.bo-stylepack-performer .field--name-field-images,
  .bo-stylepack-layout--dashboard.bo-stylepack-performer .field--name-field-images { float:right; width:min(44%,520px); margin:0 0 1rem 1.5rem; }
  .bo-stylepack-layout--stage.bo-stylepack-performer,
  .bo-stylepack-layout--wide-canvas.bo-stylepack-performer { width:min(1500px,calc(100vw - 1rem)); }
  .bo-stylepack-layout--poster-stack.bo-stylepack-performer,
  .bo-stylepack-layout--lounge.bo-stylepack-performer { width:min(940px,calc(100vw - 2rem)); }
}

@media (max-width:1099.98px) {
  .bo-stylepack-premium { left:auto; width:100%; max-width:var(--bo-pack-max); transform:none; display:block; }
  .bo-stylepack-premium .bo-stylepack-user__header,
  .bo-stylepack-premium .bo-stylepack-user__intro,
  .bo-stylepack-premium .bo-stylepack-user__social,
  .bo-stylepack-premium .bo-stylepack-user__wall { width:100%; margin-inline:0; transform:none; position:relative; top:auto; }
  body:has(.bo-stylepack-premium) .page__content::before { background-attachment:scroll; }
}

/* Lightweight effect layers ------------------------------------------- */
.bo-pack-fx-layer { position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.bo-pack-fx-particle { position:absolute; left:var(--x); top:var(--y); width:var(--size,6px); height:var(--size,6px); border-radius:50%; background:var(--bo-fx-color); opacity:.35; box-shadow:0 0 14px color-mix(in srgb,var(--bo-fx-color) 55%,transparent); animation:boPremiumFloat var(--duration,var(--bo-fx-speed)) ease-in-out var(--delay,0s) infinite alternate; }
.bo-pack-fx-particle:nth-child(3n) { background:var(--bo-fx-color-2); }
.bo-pack-fx--stars .bo-pack-fx-particle { width:2px; height:2px; opacity:.8; }
.bo-pack-fx--snow .bo-pack-fx-particle { background:#fff; box-shadow:none; opacity:.7; animation-name:boPremiumFall; }
.bo-pack-fx--embers .bo-pack-fx-particle { border-radius:40% 60% 60% 40%; animation-name:boPremiumRise; }
.bo-pack-fx--bubbles .bo-pack-fx-particle { background:transparent; border:1px solid var(--bo-fx-color); box-shadow:inset 0 0 8px color-mix(in srgb,var(--bo-fx-color) 35%,transparent); }
.bo-pack-fx--dust .bo-pack-fx-particle { width:3px; height:3px; opacity:.28; box-shadow:none; }
.bo-pack-fx-orbit { position:absolute; width:min(48vw,560px); aspect-ratio:1; border:1px solid color-mix(in srgb,var(--bo-fx-color) 30%,transparent); border-radius:50%; left:50%; top:12%; transform:translateX(-50%); animation:boPremiumOrbit calc(var(--bo-fx-speed) * 2) linear infinite; }
.bo-pack-fx-orbit::before,.bo-pack-fx-orbit::after { content:""; position:absolute; width:9px; height:9px; border-radius:50%; background:var(--bo-fx-color); box-shadow:0 0 18px var(--bo-fx-color); }
.bo-pack-fx-orbit::before { left:10%; top:18%; } .bo-pack-fx-orbit::after { right:8%; bottom:22%; background:var(--bo-fx-color-2); }
.bo-pack-fx-signal { position:absolute; z-index:1; left:0; right:0; top:var(--signal-y,30%); height:2px; pointer-events:none; background:linear-gradient(90deg,transparent,var(--bo-fx-color),var(--bo-fx-color-2),transparent); opacity:.32; animation:boPremiumSignal var(--bo-fx-speed) linear infinite; }
.bo-pack-fx-ripple { position:absolute; width:12px; height:12px; margin:-6px; border:2px solid var(--bo-fx-color); border-radius:50%; pointer-events:none; animation:boPremiumRipple .8s ease-out forwards; }
.bo-pack-fx-spark { position:absolute; width:4px; height:4px; border-radius:50%; background:var(--bo-fx-color); pointer-events:none; box-shadow:0 0 10px var(--bo-fx-color); animation:boPremiumSpark .65s ease-out forwards; }
.bo-stylepack-premium.bo-pack-fx-pulse .bo-stylepack-user__header,
.bo-stylepack-premium.bo-pack-fx-pulse .bo-stylepack-performer__content { animation:boPremiumPulse var(--bo-fx-speed) ease-in-out infinite; }

@keyframes boPremiumFloat { to { transform:translate3d(14px,-18px,0); opacity:.7; } }
@keyframes boPremiumFall { from { transform:translateY(-30px); } to { transform:translateY(420px); } }
@keyframes boPremiumRise { from { transform:translateY(40px) scale(.7); opacity:.15; } to { transform:translateY(-180px) scale(1.2); opacity:.72; } }
@keyframes boPremiumOrbit { to { transform:translateX(-50%) rotate(360deg); } }
@keyframes boPremiumSignal { 0% { transform:translateY(-160px); opacity:0; } 20% { opacity:.35; } 80% { opacity:.35; } 100% { transform:translateY(520px); opacity:0; } }
@keyframes boPremiumRipple { to { width:120px; height:120px; margin:-60px; opacity:0; } }
@keyframes boPremiumSpark { to { transform:translate(var(--dx,18px),var(--dy,-26px)) scale(.2); opacity:0; } }
@keyframes boPremiumPulse { 50% { box-shadow:0 0 0 1px var(--bo-pack-line),0 0 28px color-mix(in srgb,var(--bo-pack-accent) 18%,transparent); } }

@media (prefers-reduced-motion:reduce) {
  .bo-pack-fx-layer,.bo-pack-fx-orbit,.bo-pack-fx-signal,.bo-pack-fx-ripple,.bo-pack-fx-spark { display:none !important; }
  .bo-stylepack-premium.bo-pack-fx-pulse :where(.bo-stylepack-user__header,.bo-stylepack-performer__content) { animation:none !important; }
}
