/* The builder's sections and blocks (docs/BUILDER.md §1, §7; markup from lib/builder/render.mjs).
   Only the look's and theme's own variables: no colours, fonts or sizes of its own, so a builder page
   wears the site's look like every other page. Loaded only on pages drawn from a page tree. */

/* ---- sections: width, surface, padding ---- */
.b-sec { position: relative; --b-gap: var(--grid-gap, clamp(1rem, 2.4vw, 1.75rem)); }
.b-in { max-width: var(--wrap, 1160px); margin: 0 auto; padding-inline: var(--pad, clamp(1rem, 4vw, 2.5rem)); }
.b-w-narrow > .b-in { max-width: 760px; }
.b-w-wide > .b-in { max-width: calc(var(--wrap, 1160px) + 160px); }
.b-w-full > .b-in { max-width: none; }

.b-s-paper, .b-s-muted { color: var(--on-light); --ghost-fg: var(--on-light); --b-mut: var(--on-light-mut); --b-label: var(--accent-text, var(--rust)); --b-link: var(--accent-text, var(--rust)); }
.b-s-paper { background: var(--canvas); }
.b-s-muted { background: var(--canvas-2); }
.b-s-dark { background: var(--marsh); color: var(--on-dark); --ghost-fg: var(--on-dark); --b-mut: var(--on-dark-mut); --b-label: var(--wheat); --b-link: var(--accent-text-dark, var(--wheat)); }
.b-s-accent { background: var(--rust); color: var(--on-accent, #fff); --ghost-fg: var(--on-accent, #fff); --b-mut: var(--on-accent, #fff); --b-label: var(--on-accent, #fff); --b-link: var(--on-accent, #fff); }
.b-s-accent .btn-primary { background: var(--on-accent, #fff); color: var(--rust); }
.b-s-paper .btn-ghost, .b-s-muted .btn-ghost { border-color: var(--canvas-3); }
.b-sec :is(h1, h2, h3), .b-blk:is(.b-s-paper, .b-s-muted, .b-s-dark, .b-s-accent) :is(h1, h2, h3) { color: inherit; }
.b-blk:is(.b-s-paper, .b-s-muted, .b-s-dark, .b-s-accent) { padding: clamp(1rem, 2.5vw, 1.75rem); }

.b-sec.b-pad-none { padding-block: 0; }
.b-sec.b-pad-xs { padding-block: .75rem; }
.b-sec.b-pad-sm { padding-block: 1.5rem; }
.b-sec.b-pad-md { padding-block: clamp(1.75rem, 4vw, 2.75rem); }
.b-sec.b-pad-lg { padding-block: clamp(2.5rem, 6vw, 4.5rem); }
.b-sec.b-pad-xl { padding-block: clamp(3.5rem, 9vw, 7rem); }
.b-blk.b-pad-none { padding: 0; }
.b-blk.b-pad-xs { padding: .5rem; }
.b-blk.b-pad-sm { padding: 1rem; }
.b-blk.b-pad-md { padding: 1.5rem; }
.b-blk.b-pad-lg { padding: clamp(1.5rem, 3.5vw, 2.5rem); }
.b-blk.b-pad-xl { padding: clamp(2rem, 5vw, 3.5rem); }
.b-rad-none, .b-rad-none .b-fig img { border-radius: 0; }
.b-rad-theme { border-radius: var(--r, 4px); }
.b-rad-soft, .b-rad-soft .b-fig img { border-radius: calc(var(--r, 4px) * 2 + 10px); }
.b-bd-subtle { border: 1px solid color-mix(in srgb, currentColor 18%, transparent); }
.b-bd-accent { border: 2px solid var(--rust); }
.b-ta-start { text-align: start; }
.b-ta-center { text-align: center; }
.b-ta-end { text-align: end; }

/* ---- the grid: rows of blocks; lanes where a stack sits beside a block (schema.mjs decompose) ---- */
.b-gap-none { --b-gap: 0px; }
.b-gap-xs { --b-gap: .5rem; }
.b-gap-sm { --b-gap: 1rem; }
.b-gap-md { --b-gap: var(--grid-gap, clamp(1rem, 2.4vw, 1.75rem)); }
.b-gap-lg { --b-gap: clamp(1.5rem, 3.5vw, 3rem); }
.b-gap-xl { --b-gap: clamp(2rem, 5vw, 4.5rem); }
.b-grid, .b-stack, .b-lane { display: flex; flex-direction: column; gap: var(--b-gap); min-width: 0; }
.b-row { display: grid; grid-template-columns: repeat(var(--n, 12), minmax(0, 1fr)); column-gap: var(--b-gap); align-items: start; }
.b-row > .b-blk { grid-column: var(--x, 1) / span var(--s, 12); }
.b-row > .b-lane { grid-column: var(--x, 1) / span var(--w, 12); }
.b-va-center .b-row { align-items: center; }
.b-va-end .b-row { align-items: end; }
.b-va-stretch .b-row { align-items: stretch; }
.b-blk { min-width: 0; }

/* ---- blocks ---- */
.b-h { margin: 0; text-wrap: balance; letter-spacing: var(--h-tracking, normal); }
.b-h em { font-style: italic; color: var(--b-label, inherit); }
.b-h-sm { font-size: clamp(1.15rem, 2vw, 1.35rem); }
.b-h-md { font-size: clamp(1.4rem, 2.6vw, 1.9rem); }
.b-h-lg { font-size: clamp(1.9rem, 4.2vw, 2.9rem); }
.b-h-xl { font-size: var(--hero-size, clamp(2.6rem, 6.5vw, 4.6rem)); line-height: 1.04; }
.b-prose > :first-child { margin-top: 0; }
.b-prose > :last-child { margin-bottom: 0; }
.b-prose p, .b-prose ul, .b-prose ol { margin: 0 0 .9em; }
.b-prose ul, .b-prose ol { padding-left: 1.3em; }
.b-prose a { color: var(--b-link, inherit); text-decoration: underline; text-underline-offset: .15em; }
.b-tr-lead { font-size: 1.15rem; color: var(--b-mut, inherit); }
.b-tr-lead .b-prose { max-width: 56ch; }
.b-ta-center.b-tr-lead .b-prose { margin-inline: auto; }
.b-tr-display { font-family: var(--display); font-size: clamp(1.35rem, 2.8vw, 1.9rem); line-height: 1.3; }
.b-tr-caption { font-family: var(--mono); font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 600; color: var(--b-label, inherit); }

.b-fig { margin: 0; }
.b-fig img { display: block; width: 100%; height: auto; aspect-ratio: var(--ar, auto); border-radius: var(--r, 4px); }
.b-ratio-square { --ar: 1 / 1; }
.b-ratio-portrait { --ar: 4 / 5; }
.b-ratio-landscape { --ar: 4 / 3; }
.b-ratio-wide { --ar: 16 / 9; }
.b-fig figcaption { font-size: .88rem; color: var(--b-mut, inherit); margin-top: .55rem; }
.b-img-empty { aspect-ratio: 4 / 3; max-height: 22rem; width: 100%; display: grid; place-items: center; border: 2px dashed color-mix(in srgb, currentColor 35%, transparent);
  border-radius: var(--r, 4px); font-size: .95rem; opacity: .7; }

.b-btn-fill { width: 100%; }
.b-btn-text { font-weight: 600; color: var(--b-link, inherit); text-decoration: underline; text-underline-offset: .2em; }

.b-sp-xs { height: .5rem; }
.b-sp-sm { height: 1.5rem; }
.b-sp-md { height: 3rem; }
.b-sp-lg { height: 5rem; }
.b-sp-xl { height: 8rem; }
.b-hr { border: 0; border-top: 1px solid color-mix(in srgb, currentColor 22%, transparent); margin: .25rem 0; }
.b-hr-accent { border-top: 3px solid var(--rust); width: 4rem; }
.b-ta-center .b-hr-accent { margin-inline: auto; }

/* ---- live lists: the site's own cards, in the block's columns ---- */
.b-coll-h { font-size: clamp(1.6rem, 3.4vw, 2.3rem); margin: 0 0 1.25rem; }
.b-collection .b-cards { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: var(--grid-gap, 1.2rem); }
.b-card-compact :is(.prodcard-bd p, .offer-sum, .longform, .litter-sum, .newsitem p) { display: none; }
.b-coll-more { margin: 1.1rem 0 0; }
.b-coll-more a { font-weight: 600; color: var(--b-link, inherit); }
.b-coll-none { color: var(--b-mut, inherit); margin: 0; }

/* ---- contact details: the site's own, live ---- */
.b-contact { display: grid; gap: .9rem; }
.b-contact-line { margin: 0; }
.b-contact-k { display: block; font-family: var(--mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 600;
  color: var(--b-label, inherit); margin-bottom: .2rem; }
.b-contact a { color: var(--b-link, inherit); }
.b-contact-dir { display: inline-block; margin-top: .35rem; font-weight: 600; }

/* ---- the editor's preview only (these appear only in /admin/preview) ---- */
/* A hidden section: visitors never get it; the owner sees it dimmed and labelled, to show it again. */
.b-hidden { position: relative; opacity: .5; outline: 2px dashed color-mix(in srgb, currentColor 45%, transparent); outline-offset: -6px; }
.b-hidden::before { content: 'Hidden from visitors'; position: absolute; top: .6rem; left: .6rem; z-index: 3; padding: .3rem .55rem; border-radius: 3px;
  font: 600 .7rem/1.2 var(--mono, monospace); letter-spacing: .1em; text-transform: uppercase; background: var(--marsh); color: var(--on-dark); }
.b-empty { border: 2px dashed color-mix(in srgb, currentColor 30%, transparent); border-radius: var(--r, 4px);
  padding: 2rem 1rem; text-align: center; font-size: .95rem; opacity: .75; }

/* ---- phones: everything stacks; half width only where the owner chose it ---- */
@media (max-width: 767px) {
  .b-row { display: flex; flex-wrap: wrap; gap: var(--b-gap); }
  .b-row > * { flex: 1 1 100%; }
  .b-row > [data-ph="2"] { flex: 0 1 calc(50% - var(--b-gap) / 2); }
  [data-ph-hide] { display: none !important; }
  [data-ph-al="start"] { text-align: start; }
  [data-ph-al="center"] { text-align: center; }
  [data-ph-al="end"] { text-align: end; }
  .b-blk.b-spacer:not([data-ph]) { display: none; }
  /* the rest of the phone settings (docs/BUILDER.md §1 phone): padding, a photo's shape and focus point */
  .b-blk[data-ph-pad="none"] { padding: 0; }
  .b-blk[data-ph-pad="xs"] { padding: .5rem; }
  .b-blk[data-ph-pad="sm"] { padding: 1rem; }
  .b-blk[data-ph-pad="md"] { padding: 1.5rem; }
  .b-blk[data-ph-pad="lg"] { padding: 2rem; }
  .b-blk[data-ph-pad="xl"] { padding: 2.5rem; }
  .b-sec[data-ph-pad="none"] { padding-block: 0; }
  .b-sec[data-ph-pad="xs"] { padding-block: .75rem; }
  .b-sec[data-ph-pad="sm"] { padding-block: 1.25rem; }
  .b-sec[data-ph-pad="md"] { padding-block: 1.75rem; }
  .b-sec[data-ph-pad="lg"] { padding-block: 2.5rem; }
  .b-sec[data-ph-pad="xl"] { padding-block: 3.5rem; }
  [data-ph-ratio="original"] .b-fig { --ar: auto; }
  [data-ph-ratio="square"] .b-fig { --ar: 1 / 1; }
  [data-ph-ratio="portrait"] .b-fig { --ar: 4 / 5; }
  [data-ph-ratio="landscape"] .b-fig { --ar: 4 / 3; }
  [data-ph-ratio="wide"] .b-fig { --ar: 16 / 9; }
  [data-ph-focus] .b-fig img { object-position: var(--ph-fp, center) !important; }
  .b-collection .b-cards { grid-template-columns: repeat(var(--pcols, 1), minmax(0, 1fr)); }
}

/* Opt-in photographic sections; the real image remains selectable in Settings. */
.b-backdrop { isolation:isolate; background:var(--marsh); color:var(--on-dark); --b-mut:var(--on-dark); --b-label:var(--on-dark); --ghost-fg:var(--on-dark); --b-link:var(--on-dark); }
.b-backdrop > .b-in { position:relative; z-index:1; }
.b-backdrop-media { position:absolute; inset:0; overflow:hidden; z-index:-1; pointer-events:none; }
.b-backdrop-media picture { display:contents; }
.b-backdrop-media img { width:100%; height:100%; object-fit:cover; display:block; }
.b-backdrop-media::after { content:''; position:absolute; inset:0; background:rgba(0,0,0,var(--b-dim,.45)); }
.b-fade-bottom > .b-backdrop-media { mask-image:linear-gradient(to bottom,#000 65%,transparent); }
.b-fade-bottom { background:var(--b-fade-surface,var(--canvas)); }
.b-backdrop.b-height-tall { min-height:70svh; }
.b-backdrop.b-height-screen { min-height:100svh; }
/* Words on a photo: one soft panel behind a group of words; a lone heading or paragraph gets a quiet highlight instead.
   Half-black over a photo darkened at least 25% keeps light text at 4.5:1 even on a white photo (design rules). */
.b-backdrop :is(.b-h,.b-prose) { color:var(--on-dark); }
.b-backdrop .b-group { background:rgba(0,0,0,.5); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border-radius:calc(var(--r,4px) + 12px); padding:clamp(20px,3.2vw,44px); }
.b-backdrop .b-blk:is(.b-heading,.b-text):not(.b-group .b-blk) :is(.b-h,.b-prose) { background:rgba(0,0,0,.55); border-radius:8px; padding:.25em .5em; -webkit-box-decoration-break:clone; box-decoration-break:clone; }
.b-backdrop .b-h em { color:inherit; font-style:normal; }
.b-backdrop .btn-ghost { background:rgba(0,0,0,.65); color:var(--on-dark); border-color:currentColor; }
.b-float-raised .b-fig { border-radius:calc(var(--r,4px) + 12px); box-shadow:0 12px 36px rgba(0,0,0,.25); border:5px solid var(--canvas); overflow:hidden; }
.b-sec.b-has-overlap { padding-bottom:0; z-index:2; display:flex; flex-direction:column; }
.b-has-overlap > .b-in { flex:1; width:100%; display:flex; flex-direction:column; }
.b-has-overlap > .b-in > :is(.b-grid,.b-stack) { flex:1; }
.b-has-overlap > .b-in > .b-grid > .b-row:last-child:has(.b-overlap-half), .b-has-overlap > .b-in > .b-stack > .b-overlap-half:last-child { margin-top:auto; }
.b-has-overlap > .b-in > :is(.b-grid,.b-stack) > .b-row:last-child:has(.b-overlap-half) { position:relative; z-index:2; }
.b-overlap-half { transform:translateY(50%); position:relative; z-index:2; }
.b-overlap-half .b-fig { max-height:360px; }
.b-overlap-half .b-fig img { max-height:350px; object-fit:cover; }
.b-has-overlap + :is(.b-sec,.b-sec-legacy) { padding-top:clamp(140px,18vw,260px); }
.b-header-overlay .topstack { position:absolute; inset:0 0 auto; z-index:50; pointer-events:none; padding-top:env(safe-area-inset-top); background:linear-gradient(to bottom,rgba(0,0,0,.8) 0,rgba(0,0,0,.62) 70%,rgba(0,0,0,0)); }
.b-header-overlay .topstack :is(a,button,input,.brand,.nav) { pointer-events:auto; }
.b-header-overlay .masthead { position:static; background:transparent; backdrop-filter:none; border-color:rgba(255,255,255,.15); }
.b-header-overlay .topstack :is(.brand,.brand b,.brand i,.motto,.motto em,.nav a,.masthead-cart,.nav-cart,.nav-toggle) { color:var(--on-dark); }
.b-header-overlay .nav { background:transparent; }
/* 44 px to tap without touching display: the site shows one cart link per screen size and must keep hiding the other. */
.b-header-overlay :is(.masthead-cart,.nav-cart) { padding-block:12px; padding-inline:.75rem; line-height:20px; }
.b-header-overlay .nav-toggle { min-width:44px; min-height:44px; background:transparent; border-color:rgba(255,255,255,.4); }
.b-header-overlay .nav-toggle span { background:var(--on-dark); }
.b-header-overlay .doorbar { background:rgba(0,0,0,.65); color:var(--on-dark); }
.b-header-overlay .doorbar :is(a,.on) { color:var(--on-dark); }
/* --b-head-h is the header's measured height (site.js); the fixed value is only for a first paint without scripts. */
.b-under-header { padding-top:calc(var(--b-head-h, 180px) + clamp(20px, 3vw, 40px)) !important; }
@media(max-width:767px) {
 .b-backdrop.b-height-tall { min-height:60svh; }
 .b-backdrop.b-height-screen { min-height:85svh; }
 .b-under-header { padding-top:calc(var(--b-head-h, 170px) + 20px) !important; }
 .b-header-overlay .nav.is-open { background:var(--marsh); }
 .b-has-overlap > .b-in > :is(.b-grid,.b-stack) > .b-row:last-child:has(.b-overlap-half) { margin-bottom:0; }
 .b-has-overlap + :is(.b-sec,.b-sec-legacy) { padding-top:200px; }
}

/* Owner-controlled photo words. Legacy rules above remain the unset default. */
.b-backdrop.b-photo-layout { display:flex; flex-direction:column; }
.b-backdrop.b-photo-layout > .b-in { margin:0; width:100%; max-width:none; flex:1; display:flex; flex-direction:column; justify-content:flex-start; }
.b-backdrop.b-photo-layout > .b-in > :is(.b-grid,.b-stack) { width:100%; flex:none; margin-inline:auto; max-width:36rem; }
.b-photo-layout:is(.b-photo-middle-left,.b-photo-middle-centre,.b-photo-middle-right) > .b-in { justify-content:center; }
.b-photo-layout:is(.b-photo-bottom-left,.b-photo-bottom-centre,.b-photo-bottom-right) > .b-in { justify-content:flex-end; }
.b-photo-layout.b-fade-bottom { padding-bottom:clamp(3rem,12svh,8rem); }
.b-photo-layout.b-fade-bottom > .b-backdrop-media { mask-image:linear-gradient(to bottom,#000 88%,transparent); }
.b-photo-layout.b-content-narrow > .b-in > :is(.b-grid,.b-stack) { max-width:28rem; }
.b-photo-layout.b-content-medium > .b-in > :is(.b-grid,.b-stack) { max-width:36rem; }
.b-photo-layout.b-content-wide > .b-in > :is(.b-grid,.b-stack) { max-width:48rem; }
.b-photo-layout:is(.b-photo-top-left,.b-photo-middle-left,.b-photo-bottom-left) > .b-in > :is(.b-grid,.b-stack) { margin-inline:0 auto; }
.b-photo-layout:is(.b-photo-top-right,.b-photo-middle-right,.b-photo-bottom-right) > .b-in > :is(.b-grid,.b-stack) { margin-inline:auto 0; }
.b-backing { --bk-blur:0px; }
.b-backing-glass { --bk-blur:20px; }
/* One panel per group, never another panel behind its children. */
.b-backdrop.b-backing .b-group, .b-backdrop .b-group.b-backing { background:rgba(0,0,0,var(--box-alpha,var(--bk,.5))); backdrop-filter:blur(var(--bk-blur,0px)); -webkit-backdrop-filter:blur(var(--bk-blur,0px)); }
.b-backdrop.b-backing .b-blk:is(.b-heading,.b-text):not(.b-group .b-blk) :is(.b-h,.b-prose),
.b-backdrop .b-blk.b-backing:is(.b-heading,.b-text):not(.b-group .b-blk) :is(.b-h,.b-prose) { background:rgba(0,0,0,var(--box-alpha,var(--bk,.55))); backdrop-filter:blur(var(--bk-blur,0px)); -webkit-backdrop-filter:blur(var(--bk-blur,0px)); }
.b-backdrop.b-backing-none .b-group:not(.b-backing), .b-backdrop .b-group.b-backing-none { backdrop-filter:none; -webkit-backdrop-filter:none; }
.b-backdrop.b-backing-none .b-blk:is(.b-heading,.b-text):not(.b-group .b-blk):not(.b-backing) :is(.b-h,.b-prose),
.b-backdrop .b-blk.b-backing-none:is(.b-heading,.b-text) :is(.b-h,.b-prose) { backdrop-filter:none; -webkit-backdrop-filter:none; }
.b-backdrop.b-backing .btn-ghost { background:rgba(0,0,0,var(--bk,0)); }
.b-backdrop.b-words-light, .b-backdrop .b-words-light { --word-ink:#fff; }
.b-backdrop.b-words-dark, .b-backdrop .b-words-dark { --word-ink:#000; }
.b-backdrop:is(.b-words-light,.b-words-dark), .b-backdrop :is(.b-words-light,.b-words-dark) { color:var(--word-ink); --b-mut:var(--word-ink); --b-label:var(--word-ink); --b-link:var(--word-ink); --ghost-fg:var(--word-ink); }
.b-backdrop:is(.b-words-light,.b-words-dark) :is(.b-h,.b-prose,.btn-ghost), .b-backdrop :is(.b-words-light,.b-words-dark) :is(.b-h,.b-prose) { color:var(--word-ink); }
.b-backdrop.b-backing .b-h em { font-style:italic; }
.b-header-overlay.b-header-shade-none .topstack { background:none; }
.b-header-overlay.b-header-shade-soft .topstack { background:linear-gradient(to bottom,rgba(0,0,0,.35),transparent); }
.b-header-overlay.b-header-shade-strong .topstack { background:linear-gradient(to bottom,rgba(0,0,0,.8),rgba(0,0,0,.62) 70%,transparent); }
/* Box controls operate on the fill, keeping words and links solid. */
.b-blk.b-border-box:not([class*="b-pad-"]):not([class*="b-box-pad-"]) { padding:.75rem 1rem; }
.b-blk.b-border-width:not(.b-bd-none) { border-width:var(--bd-w); }
.b-blk.b-border-colour:not(.b-bd-none) { border-color:var(--bd-c); }
.b-blk.b-bd-none { border:0; }
.b-blk.b-box-pad-auto.b-border-box { padding:.75rem 1rem; }
.b-blk.b-box-pad-none { padding:0; }
.b-blk.b-box-pad-xs { padding:.5rem; }
.b-blk.b-box-pad-sm { padding:1rem; }
.b-blk.b-box-pad-md { padding:1.5rem; }
.b-blk.b-box-pad-lg { padding:2rem; }
.b-blk.b-box-pad-xl { padding:2.5rem; }
.b-blk.b-box-opacity.b-s-paper { background:color-mix(in srgb,var(--canvas) calc(var(--box-alpha)*100%),transparent); }
.b-blk.b-box-opacity.b-s-muted { background:color-mix(in srgb,var(--canvas-2) calc(var(--box-alpha)*100%),transparent); }
.b-blk.b-box-opacity.b-s-accent { background:color-mix(in srgb,var(--rust) calc(var(--box-alpha)*100%),transparent); }
.b-blk.b-box-opacity.b-s-dark { background:color-mix(in srgb,var(--marsh) calc(var(--box-alpha)*100%),transparent); }
.b-backdrop .b-group.b-box-opacity { background:rgba(0,0,0,var(--box-alpha)); }
.b-backdrop .b-blk.b-box-opacity:is(.b-heading,.b-text):not(.b-group .b-blk) :is(.b-h,.b-prose) { background:rgba(0,0,0,var(--box-alpha)); }
.b-blk.b-rad-none > :is(.btn,.b-btn-text), .b-backdrop .b-blk.b-rad-none > :is(.b-h,.b-prose) { border-radius:0; }
.b-blk.b-rad-soft > :is(.btn,.b-btn-text), .b-backdrop .b-blk.b-rad-soft > :is(.b-h,.b-prose) { border-radius:calc(var(--r,4px)*2 + 10px); }
.b-blk.b-rad-theme > :is(.btn,.b-btn-text) { border-radius:var(--r,4px); }
.b-rad-round, .b-blk.b-rad-round > :is(.btn,.b-btn-text), .b-backdrop .b-blk.b-rad-round > :is(.b-h,.b-prose) { border-radius:2rem; }
@media(max-width:767px) {
 .b-backdrop.b-photo-layout[data-photo-phone="top"] > .b-in { justify-content:flex-start; }
 .b-backdrop.b-photo-layout[data-photo-phone="middle"] > .b-in { justify-content:center; }
 .b-backdrop.b-photo-layout[data-photo-phone="bottom"] > .b-in { justify-content:flex-end; }
 .b-backdrop[data-photo-phone="below"] { padding-top:0 !important; padding-bottom:0; min-height:0; background:var(--canvas); }
 .b-backdrop[data-photo-phone="below"] > .b-backdrop-media { position:relative; inset:auto; height:60svh; flex:none; z-index:0; }
 .b-backdrop[data-photo-phone="below"] > .b-in { flex:none; padding-block:2rem; }
}

.b-border-width { --bd-w:2px; }
.b-border-colour { --bd-c:var(--rust); }
.b-box-opacity { --box-alpha:1; }

.b-backdrop.b-backing-zero .b-group:not(.b-backing), .b-backdrop .b-group.b-backing-zero { backdrop-filter:none; -webkit-backdrop-filter:none; }
.b-backdrop.b-backing-zero .b-blk:is(.b-heading,.b-text):not(.b-group .b-blk):not(.b-backing) :is(.b-h,.b-prose), .b-backdrop .b-blk.b-backing-zero:is(.b-heading,.b-text) :is(.b-h,.b-prose) { backdrop-filter:none; -webkit-backdrop-filter:none; }
@media(max-width:767px) {
 .b-backdrop.b-phone-layout { display:flex; flex-direction:column; }
 .b-backdrop.b-phone-layout > .b-in { margin:0; width:100%; max-width:none; flex:1; display:flex; flex-direction:column; }
 .b-backdrop.b-phone-layout[data-photo-phone="top"] > .b-in { justify-content:flex-start; }
 .b-backdrop.b-phone-layout[data-photo-phone="middle"] > .b-in { justify-content:center; }
 .b-backdrop.b-phone-layout[data-photo-phone="bottom"] > .b-in { justify-content:flex-end; }
 .b-backdrop.b-phone-layout[data-photo-phone="bottom"].b-fade-bottom { padding-bottom:12svh; }
 .b-backdrop.b-phone-layout[data-photo-phone="bottom"].b-fade-bottom > .b-backdrop-media { mask-image:linear-gradient(to bottom,#000 88%,transparent); }
 .b-backdrop.b-phone-layout[data-photo-phone="below"] > .b-in { flex:none; }
}
/* Grid row --r is local to blocks; capture the theme radius at the section instead. */
.b-sec { --b-theme-radius:var(--r,4px); }
.b-blk.b-rad-theme, .b-blk.b-rad-theme > :is(.btn,.b-btn-text) { border-radius:var(--b-theme-radius,4px); }
.b-blk.b-rad-soft, .b-blk.b-rad-soft > :is(.btn,.b-btn-text), .b-backdrop .b-group.b-rad-soft,
.b-backdrop .b-blk.b-rad-soft > :is(.b-h,.b-prose) { border-radius:12px; }
.b-backdrop .b-group.b-rad-none { border-radius:0; }
.b-backdrop .b-group.b-rad-round { border-radius:2rem; }

.b-backdrop:is(.b-backing-none,.b-backing-zero) .b-group:not(.b-backing):not(.b-border-box):not([class*="b-pad-"]):not([class*="b-box-pad-"]),
.b-backdrop .b-group:is(.b-backing-none,.b-backing-zero):not(.b-border-box):not([class*="b-pad-"]):not([class*="b-box-pad-"]) { padding:0; }
/* An explicitly chosen group panel includes its outline buttons: do not stack more black boxes. */
.b-backdrop.b-backing .b-group .btn-ghost, .b-backdrop .b-group:is(.b-backing,.b-box-opacity) .btn-ghost { background:transparent; }
.b-backdrop .b-backing .b-h em { font-style:italic; }

/* Free sections use one overlapping grid area. Intrinsic grid height includes every offset
   and the actual text/image height, including after font loading and window resizing. */
.b-free{display:grid;position:relative;isolation:isolate;width:100%;min-height:inherit}
.b-free>.b-blk{grid-area:1/1;align-self:start;justify-self:start;min-width:0;max-width:100%;margin-left:var(--f-left,0%);margin-top:var(--f-top,0rem);width:var(--f-width,100%);z-index:var(--f-z,0)}
.b-sec:has(>.b-in>.b-free)>.b-in{min-height:inherit;display:block}
@media(max-width:767px){
 .b-free{display:flex;flex-direction:column;min-height:0;gap:var(--b-gap,1rem)}
 .b-free>.b-blk{margin:0;width:100%;position:relative;z-index:auto}
 .b-free>.b-blk[data-ph="2"]{width:50%}
 .b-phone-ordered{display:flex!important;flex-direction:column}
 .b-phone-ordered :is(.b-row,.b-lane):not(.b-phone-ordered .b-blk *){display:contents}
 [data-phone-order]{order:var(--phone-order,0)}
 .b-phone-free-block{margin-left:var(--pf-left,0%)!important;width:var(--pf-width,100%)!important;margin-top:var(--pf-top,0rem)!important;z-index:var(--pf-z,0)!important}
 [data-phone-font], [data-phone-font] .b-h, [data-phone-font]>.btn, [data-phone-font] .b-prose, [data-phone-font] figcaption{font-size:var(--phone-font,inherit)!important}
 .b-sec[style*="--phone-height"]{min-height:var(--phone-height,0rem)}
}

@media(max-width:767px){
 .b-phone-positioned>.b-in>.b-free,.b-phone-positioned>.b-in>.b-grid,.b-phone-positioned>.b-in>.b-stack{display:grid!important;grid-template-columns:minmax(0,1fr);align-content:start}
 .b-phone-positioned>.b-in>.b-grid>.b-row,.b-phone-positioned>.b-in>.b-grid>.b-row>.b-lane,.b-phone-positioned>.b-in>.b-grid>.b-row>.b-lane>.b-row{display:contents}
 .b-phone-positioned>.b-in>div>.b-blk{grid-column:1;grid-row:auto}
 .b-phone-positioned .b-phone-free-block{grid-area:1/1!important;align-self:start;justify-self:start;min-width:0;max-width:100%}
}

@media(max-width:767px){
 .b-phone-positioned-content{display:grid!important;grid-template-columns:minmax(0,1fr);align-content:start}
 .b-phone-positioned-content :is(.b-row,.b-lane):not(.b-phone-positioned-content .b-blk *){display:contents}
 .b-phone-positioned-content .b-phone-free-block{grid-area:1/1!important;align-self:start;justify-self:start;min-width:0;max-width:100%}
}
@media(max-width:767px){
 .b-backdrop.b-phone-layout:has(>.b-in>.b-free)>.b-in{display:flex;flex-direction:column;min-height:0}
}

.b-pedigree { min-width: 0; }
.b-pedigree .ped-scroll { max-width: 100%; }
.b-pedigree .ped-name { overflow-wrap: anywhere; }
.b-pedigree .ped-head, .b-pedigree .ped-credit { color: var(--b-mut, var(--on-light-mut)); }
.b-pedigree .ped-cell { background: var(--canvas-2); color: var(--on-light); }
.b-pedigree .ped-cell.is-self { background: var(--canvas-3); }
.b-pedigree .ped-cell.is-empty { background: transparent; }
.b-pedigree .ped-titles, .b-pedigree .ped-meta { color: var(--on-light-mut); }