[data-bh-gate] { position: relative; }
.bh-access-badge { display: inline-flex; align-items: center; align-self: flex-start; flex: none; width: fit-content; max-width: 100%; gap: .25em; vertical-align: middle; margin-inline-start: .35em; padding: .12em .45em; border: 1px solid #a8b5be; border-radius: .28rem; background: #eef3f5; font: 750 .65rem/1.4 system-ui, sans-serif; letter-spacing: .045em; text-transform: uppercase; color: #344b59; white-space: nowrap; }
.bh-access-badge::before { content: "🔒"; font-size: .85em; }
.bh-access-badge:is([data-tier="pro"], [data-bh-tier="pro"]) { border-color: #c6ad78; background: #fff5dd; color: #71551d; }
.bh-access-badge:is([data-tier="pro"], [data-bh-tier="pro"])::before { content: "🔒"; }
.bh-access-unavailable { opacity: .48 !important; filter: grayscale(1); }
:is(button, input, select, textarea, [role="button"], a).bh-access-unavailable { cursor: not-allowed !important; }
option.bh-access-unavailable { color: #808080; }
.bh-account-main { max-width: 46rem; margin: 3rem auto 5rem; padding: 0 1.25rem; }
.bh-account-main h1 { font-size: clamp(2rem, 5vw, 3.25rem); margin: .4rem 0 1.5rem; }
.bh-account-card { padding: clamp(1.25rem, 4vw, 2rem); border: 1px solid var(--bh-color-border, #d9d6cf); border-radius: 1rem; background: var(--bh-color-panel, #fff); }
.bh-account-card h2 { margin-top: 0; }
.bh-account-card p { line-height: 1.65; }
.bh-account-card [data-account-detail], .bh-account-help { color: var(--bh-color-muted, #52606a); }
.bh-account-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.bh-account-actions [hidden], [data-account-private][hidden] { display: none !important; }
.bh-account-help { margin-top: 1.5rem; font-size: .9rem; }
.bh-access-badge[hidden] { display: none; }
.bh-auth-slot { gap: .7rem; align-items: center; }
.bh-auth-join { display: inline-flex; align-items: center; min-height: 2.5rem; padding: .45rem .75rem; background: var(--bh-color-heading, #0f2b46); color: #fff !important; border-radius: .4rem; font-size: .78rem; font-weight: 750; text-decoration: none; white-space: nowrap; }
[data-bh-gate]:not([data-bh-gate-state]) [data-bh-gate-content] { visibility: hidden; }
[data-bh-gate]:not([data-bh-gate-state="unlocked"]) [data-bh-gate-content] {
  opacity: .46;
  pointer-events: none;
  user-select: none;
}
[data-bh-gate-action] { display: inline-flex; min-height: 2.75rem; align-items: center; margin-top: .45rem; }
[data-bh-gate-action][hidden] { display: none; }
.bh-gate-action {
  display: inline-flex;
  min-height: 2.5rem;
  align-items: center;
  justify-content: center;
  padding: .35rem .8rem;
  border: 1px solid var(--bh-color-border-strong, #9a8f80);
  border-radius: var(--bh-radius-sm, .45rem);
  background: var(--bh-color-panel, #fff);
  color: var(--bh-color-heading, #172838);
  font: 800 .78rem/1.2 var(--bh-font-ui, system-ui, sans-serif);
  text-decoration: none;
}
button.bh-gate-action { cursor: pointer; }
@media (prefers-reduced-motion: reduce) {
  [data-bh-gate-content] { transition: none !important; }
}

:is(button,label).bh-access-unavailable[data-bh-required-tier]:not(:has(.bh-access-badge)):not(:has(+ [data-bh-access-badge]))::after { content: "🔒 " attr(data-bh-required-tier); display: inline-block; vertical-align: middle; margin-inline-start: .45em; padding: .12em .4em; border: 1px solid #a8b5be; border-radius: .28rem; background: #eef3f5; color: #344b59; text-transform: uppercase; letter-spacing: .045em; font: 750 .65rem/1.4 system-ui, sans-serif; }
:is(button,label).bh-access-unavailable[data-bh-required-tier="Pro"]:not(:has(.bh-access-badge)):not(:has(+ [data-bh-access-badge]))::after { content: "🔒 Pro"; border-color: #c6ad78; background: #fff5dd; color: #71551d; }

.bh-access-unavailable .bh-access-unavailable { opacity: 1 !important; filter: none; }

/* Keep access boundaries and muted unavailable controls unchanged. */
.bh-access-badge { border-color: #96aab8; background: #edf3f7; color: #294b63; }
.bh-access-badge:is([data-tier="pro"], [data-bh-tier="pro"]) { border-color: #b49a62; background: #fff3d5; color: #64460f; }
.bh-account-card { border-color: #c8d4de; box-shadow: 0 5px 22px rgb(15 43 70 / .055); }
.bh-account-card [data-plan-tier="pro"] { color: #285b4d; }
.bh-auth-join { box-shadow: 0 1px 2px rgb(15 43 70 / .1); }
.bh-auth-join:hover { background: #244864; }
.bh-auth-join:focus-visible, .bh-gate-action:focus-visible { outline: 2px solid #1672c4; outline-offset: 3px; }
.bh-gate-action:hover { border-color: #7894ac; background: #edf3f7; }

/* Old protected packages emit these containers before notifying BHAccess.
   Keep them out of flow even during the same event that opens the modal. */
:is(#line-access-notice,#soc-access-notice,#ingredients-access-notice,#outline-access-notice,#trainer-access-notice,#contrary-access-notice,#display-access-notice) { display: none !important; }
dialog.bh-access-modal {
  position: fixed; inset: 0; margin: auto; width: min(28rem, calc(100vw - 2rem));
  max-width: calc(100vw - 2rem); max-height: calc(100dvh - 2rem); box-sizing: border-box;
  padding: 1.5rem; border: 1px solid #a9becb; border-radius: 14px;
  background: #f8fbfd; color: #173247; box-shadow: 0 16px 60px #071c3655;
  font: 400 15px/1.55 system-ui, sans-serif; text-align: left; overflow: auto;
}
dialog.bh-access-modal:not([open]) { display: none !important; }
dialog.bh-access-modal::backdrop { background: #07152599; }
dialog.bh-access-modal h2 { margin: 0 2rem .75rem 0; color: #102d44; font: 750 1.3rem/1.25 system-ui, sans-serif; }
dialog.bh-access-modal p { margin: 0 0 1.25rem; color: #40566a; font: inherit; }
dialog.bh-access-modal .bh-access-close { position: absolute; top: .5rem; right: .5rem; min-width: 36px; min-height: 36px; padding: 0; border: 0; background: transparent; color: #40566a; font: 24px/1 system-ui, sans-serif; box-shadow: none; }
dialog.bh-access-modal :is(.bh-access-primary,.bh-access-alternatives) { display: flex; flex-wrap: wrap; gap: .65rem; }
dialog.bh-access-modal .bh-access-alternatives { margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid #d5e0e7; }
dialog.bh-access-modal .bh-access-alternatives[hidden] { display: none; }
dialog.bh-access-modal :is(.bh-access-primary,.bh-access-alternatives) > :is(a,button) { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; max-width: 100%; padding: .6rem .9rem; border: 1px solid #90aabf; border-radius: 7px; background: #edf3f7; color: #183d59; text-decoration: none; font: 650 .875rem/1.35 system-ui, sans-serif; white-space: normal; cursor: pointer; box-shadow: none; }
dialog.bh-access-modal .bh-access-primary > :first-child { background: #143d5a; color: #fff; border-color: #143d5a; }
dialog.bh-access-modal :is(a,button):focus-visible { outline: 3px solid #198acc; outline-offset: 2px; }

/* Floating explanations occupy no document flow and never dim their own CTA. */
.bh-access-region { position: relative; }
.bh-access-region > .bh-access-region-card {
  position: absolute; z-index: 3; left: 50%; top: min(9rem, 50%);
  transform: translate(-50%, -50%); box-sizing: border-box;
  width: calc(100% - 1.5rem); max-width: 17rem; padding: .9rem;
  border: 1px solid #91acbc; border-radius: 10px; background: #f8fbfd;
  box-shadow: 0 6px 22px #071c3633; color: #173247; text-align: center;
  font: 400 .875rem/1.45 system-ui, sans-serif;
}
.bh-access-region > .bh-access-region-card[hidden] { display: none !important; }
.bh-access-region-card strong { display: block; margin: 0 0 .65rem; color: #173247; font: 700 .9375rem/1.35 system-ui, sans-serif; }
.bh-access-region-card > :is(a,button) { display: inline-flex; align-items: center; justify-content: center; min-height: 38px; padding: .45rem .85rem; border: 1px solid #143d5a; border-radius: 6px; background: #143d5a; color: #fff; font: 700 .8125rem/1.3 system-ui, sans-serif; text-decoration: none; cursor: pointer; }
.bh-access-region-card > [hidden] { display: none !important; }
.bh-access-region-card > :is(a,button):focus-visible { outline: 3px solid #198acc; outline-offset: 3px; }

.bh-access-region-card > small { display: block; margin: -.25rem 0 .65rem; color: #40566a; font: 400 .75rem/1.4 system-ui, sans-serif; }