/* SHRIVE design pass, 2026-09-27. Loaded last on index and machine.
   1. Hero stage: the near-black of the concept sheet, one lattice, smoke, nothing else.
   2. Try a buy: the confessional screen. Four buy sizes are four heat windows. A buy heats
      the perforated screen from behind; the piece's silhouette glows through the holes;
      a claim-code slip prints out underneath. Marked site simulation.
   3. Build a piece: the perforated plate. Each trait is a row of holes; the picked hole
      glows ember.
   4. UI pass: flat ledger split, a ruled runtime list instead of a card grid, the Zcash
      door as four ruled steps, pills that never wrap, body copy under 65 characters.
   Spacing is the 4pt scale from tokens.css. Colours are the tokens, plus the ember and
   paper values the piece art itself uses. */

/* ---------- 1. Hero ---------- */
.hook-stage,.hook-mount,.hook-mount canvas,.hook-mount .object-still{background:var(--ground)}
.hook-stage::before{display:none}
.tag,.privacy-pill,.buy-tab,.booth-head .tag,.plate-label .tag{white-space:nowrap}
p.tech-pill{white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;padding:var(--space-4) var(--space-12)}
.hero-heading .hero-trading{max-width:52ch;margin-inline:0}
.hero-heading .hero-trading-secondary{max-width:52ch;margin-inline:0}
.hero-heading .publication-note{max-width:60ch}

/* ---------- 2. Try a buy: the confessional screen ---------- */
.buy-instrument.shrive-booth{display:grid;grid-template-columns:minmax(0,1fr);gap:0;align-items:stretch;padding:0;border:1px solid var(--line);border-radius:var(--radius);background:var(--ground)}
.booth-head{grid-column:1/-1;display:flex;align-items:center;gap:var(--space-12);min-width:0;margin:0;padding:var(--space-12) var(--space-24);border-bottom:1px solid var(--line);font:500 var(--fs-label)/1.4 var(--font-mono);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--ink-soft);white-space:nowrap}
.booth-head .tag{margin-left:auto}
.booth-dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--glow)}
.shrive-booth .buy-tab-panels{min-width:0;padding:var(--space-24)}
.shrive-booth .buy-tabs{margin-bottom:var(--space-24);border-bottom:1px solid var(--line)}
.shrive-booth .buy-action .component-caption{max-width:44ch}
/* Four buy sizes, four heat windows: ember fills a tiny perforated window from the
   bottom, as high as the buy is big. */
.shrive-booth .buy-buttons{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-8);margin-top:var(--space-16)}
.shrive-booth .buy-choice{display:grid;grid-template-columns:minmax(0,1fr);justify-items:start;align-content:start;gap:var(--space-8);min-height:0;padding:var(--space-12);border:1px solid var(--line);border-radius:var(--radius);background:var(--band);color:var(--ink);font:400 var(--fs-label)/1.3 var(--font-body);text-align:left;transform:none;transition:border-color var(--fx-hover) var(--ease-soft),background var(--fx-hover) var(--ease-soft)}
body[data-page] .shrive-booth .buy-choice{border-style:solid;border-radius:var(--radius);font-family:var(--font-body)}
body[data-page] .shrive-booth .buy-choice::before{content:none}
.shrive-booth .buy-choice strong{font:600 var(--fs-body)/1.3 var(--font-display);white-space:nowrap}
.shrive-booth .buy-choice small{font:500 var(--fs-label)/1.3 var(--font-mono);letter-spacing:.04em;color:var(--ink-soft);white-space:nowrap}
.heat-cell{position:relative;display:block;width:100%;aspect-ratio:1;border-radius:2px;background:#050506;overflow:hidden}
.heat-cell::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,#FFB080,var(--glow) calc(var(--heat,.5) * 45%),var(--accent) calc(var(--heat,.5) * 85%),#050506 calc(var(--heat,.5) * 100% + 6%));transform-origin:bottom;transition:filter var(--fx-hover) var(--ease-soft)}
/* The plate: bars in both directions leave square holes, like the screen itself. */
.heat-cell::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,#151517 0 3px,transparent 3px 9px),repeating-linear-gradient(#151517 0 3px,transparent 3px 9px);box-shadow:inset 0 0 0 3px #151517}
.shrive-booth .buy-choice:hover{background:var(--tint);border-color:color-mix(in srgb,var(--accent) 45%,var(--line));transform:none}
.shrive-booth .buy-choice:hover .heat-cell::before{filter:brightness(1.25)}
.shrive-booth .buy-choice:active{background:var(--tint);transform:none}
.shrive-booth .buy-choice:focus-visible{outline:3px solid var(--accent-deep);outline-offset:2px}
.shrive-booth .buy-choice[aria-busy=true]{background:var(--tint);border-color:var(--accent)}
.shrive-booth .buy-choice[aria-busy=true] .heat-cell::before{animation:heat-rise 600ms var(--ease-soft) both}
@keyframes heat-rise{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.shrive-booth .buy-session{margin-top:var(--space-16)}
/* The result: the screen, the slip, the readout. */
.shrive-booth .buy-result{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-16);align-content:start;align-items:start;padding:var(--space-24);border-top:1px solid var(--line);text-align:left}
.screen-well{display:grid;justify-items:center;min-width:0}
.shrive-screen{position:relative;width:min(100%,272px);aspect-ratio:1;border-radius:10.8%;overflow:hidden;isolation:isolate;background:#050506;box-shadow:0 18px 40px rgba(0,0,0,.55)}
.screen-ember{position:absolute;inset:7.5%;background:radial-gradient(ellipse 75% 26% at 50% 50%,#FFB080,var(--glow) 22%,var(--accent) 46%,#3A0E06 78%,transparent 100%);opacity:.16;transform:scaleY(.5);transition:opacity 480ms var(--ease),transform 600ms var(--ease)}
.screen-glyph{position:absolute;left:7.5%;top:7.5%;width:85%;height:85%;fill:var(--glow);opacity:0;filter:drop-shadow(0 0 5px var(--accent));transition:opacity 480ms var(--ease) 120ms}
.screen-plate{position:absolute;inset:0;display:block;width:100%;height:100%}
.screen-line{position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;background:var(--accent);box-shadow:0 0 8px var(--glow);opacity:.5;transition:opacity 320ms var(--ease)}
.screen-dot{position:absolute;right:5%;bottom:5%;width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 6px var(--glow);transition:background 320ms var(--ease)}
.shrive-screen[data-state=paying] .screen-ember{opacity:.85;transform:scaleY(1.15);animation:ember-breathe 900ms ease-in-out infinite alternate}
@keyframes ember-breathe{to{opacity:.6}}
.shrive-screen[data-state=paying] .screen-line{opacity:1}
.shrive-screen[data-state=lit] .screen-ember,.shrive-screen[data-state=printed] .screen-ember{opacity:.5;transform:scaleY(1)}
.shrive-screen[data-state=lit] .screen-glyph,.shrive-screen[data-state=printed] .screen-glyph{opacity:1}
.shrive-screen[data-state=lit] .screen-line,.shrive-screen[data-state=printed] .screen-line{opacity:1}
.shrive-screen[data-state=short] .screen-ember{opacity:.05;transform:scaleY(.3)}
.shrive-screen[data-state=short] .screen-line{opacity:.2}
.shrive-screen[data-state=short] .screen-dot{background:var(--line);box-shadow:none}
/* The slip: ink-coloured paper with a perforated top edge, printed out of the screen. */
.claim-slip-out{position:relative;z-index:0;display:grid;gap:var(--space-8);width:min(100%,240px);margin-top:calc(-1 * var(--space-4));padding:var(--space-16) var(--space-16) var(--space-12);border:1px dashed var(--line);border-top:0;border-radius:0 0 var(--radius) var(--radius);background:transparent;color:var(--ink-soft);transform-origin:top}
.slip-head{display:flex;justify-content:space-between;gap:var(--space-8);margin:0;font:500 var(--fs-label)/1.3 var(--font-mono);letter-spacing:var(--track-label);text-transform:uppercase;white-space:nowrap}
.slip-code{margin:0;font:500 var(--fs-label)/1.4 var(--font-mono);letter-spacing:.06em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.slip-note{margin:0;font:400 var(--fs-label)/1.5 var(--font-body);max-width:none}
.shrive-booth .claim-slip-out .piece-preview{width:100%;min-width:0;margin:0}
.shrive-booth .claim-slip-out .empty-piece{border-radius:var(--radius);border-color:var(--line);background:transparent;opacity:.5}
.claim-slip-out[data-state=lit],.claim-slip-out[data-state=printed]{border:0;background:#EDE7DF;color:#151517;-webkit-mask:radial-gradient(circle at 6px 0,transparent 3px,#000 3.5px) 0 0/12px 100% repeat-x;mask:radial-gradient(circle at 6px 0,transparent 3px,#000 3.5px) 0 0/12px 100% repeat-x;box-shadow:0 8px 20px rgba(0,0,0,.4)}
.claim-slip-out[data-state=lit] .slip-note,.claim-slip-out[data-state=printed] .slip-note{color:#4A453F}
.claim-slip-out[data-state=lit]{animation:slip-print 720ms var(--ease) both}
@keyframes slip-print{from{clip-path:inset(0 0 100% 0);transform:translateY(-16px)}to{clip-path:inset(0 0 0 0);transform:translateY(0)}}
.screen-state{margin:0;font:500 var(--fs-label)/1.4 var(--font-mono);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--ink-soft)}
.shrive-booth .buy-result-copy{min-width:0}
.shrive-booth #fireRead{font:600 var(--fs-h3)/1.3 var(--font-display)}
@media(min-width:768px) and (max-width:1023px){.shrive-booth .buy-result{grid-template-columns:272px minmax(0,1fr);column-gap:var(--space-32)}.shrive-booth .screen-well{grid-row:1/span 3}}
@media(min-width:1024px){.buy-instrument.shrive-booth{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}.shrive-booth .buy-tab-panels,.shrive-booth .buy-result{padding:var(--space-32)}.shrive-booth .buy-result{border-top:0;border-left:1px solid var(--line)}}
@media(min-width:1280px){.shrive-booth .buy-result{grid-template-columns:272px minmax(0,1fr);column-gap:var(--space-32)}.shrive-booth .screen-well{grid-row:1/span 3}}
@media(max-width:479px){.booth-head{padding:var(--space-12) var(--space-16)}.shrive-booth .buy-tab-panels,.shrive-booth .buy-result{padding:var(--space-16)}.shrive-booth .buy-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}.shrive-booth .buy-choice{grid-template-columns:48px minmax(0,1fr);grid-template-areas:"cell label" "cell amount";align-items:center;column-gap:var(--space-12)}.shrive-booth .heat-cell{grid-area:cell}.shrive-booth .buy-choice strong{grid-area:label;font-size:var(--fs-label)}.shrive-booth .buy-choice small{grid-area:amount}}
@media(prefers-reduced-motion:reduce){
  .screen-ember,.screen-glyph,.screen-line,.screen-dot,.shrive-booth .buy-choice,.heat-cell::before{transition:none}
  .shrive-screen[data-state=paying] .screen-ember,.claim-slip-out[data-state=lit],.shrive-booth .buy-choice[aria-busy=true] .heat-cell::before{animation:none}
}

/* ---------- 3. Build a piece: the perforated plate ---------- */
#build .build-bench.shrive-plate{grid-template-columns:minmax(0,1fr);gap:0;padding:0;border:1px solid var(--line);border-radius:var(--radius);background:var(--ground)}
#build .shrive-plate .build-object{display:grid;gap:var(--space-16);align-content:start;margin:0;padding:var(--space-24);border:0;border-radius:0;background:transparent}
.plate-label{display:flex;align-items:center;justify-content:space-between;gap:var(--space-12);margin:0;font:500 var(--fs-label)/1.4 var(--font-mono);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--ink-soft);white-space:nowrap}
.plate-window{width:min(100%,288px);margin:0 auto;padding:var(--space-12);border-radius:var(--radius);background:#050506;box-shadow:inset 0 0 0 1px var(--line)}
#build .shrive-plate .build-card{width:100%;max-width:none;margin:0}
#build .shrive-plate .build-maths{margin:0;padding:var(--space-16) 0 0;border:0;border-top:1px solid var(--line);border-radius:0;background:transparent}
#build .shrive-plate .plate-controls{min-width:0;padding:var(--space-24);border-top:1px solid var(--line)}
#build .shrive-plate .build-controls{display:grid;gap:0;min-width:0;padding:0;border:0;background:transparent}
#build .shrive-plate .plate-row{min-width:0;margin:0;padding:var(--space-12) 0;border:0;border-bottom:1px solid var(--line)}
#build .shrive-plate .plate-row:first-child{padding-top:0}
#build .shrive-plate .plate-row legend{margin-bottom:var(--space-8);padding:0;font:500 var(--fs-label)/1.4 var(--font-mono);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--ink-soft)}
#build .shrive-plate .segments{display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));flex-wrap:initial;gap:var(--space-4);overflow:visible;padding:0}
#build .shrive-plate .segments button{display:grid;justify-items:center;align-content:start;gap:var(--space-4);min-width:0;min-height:76px;height:auto;padding:var(--space-8) var(--space-4);border:0;border-radius:var(--radius);outline:0;background:transparent;box-shadow:none;color:var(--ink-soft);font:400 var(--fs-label)/1.3 var(--font-body);text-align:center;white-space:normal;cursor:pointer}
#build .shrive-plate .segments button span{color:inherit}
#build .shrive-plate .segments button small{font:400 var(--fs-label)/1.3 var(--font-mono);color:var(--ink-soft);opacity:.75}
.plate-hole{display:block;width:20px;height:20px;border-radius:2px;background:#050506;box-shadow:inset 0 0 0 1px var(--line),inset 0 3px 4px rgba(0,0,0,.8);transition:background 240ms var(--ease),box-shadow 240ms var(--ease)}
#build .shrive-plate .segments button:hover{background:var(--band);outline:0}
#build .shrive-plate .segments button:hover .plate-hole{box-shadow:inset 0 0 0 1px var(--ink-soft),inset 0 3px 4px rgba(0,0,0,.8)}
#build .shrive-plate .segments button:focus-visible{outline:3px solid var(--accent-deep);outline-offset:-3px}
#build .shrive-plate .segments button[aria-pressed=true]{background:transparent;border:0;color:var(--ink)}
#build .shrive-plate .segments button[aria-pressed=true] span{font-weight:600}
#build .shrive-plate .segments button[aria-pressed=true] .plate-hole{background:radial-gradient(circle at 50% 60%,#FFD6B0,var(--glow) 38%,var(--accent) 78%);box-shadow:0 0 12px color-mix(in srgb,var(--glow) 60%,transparent),inset 0 0 0 1px var(--accent)}
#build .shrive-plate .build-shortcuts{margin-top:var(--space-16)}
@media(min-width:1024px){#build .build-bench.shrive-plate{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}#build .shrive-plate .build-object,#build .shrive-plate .plate-controls{padding:var(--space-32)}#build .shrive-plate .plate-controls{border-top:0;border-left:1px solid var(--line)}}
@media(max-width:479px){#build .shrive-plate .build-object,#build .shrive-plate .plate-controls{padding:var(--space-16)}#build .shrive-plate .segments{grid-template-columns:repeat(auto-fill,minmax(68px,1fr))}}
@media(prefers-reduced-motion:reduce){.plate-hole{transition:none}}

/* ---------- 4. UI pass ---------- */
/* Why this is private: square step marks, lattice holes rather than coins. */
.privacy-step-num{border-radius:var(--radius)}
.privacy-step strong{font:600 var(--fs-body)/1.35 var(--font-display)}
.privacy-step p{font-size:var(--fs-body);line-height:var(--leading-body);max-width:40ch}
.privacy-honest{max-width:65ch;color:var(--ink-soft)}
/* The ledger: one split with a hairline between, not a card. */
.privacy-ledger .ledger-ticket{padding:0;background:transparent;border:0;border-block:1px solid var(--line);border-radius:0}
.privacy-ledger .ledger-column{padding:var(--space-24) 0}
.privacy-ledger .ledger-column li{font-size:var(--fs-body);max-width:48ch}
.privacy-ledger .ledger-column li::before{border-radius:1px}
.privacy-ledger .ledger-honest{max-width:65ch}
/* The Zcash door: four ruled steps and a plain on-ramp line. */
.door-steps{list-style:none;counter-reset:door;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:var(--space-24) 0 0;padding:0;border-block:1px solid var(--line)}
.door-steps li{counter-increment:door;min-width:0;padding:var(--space-16) var(--space-16) var(--space-16) 0;font-size:var(--fs-body);line-height:var(--leading-body);color:var(--ink-soft)}
.door-steps li+li{padding-left:var(--space-16);border-left:1px solid var(--line)}
.door-steps li::before{content:counter(door,decimal-leading-zero);display:block;margin-bottom:var(--space-8);font:500 var(--fs-label)/1 var(--font-mono);letter-spacing:var(--track-label);color:var(--accent-deep)}
.door-steps strong{display:block;margin-bottom:var(--space-4);font:600 var(--fs-body)/1.35 var(--font-display);color:var(--ink)}
.door-onramp{max-width:65ch;margin:var(--space-16) 0 var(--space-24);color:var(--ink-soft)}
.door-onramp a,.door-onramp a[href]{display:inline;min-height:0;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
@media(max-width:1023px){.door-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.door-steps li:nth-child(3){padding-left:0;border-left:0}.door-steps li:nth-child(n+3){border-top:1px solid var(--line)}}
@media(max-width:599px){.door-steps{grid-template-columns:minmax(0,1fr)}.door-steps li,.door-steps li+li{padding:var(--space-16) 0;border-left:0}.door-steps li+li{border-top:1px solid var(--line)}}
/* What runs when you buy: a ruled list, not a grid of cards. */
.runtime-row{gap:0;border-top:1px solid var(--line)}
.runtime-card{border:0;border-radius:0;background:transparent;box-shadow:none;padding:var(--space-24) var(--space-16);border-right:1px solid var(--line);transform:none}
.runtime-card:last-child{border-right:0}
.runtime-card:hover{background:var(--tint);transform:none}
@media(max-width:1023px){
  .runtime-row{display:grid;grid-template-columns:minmax(0,1fr);overflow:visible;padding:0;mask-image:none;-webkit-mask-image:none}
  .runtime-card{flex:none;max-width:none;min-height:0;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--space-16);padding:var(--space-16) 0;border-right:0;border-bottom:1px solid var(--line)}
  .runtime-card svg{flex:none;width:40px;height:40px}
}
/* The tech: the limit line reads as a note under the rows. */
.tech-section .tech-limit{margin-top:var(--space-24);max-width:65ch;color:var(--ink-soft)}
/* Body copy stays under 65 characters a line. */
.buy-proof>p,.proof-seed,#lookupStatus,.rail-section>p,.tech-section .tech-row dd,.demo-intro,.demo-status,.component-caption{max-width:65ch}
.demo-intro{font-size:var(--fs-h3);line-height:1.5}
.private-by-strip p{font-size:var(--fs-label)}

/* ---------- Rhythm pass 2026-09-28 (owner: "the words are jammed up") ----------
   One vertical rhythm on the 4pt scale: eyebrow to heading 8, heading to body 16,
   body to CTA 24, CTA to the next block 48, section to section 96. Body copy 65ch,
   fine print 60ch in a smaller muted block, buttons never touch text, disabled buttons
   carry a short reason beside them. Ids, data attributes and copy untouched. */
:root{--rh-eyebrow:var(--space-8);--rh-body:var(--space-16);--rh-cta:var(--space-24);--rh-block:var(--space-48);--rh-fine:60ch}

/* Headings and short copy wrap without one-word orphans. */
h1,h2,h3,.component-title,.kicker,summary,.line-row p,#closing-title{text-wrap:balance}
p,li,dd,figcaption,.component-caption{text-wrap:pretty}

/* Eyebrow sits 8 above its heading; the heading group keeps its air above. */
.kicker+h2,.kicker+.component-title{margin-top:var(--rh-eyebrow)}
.rail-section>header>.kicker{margin:0}

/* Body copy measure. */
.rail-section>p,.rail-section>header>.component-caption,.privacy-split-note,#journeyStatus{max-width:65ch}

/* Fine print: one smaller, muted block with its own spacing and measure. */
.demo-status,.runtime-status,.publication-detail,#collectionTerms,.tech-section .tech-limit,#zcashPanel .field-help,#railHistoryNote{max-width:var(--rh-fine);font-size:.875rem;line-height:1.6;color:var(--ink-soft)}
.try-buy>.demo-status{margin-top:var(--rh-cta)}
.runtime-status,.publication-detail{margin-top:var(--rh-cta)}
.publication-detail+#collectionTerms{margin-top:var(--space-8)}
#rule>.btn{margin-top:var(--rh-cta)}
.privacy-strip{max-width:65ch;text-wrap:balance}

/* Disabled buttons read as disabled: dashed outline, muted label, no fill. */
.btn:disabled,.btn[aria-disabled=true]{opacity:1;border-style:dashed;border-color:color-mix(in srgb,var(--ink-soft) 60%,transparent);background:transparent;color:var(--ink-soft);box-shadow:none}
.btn-quiet:disabled{border-color:transparent}

/* Numbered steps: one grid, equal gaps, the number on its own line above the step. */
.launch-invitation ol,.wallet-journey ol{counter-reset:rh-step;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-24);margin:var(--space-32) 0 0;padding:0;list-style:none}
.launch-invitation li,.wallet-journey ol li{counter-increment:rh-step;display:grid;align-content:start;gap:var(--space-8);min-width:0;margin:0;padding-top:var(--space-16);border-top:1px solid var(--line)}
.launch-invitation li::before,.wallet-journey ol li::before{content:counter(rh-step,decimal-leading-zero);font:600 var(--fs-label)/1 var(--font-mono);letter-spacing:var(--track-label);color:var(--accent-deep)}
.launch-invitation li strong{margin:0;line-height:1.25}
@media(min-width:768px){.launch-invitation ol{grid-template-columns:repeat(3,minmax(0,1fr))}.wallet-journey ol{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1024px){.wallet-journey ol{grid-template-columns:repeat(4,minmax(0,1fr))}}
.launch-invitation>.btn,.wallet-journey>.btn{margin-top:var(--rh-cta)}

/* The ZEC door: the disabled quote button leads with its reason beside it, the fine
   print below as a muted block, the claim form as its own labelled group. */
#zcashPanel{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-12) var(--space-16);width:auto;max-width:68ch;margin:var(--rh-block) 0 0;padding-top:var(--space-32);border-top:1px solid var(--line)}
#zcashPanel>.btn{order:1;margin:0}
#zcashPanel>p[role=status]{order:2;flex:1 1 20ch;max-width:none;margin:0;font-size:.875rem;line-height:1.5;color:var(--ink-soft)}
#zcashPanel>.field-help{order:3;flex:1 1 100%;margin:0}
#zcashPanel>.field-help:first-of-type{margin-top:var(--space-12)}
#zcashPanel>div{order:4;flex:1 1 100%;display:grid;gap:var(--space-12);margin-top:var(--space-16)}
#zcashPanel>div[hidden]{display:none}
#zcashPanel>div .btn{justify-self:start;margin:0}
#zcashPanel>form{order:5;flex:1 1 100%;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--space-8) var(--space-16);margin-top:var(--space-32);padding-top:var(--space-32);border-top:1px solid var(--line)}
#zcashPanel>form>*{grid-column:1/-1}
#zcashPanel>form h3{margin:0 0 var(--space-8);font:600 var(--fs-h3)/1.3 var(--font-display)}
#zcashPanel label{margin:var(--space-8) 0 0;font:500 var(--fs-label)/1.4 var(--font-mono);letter-spacing:.04em;color:var(--ink-soft)}
#zcashPanel input{width:100%;min-height:44px;padding:var(--space-8) var(--space-12);border:1px solid var(--line);border-radius:var(--radius);background:var(--card);color:var(--ink);font:400 var(--fs-body)/1.5 var(--font-mono)}
#zcashPanel>form .field-help{margin:var(--space-8) 0 0}
#zcashPanel>form>.btn{grid-column:1;justify-self:start;margin:var(--space-16) 0 0}
#zcashPanel>form:has(>.btn:disabled)::after{content:"Not open yet.";grid-column:2;margin-top:var(--space-16);font-size:.875rem;line-height:1.5;color:var(--ink-soft)}

/* My pieces: label above the sample, the visor control as its own row with a reason. */
#samplePiecesLabel{margin:var(--rh-cta) 0 var(--space-8);font:500 var(--fs-label)/1.4 var(--font-mono);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--ink-soft)}
#privacyControls{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-12) var(--space-16);margin-top:var(--rh-cta)}
#privacyControls>button{display:inline-flex;align-items:center;min-height:44px;margin:0;padding:var(--space-12) var(--space-20);border:1px solid var(--ink);border-radius:12px;background:transparent;color:var(--ink);font:400 1rem/1.25 var(--font-body);cursor:pointer}
#privacyControls>button:hover:not(:disabled){background:var(--tint)}
#privacyControls>button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
#privacyControls>button:disabled{border-style:dashed;border-color:color-mix(in srgb,var(--ink-soft) 60%,transparent);color:var(--ink-soft);cursor:not-allowed}
#privacyControls>div{flex:1 1 24ch;margin:0;font-size:.875rem;line-height:1.5;color:var(--ink-soft)}
#privacyControls:has(>button:disabled)>div:empty::before{content:"Not open yet."}

/* Check a buy: the disabled button keeps air above and below. */
#checkForm .btn{margin-top:var(--space-16)}
#checkResult{font-size:.875rem;line-height:1.6;color:var(--ink-soft)}

/* Closing: heading, CTA row, note. */
#closing-title+.hero-actions{margin-top:var(--rh-cta)}
#closing .publication-note{margin-top:var(--space-16)}

/* Section air: a band that follows the hero or a section keeps the rhythm. */
.rail-section+.privacy-band{margin-top:var(--space-96)}
.rail-hero+.privacy-band{margin-top:var(--space-48)}
/* The credits strip keeps 64 of air above the footer on desktop; phones and tablets already get 96 from the footer. */
@media(min-width:1024px){.privacy-strip,.private-by-strip{margin-bottom:var(--space-64)}}
/* A CTA that follows the ZEC door keeps block air above it. */
#zcashPanel+.btn{margin-top:var(--space-32)}

/* ---------- 5. Rhythm pass, 2026-09-28 ----------
   Owner: "the words are jammed up". Display and section titles get a little more leading, the kicker,
   title and caption sit on a 12px step, and the few blocks that touched their neighbours get air.
   Spacing stays on the 4pt scale; nothing here changes a layout column. */
.hero-heading h1{line-height:1.04}
.hero-heading .hero-tagline+.tech-pill{margin-top:var(--space-8)}
main section>header>.component-title{line-height:1.1}
main section>header>.kicker+.component-title{margin-top:var(--space-12)}
main section>header>.component-title+.component-caption{margin-top:var(--space-12)}
.line-row p{line-height:1.1}
#buyerHelp+#useWallet{margin-top:var(--space-12)}
#collectionShowing{margin-bottom:var(--space-16)}
.piece-marquee header .btn{margin-top:var(--space-16)}
.odds-group .sh-gcap{margin-top:var(--space-8)}
.shrive-booth .buy-choice strong{white-space:normal;line-height:1.25}
#build .shrive-plate .plate-row{padding-block:var(--space-16)}
#build .shrive-plate .plate-row .segments{margin-top:var(--space-8)}
#build .shrive-plate .segments button span{overflow-wrap:anywhere;hyphens:auto}
@media(max-width:479px){
 .booth-head{flex-wrap:wrap;row-gap:var(--space-8);white-space:normal;padding-inline:var(--space-16)}
 .tech-section .tech-row{gap:var(--space-8)}
}
