/* Scoped foundations: public storefront pages keep their existing design. */
:is(.account-body, .checkout-body, .guide-body) {
  color: var(--color-text);
  background: var(--color-bg);
  font-family: var(--font-body);
  line-height: var(--leading-normal);
  scrollbar-color: var(--color-border) var(--color-bg);
  overflow-x: visible;
}
:is(.account-body, .checkout-body, .guide-body)::after { content: none; }
:is(.account-body, .checkout-body, .guide-body) .card::before { content: none; }
:is(.account-body, .checkout-body, .guide-body) .account-page::before,
:is(.account-body, .checkout-body, .guide-body) .btn::after { content: none; }
:is(.account-body, .checkout-body, .guide-body) ::selection { color: var(--color-text); background: var(--color-primary-soft); }
:is(.account-body, .checkout-body, .guide-body) :focus-visible { outline: 2px solid var(--color-focus); outline-offset: var(--space-1); }
:is(.account-body, .checkout-body, .guide-body) :is(input, textarea) { caret-color: var(--color-primary); }
:is(.account-body, .checkout-body, .guide-body) :is(h1, h2, h3) { color: var(--color-text); letter-spacing: var(--tracking-heading); text-wrap: balance; }
:is(.account-body, .checkout-body, .guide-body) :is(button, input, select, textarea) { font-family: inherit; }
:is(.account-body, .checkout-body, .guide-body) [hidden][hidden] { display: none; }
:is(.account-body, .checkout-body, .guide-body) .account-section { display: none; }
:is(.account-body, .checkout-body, .guide-body) .account-section.active { display: block; }
:is(.account-body, .checkout-body, .guide-body) .account-section:focus { outline: none; }
:is(.account-body, .checkout-body, .guide-body) .account-icon { width: var(--icon-size); height: var(--icon-size); flex: 0 0 auto; }
:is(.account-body, .checkout-body, .guide-body) .skip-link { position: fixed; top: var(--space-3); left: var(--space-3); z-index: 1001; padding: var(--space-3) var(--space-4); color: var(--color-on-primary); background: var(--btn-primary-bg); transform: translateY(-200%); }
:is(.account-body, .checkout-body, .guide-body) .skip-link:focus { transform: none; }
@media (prefers-reduced-motion: reduce) {
  :is(.account-body, .checkout-body, .guide-body) *, :is(.account-body, .checkout-body, .guide-body) *::before, :is(.account-body, .checkout-body, .guide-body) *::after { animation: none; transition: none; scroll-behavior: auto; }
}

.checkout-body .checkout-page::before { content:none; }
.checkout-body .checkout-page { overflow:visible; }

.guide-body { overflow-wrap: anywhere; }
.guide-body .page-content { padding-top: var(--nav-height); }
.guide-body :is(a, button, summary) { text-underline-offset: var(--space-1); }
.guide-body :is(button, summary, input, select) { touch-action: manipulation; }
.guide-body .guide-main:focus { outline: none; }