/* ============================================================
   PROVENANCE: the typeset page, the register of numbers,
   the paper a number answers on, and a work's certificate as text.
   House tokens only: --settle --breath --lift --touch --slow --slower --slowest --beat --hush.
   ============================================================ */

/* ---------- the Provenance page ---------- */
.prv-papers{ padding:clamp(28px, 7vh, 72px) var(--gutter) 18vh; color:#1A1814; }
.prv-col{ position:relative; width:min(62ch, 100%); margin:0 auto; font-family:var(--serif); font-size:var(--fs-read); --hang:clamp(56px, 6vw, 88px); }
.prv-sec{ position:relative; padding:clamp(34px, 6vh, 60px) 0 clamp(10px, 2vh, 20px); }
/* no rule between sections (no divider lines): the space is the rule */
.prv-sec .prv-no{ transition-delay:var(--hush); }
.prv-sec.is-still .prv-no, .prv-sec.is-still .prv-body, .prv-end.is-still .prv-end-p{ transition:none !important; }
/* a head that lands still is simply there; under reduced motion it keeps the house's whole-line fade (site.css) */
@media (prefers-reduced-motion:no-preference){
  .prv-sec.is-still .cp-l{ transition:none !important; will-change:auto; }
}
.prv-hd{ display:flex; align-items:baseline; margin-left:calc(-1 * var(--hang)); }
.prv-no{ flex:0 0 var(--hang); margin:0; font-size:var(--fs-mono-s); letter-spacing:var(--tr-mono-close); line-height:1; color:rgba(26,24,20,.62);
  opacity:0; transition:opacity var(--slow) var(--settle); }
.prv-sec.is-up .prv-no{ opacity:1; }
.prv-h{ margin:0; font-family:var(--display); font-style:italic; font-weight:400;
  font-size:clamp(34px, 3.1vw, 46px); line-height:1.02; letter-spacing:-.025em; color:#1A1814; -webkit-text-fill-color:#1A1814; }
.prv-body{ margin-top:1em; opacity:0; transform:translate3d(0, 8px, 0);
  transition:opacity var(--slow) var(--settle) var(--prv-d, 0s), transform var(--slow) var(--settle) var(--prv-d, 0s); }
.prv-sec.is-up .prv-body{ opacity:1; transform:none; }
.prv-body p{ max-width:none; margin:0 0 .9em; font-family:var(--serif); font-size:var(--fs-read); line-height:1.6; color:#2a2620; }
.prv-body .prv-said{ font-style:italic; color:rgba(26,24,20,.66); }
/* a way is its words in full ink, never underlined; the hand dims it (house/hand.js) and the keyboard rings it */
.prv-body a, .prv-cert a{ color:#1A1814; text-decoration:none; transition:opacity var(--touch) var(--settle); }
@media (hover:hover){ .prv-body a:hover, .prv-way a:hover, .prv-sheet a:hover{ opacity:.62; } }
.prv-body a:focus-visible, .prv-way a:focus-visible, .prv-sheet a:focus-visible{ outline:1px solid rgba(26,24,20,.7); outline-offset:4px; }
.prv-way{ margin:1.3em 0 .4em; font-family:var(--mono); font-size:var(--fs-mono-s); letter-spacing:var(--tr-mono-close); line-height:1.6; }
.prv-way a{ color:#1A1814; text-decoration:none; transition:opacity var(--touch) var(--settle); }
.prv-sample{ margin:-.5em 0 1.1em; font-size:var(--fs-mono-xs); letter-spacing:var(--tr-mono-wide); color:rgba(26,24,20,.62); }
.prv-body .prv-sample{ font-family:var(--mono); font-size:var(--fs-mono-xs); line-height:1.6; color:rgba(26,24,20,.62); }
/* the end: one blind P, raised by light alone */
.prv-end{ display:flex; justify-content:center; margin:clamp(64px, 12vh, 140px) 0 0; }
.prv-end-p{ display:block; height:112px; width:auto; opacity:0; filter:brightness(.84);
  transition:opacity var(--slower) var(--settle), filter var(--slower) var(--settle); }
.prv-end.is-lit .prv-end-p{ opacity:1; filter:none; }
@media (max-width:759px){
  .prv-hd{ display:block; margin-left:0; }
  .prv-no{ display:block; margin:0 0 .7em; }
  .prv-h{ font-size:clamp(30px, 8.6vw, 38px); }
  .prv-body p{ font-size:17px; line-height:1.6; }
  .prv-end-p{ height:96px; }
}

/* ---------- the register of numbers ---------- */
.prv-numbers{ max-width:46rem; margin:clamp(26px, 4.6vh, 48px) 0 0; color:#1A1814; }
.prv-nh{ margin:0 0 clamp(18px, 3vh, 28px); font-family:var(--display); font-style:italic; font-weight:400;
  font-size:clamp(34px, 3.1vw, 46px); line-height:1.02; letter-spacing:-.025em; -webkit-text-fill-color:#1A1814; }
.prv-bands{ margin:0; padding:0; list-style:none; }
.prv-band, .prv-close{ position:relative; padding:16px 0 14px;
  opacity:0; transform:translate3d(0, 8px, 0);
  transition:opacity var(--slow) var(--settle), transform var(--slow) var(--settle);
  transition-delay:calc(var(--prv-d, 0s) + var(--k, 0) * var(--beat)); }
.prv-numbers.is-up .prv-band, .prv-numbers.is-up .prv-close{ opacity:1; transform:none; }
.prv-numbers .prv-rule{ transition-delay:calc(var(--prv-d, 0s) + var(--slow) + var(--k, 0) * var(--slow)); }
.prv-numbers.is-up .prv-rule{ transform:none; }
.prv-band-l{ margin:0; display:flex; flex-wrap:wrap; align-items:baseline; gap:0 .1em; }
.prv-range{ font-size:var(--fs-mono-s); letter-spacing:var(--tr-mono-close); color:#1A1814; }
.prv-dot{ font-family:var(--mono); font-size:var(--fs-mono-s); color:rgba(26,24,20,.4); white-space:pre; }
.prv-name{ font-family:var(--display); font-style:italic; font-size:clamp(22px, 1.8vw, 26px); line-height:1.1; letter-spacing:-.015em; }
.prv-band-n{ max-width:none; margin:.3em 0 0; font-size:16px; line-height:1.5; font-style:italic; color:rgba(26,24,20,.62); }
.prv-issued{ margin:.5em 0 0; padding:0; list-style:none; font-size:var(--fs-mono-s); letter-spacing:var(--tr-mono-close); line-height:1.9; }
.prv-issued a{ color:#1A1814; text-decoration:none; }
.prv-close{ margin-top:clamp(10px, 2vh, 20px); }
.prv-close p{ max-width:none; margin:0; font-size:var(--fs-read); line-height:1.6; color:#2a2620; }
@media (max-width:759px){
  .prv-band-l{ flex-direction:column; align-items:flex-start; gap:4px 0; }
  .prv-band-l .prv-dot{ display:none; }
}


/* ---------- the paper a number answers on ---------- */
.prv-sheet{ position:relative; margin:0 0 6px; padding:clamp(22px, 2.6vw, 34px) clamp(20px, 2.6vw, 34px) clamp(22px, 2.4vw, 30px);
  color:#1A1814; text-align:left;
  background-color:#F2EEE4;
  background-image:linear-gradient(168deg, rgba(255,252,244,.42) 0%, rgba(255,252,244,0) 34%), var(--fibre);
  background-size:100% 100%, 180px 180px;
  box-shadow:0 2px 6px -2px rgba(40,30,18,.10), 0 18px 34px -20px rgba(40,30,18,.26);
  opacity:0; transform:translate3d(0, 14px, 0);
  transition:opacity var(--slower) var(--settle), transform var(--slower) var(--settle); }
.prv-sheet.is-up{ opacity:1; transform:none; }
.prv-a-h{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:4px 18px; margin:0; padding-bottom:12px;
  font-size:var(--fs-mono-xs); letter-spacing:var(--tr-mono); line-height:1.5; color:rgba(26,24,20,.62); }
.prv-a-no{ color:#1A1814; }
@media (max-width:759px){ .prv-a-h{ flex-direction:column; gap:2px; } }
.prv-a-line{ margin:16px 0 0; font-family:var(--display); font-style:italic; font-weight:400;
  font-size:clamp(21px, 1.7vw, 25px); line-height:1.24; letter-spacing:-.01em; color:#1A1814; -webkit-text-fill-color:#1A1814; overflow-wrap:anywhere; }
.prv-a-more{ margin-top:20px; opacity:0; transition:opacity var(--slow) var(--settle) var(--prv-d, 0s); }
.prv-sheet.is-up .prv-a-more{ opacity:1; }
.prv-a-rows{ margin:0; display:grid; font-size:var(--fs-mono-xs); letter-spacing:var(--tr-mono-close); line-height:1.55; }
.prv-a-rows > div{ display:grid; grid-template-columns:8.6em 1fr; gap:12px; padding:7px 0; }
.prv-a-rows dt{ color:rgba(26,24,20,.62); } .prv-a-rows dd{ margin:0; color:#1A1814; text-transform:uppercase; overflow-wrap:anywhere; }
.prv-obj{ display:grid; grid-template-columns:auto 1fr; gap:18px; align-items:start; padding:14px 0 16px; }
.prv-obj.is-bare{ grid-template-columns:1fr; }
.prv-obj-plate{ display:block; height:84px; aspect-ratio:var(--ar, .7071); background:rgba(26,24,20,.05); overflow:hidden; }
.prv-obj-img{ display:block; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity var(--slow) var(--settle); }
.prv-obj-plate.is-in .prv-obj-img{ opacity:1; }
.prv-obj-t p{ margin:0; }
.prv-obj-acc{ font-size:var(--fs-mono-xs); letter-spacing:var(--tr-mono); color:rgba(26,24,20,.62); }
.prv-obj-use{ margin-top:4px !important; font-family:var(--display); font-style:italic; font-size:clamp(20px, 1.6vw, 23px); line-height:1.15; letter-spacing:-.01em; -webkit-text-fill-color:#1A1814; }
.prv-obj-meta{ margin-top:6px !important; font-size:var(--fs-mono-xs); letter-spacing:var(--tr-mono-close); color:rgba(26,24,20,.7); }
.prv-obj-arc{ display:inline-flex; gap:4px; margin-top:6px; font-size:var(--fs-mono-s); letter-spacing:0; color:#1A1814; }
.prv-obj-arc i{ font-style:normal; }
.prv-sheet .prv-cert{ margin-top:18px; }
.prv-sheet .prv-way{ margin:18px 0 0; }
.prv-sheet .prv-way a{ font-size:var(--fs-mono-s); }

/* ---------- a work's certificate, as one paragraph ---------- */
.prv-cert{ position:relative; }
.prv-cert-t{ max-width:none; margin:0; font-family:var(--serif); font-size:var(--fs-read); line-height:1.6; color:#2a2620; }
.prv-sheet .prv-cert-t{ font-size:17px; }
.prv-cert-foot{ margin:.9em 0 0; font-size:var(--fs-mono-xs); letter-spacing:var(--tr-mono); line-height:1.7; color:rgba(26,24,20,.62); }
.prv-cert-p{ display:block; height:70px; width:auto; margin:10px 0 0 -12px; }

/* ---------- Documents: care and documentation for members ----------
   typeset on the Members' white page itself, no sheet laid over it and no rule
   between its sections: a generous measure, field words in the label voice, figures in columns.
   Only the certificate is a sheet, ruled as a certificate is. It rises (slower, settle); then each
   section sets its head and brings its lines up in reading order, three beats apart. */
.prv-docs{ position:relative; margin:clamp(20px, 3.6vh, 40px) 0 clamp(56px, 12vh, 140px); color:#1A1814; }
.prv-doc{ position:relative; width:min(47rem, 100%); box-sizing:border-box;
  padding:0;
  opacity:0; transform:translate3d(0, 14px, 0);
  transition:opacity var(--slower) var(--settle) var(--prv-in, 0s), transform var(--slower) var(--settle) var(--prv-in, 0s); }
.prv-docs.is-up .prv-doc{ opacity:1; transform:none; }
.prv-docs ::selection{ background:var(--select); color:#F7F4EC; }

/* the head */
.prv-dmast{ display:flex; justify-content:space-between; gap:12px; margin:0 0 clamp(22px, 3.6vh, 36px);
  font-size:var(--fs-mono-xs); letter-spacing:var(--tr-mono-wide); line-height:1.4; color:rgba(26,24,20,.62); }
.prv-dh0{ margin:0; font-family:var(--display); font-weight:400; font-size:clamp(46px, 4.6vw, 68px); line-height:.98; letter-spacing:-.03em;
  color:#1A1814; -webkit-text-fill-color:#1A1814; }
.prv-doc .prv-dsub{ opacity:0; transform:translate3d(0, 6px, 0);
  transition:opacity var(--slow) var(--settle) var(--prv-d, 0s), transform var(--slow) var(--settle) var(--prv-d, 0s); }
.prv-docs.is-up .prv-dsub{ opacity:1; transform:none; }

/* a section: its number and its name (.prv-dhd), then its lines (.prv-dbody) */
.prv-dsec{ position:relative; margin-top:clamp(64px, 11vh, 120px); }
.prv-dhd{ margin:0 0 clamp(22px, 3vh, 30px); }
/* the quiet number before a section's name: a label, settling (house/rise.js .kk) */
.prv-dno{ margin:0 0 14px; line-height:1; color:rgba(26,24,20,.54); }
.prv-dh{ margin:0; line-height:1.04; color:#1A1814; -webkit-text-fill-color:#1A1814; }
/* a line that comes up whole: its turn (--d) is set by the page as the section lands */
.prv-ln{ opacity:0; transform:translate3d(0, 6px, 0);
  transition:opacity var(--slow) var(--settle), transform var(--slow) var(--settle);
  transition-delay:var(--d, calc(var(--prv-d, 0s) + var(--k, 0) * var(--beat) * 3)); }
.prv-dsec.is-up .prv-ln{ opacity:1; transform:none; }
/* a paragraph whose lines rise one after the other (house/rise.js): each line a beat after the
   line above, from the paragraph's own turn; a paragraph that could not be cut comes up whole */
.prv-doc .rl-i{ transition-delay:calc(var(--d, 0s) + var(--k, 0) * var(--ls, 110ms)); }   /* --ls: the section's own cadence (provenance.js pace) */
.prv-doc .kk{ transition-delay:var(--d, 0s); }
.prv-rise:not(.rl-host){ opacity:0; transform:translate3d(0, 6px, 0);
  transition:opacity var(--slow) var(--settle) var(--d, 0s), transform var(--slow) var(--settle) var(--d, 0s); }
.prv-dsec.is-up .prv-rise:not(.rl-host){ opacity:1; transform:none; }
.prv-docs.is-still .prv-doc, .prv-docs.is-still .prv-dsub,
.prv-dsec.is-still .prv-ln, .prv-dsec.is-still .prv-rise, .prv-dsec.is-still .rl-i, .prv-dsec.is-still .kk{ transition:none !important; }
@media (prefers-reduced-motion:no-preference){
  .prv-dsec.is-still .cp-l{ transition:none !important; will-change:auto; }
}
/* the reading voice: one measure of sixty-odd characters, a generous lead, air between paragraphs */
.prv-doc p{ max-width:none; }
.prv-doc .reading{ max-width:34em; margin:0 0 1em; line-height:1.68; color:#2a2620; }
.prv-doc .prv-said{ margin-top:1.5em; font-style:italic; color:rgba(26,24,20,.66); }
.prv-doc .reading:first-child{ margin-top:0; }
.prv-doc .prv-dsub{ margin:1em 0 0; font-style:italic; line-height:1.5; color:rgba(26,24,20,.7); }   /* after .reading: the line under the head */
.prv-doc a{ color:#1A1814; text-decoration:none; transition:opacity var(--touch) var(--settle); }
@media (hover:hover){ .prv-doc a:hover{ opacity:.62; } }
/* the hand on the keyboard sees where it is: a hairline around the link, the field, the word */
.prv-doc a:focus-visible{ outline:1px solid rgba(26,24,20,.7); outline-offset:4px; }
.prv-doc .prv-way{ margin:1.4em 0 .2em; }

/* the certificate: a sheet of its own on the page, ruled as a certificate is, the fields with leaders */
.prv-spec{ margin:1.5em 0 .4em; max-width:34rem; box-sizing:border-box; padding:clamp(20px, 3vw, 34px) clamp(20px, 3.2vw, 38px) clamp(16px, 2.4vw, 26px);
  background:#FFFFFF; box-shadow:0 1px 2px rgba(26,24,20,.07), 0 0 0 1px rgba(26,24,20,.045), 0 26px 50px -30px rgba(26,24,20,.30); }
.prv-spec-hd{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:4px 16px; margin:0; padding:11px 0 10px;
  border-top:1px solid rgba(26,24,20,.42); border-bottom:1px solid rgba(26,24,20,.16);
  font-size:var(--fs-mono-xs); letter-spacing:var(--tr-mono-wide); line-height:1.4; color:#1A1814; }
.prv-spec-mark{ color:rgba(26,24,20,.56); }
.prv-fields{ margin:4px 0 0; padding:0; }
.prv-f{ display:flex; align-items:baseline; padding:8px 0 7px; }
.prv-f dt{ flex:1 1 auto; display:flex; align-items:baseline; min-width:0; margin:0; white-space:nowrap;
  font-size:var(--fs-mono-xs); letter-spacing:var(--tr-mono); line-height:1.4; text-transform:uppercase; color:rgba(26,24,20,.62); }
.prv-f dt::after{ content:""; flex:1 1 auto; min-width:1.4em; margin:0 .9em 0 1em; border-bottom:1px dotted rgba(26,24,20,.34); transform:translateY(-.28em); }
.prv-f dd{ flex:0 1 auto; margin:0; text-align:right; font-family:var(--serif); font-size:17.5px; line-height:1.35; color:#1A1814;
  font-variant-numeric:lining-nums proportional-nums; }
.prv-f.is-empty dd{ font-style:italic; color:rgba(26,24,20,.6); }
.prv-doc .prv-spec-note{ margin:14px 0 0; padding-top:13px; border-top:1px solid rgba(26,24,20,.16); font-size:17px; font-style:italic; line-height:1.55; color:rgba(26,24,20,.78); }
.prv-spec-note .mono{ margin-right:.8em; font-style:normal; font-size:var(--fs-mono-xs); letter-spacing:var(--tr-mono); color:rgba(26,24,20,.56); }
.prv-spec-p{ margin:10px 0 0 !important; }
.prv-spec-p .prv-cert-p{ margin:0 0 0 -12px; }

/* labelled lines, the shipping and the care: the word in mono on the left, settling into place;
   the line beside it in the reading voice, rising; no rule between them, the
   space is the rule */
.prv-rows{ margin:1.6em 0 .2em; padding:0; max-width:46em; }
.prv-r{ display:grid; grid-template-columns:9.5em minmax(0, 34em); gap:0 clamp(20px, 2.6vw, 36px); align-items:start; margin:0 0 1.4em; padding:0; }
.prv-r:last-child{ margin-bottom:0; }
.prv-r dt{ margin:0; padding-top:.62em; line-height:1.5; color:rgba(26,24,20,.54); }
.prv-r dd{ margin:0; line-height:1.68; color:#2a2620; }
.prv-rows + .prv-said{ margin-top:1.6em; }

/* contact: the Gallery's three lines to write on, as a page */
.prv-q{ display:grid; gap:clamp(14px, 2vh, 20px); max-width:31rem; margin:1.3em 0 .5em; }
.prv-q-f{ position:relative; display:grid; gap:2px; margin:0 !important; }
.prv-q-f::before, .prv-q-f::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:1px; pointer-events:none; }
.prv-q-f::before{ background:rgba(26,24,20,.24); }
.prv-q-f::after{ background:#1A1814; transform:scaleX(0); transform-origin:0 50%; transition:transform var(--slow) var(--settle); }
.prv-q-f:focus-within::after{ transform:none; }
.prv-q-f:has([aria-invalid="true"])::before{ background:rgba(var(--safe-rgb), .78); }
.prv-q-f:has([aria-invalid="true"])::after{ background:rgba(var(--safe-rgb), .9); }   /* the field sent back to keeps its safelight while it has the hand */
.prv-q-top{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.prv-q-l{ flex:1 1 auto; cursor:text;
  line-height:1.3; color:rgba(26,24,20,.6); }
.prv-q-hint{ color:rgba(26,24,20,.62); }
.prv-q input, .prv-q textarea{ display:block; width:100%; box-sizing:border-box; margin:0; padding:3px 0 8px; border:0; border-radius:0;
  background:transparent; box-shadow:none; outline:none; -webkit-appearance:none; appearance:none;
  font:17px/1.4 var(--display); color:#1A1814; caret-color:#1A1814; }
.prv-q textarea{ resize:none; min-height:calc(4.2em + 11px); }
.prv-q input:-webkit-autofill{ -webkit-text-fill-color:#1A1814; -webkit-box-shadow:0 0 0 60px #FFFFFF inset; box-shadow:0 0 0 60px #FFFFFF inset; }   /* the browser's fill is papered over, not timed away */
.prv-q-foot{ display:flex; justify-content:flex-end; margin:2px 0 0 !important; }
/* the send is a word, not a button: its ink, its arrow, a hand target as tall as a finger */
.prv-q-send{ margin:0; padding:0; min-height:44px; border:0; border-radius:0; background:none; cursor:pointer;
  font-family:var(--display); font-style:italic; font-size:19px; line-height:1.3; color:#1A1814; transition:opacity var(--touch) var(--settle); }
@media (hover:hover){ .prv-q-send:hover{ opacity:.62; } }
.prv-q-send:focus-visible{ outline:1px solid rgba(26,24,20,.7); outline-offset:5px; }
.prv-q-state{ min-height:1.45em; margin:0 !important; font-family:var(--serif); font-style:italic; font-size:15.5px; line-height:1.45; color:rgba(26,24,20,.7); }

@media (max-width:759px){
  .prv-doc{ padding:28px 20px 40px; }
  .prv-dh0{ font-size:clamp(40px, 12vw, 52px); }
  .prv-doc .reading, .prv-r dd{ line-height:1.65; }
  .prv-f dd{ font-size:16.5px; }
  .prv-f dt::after{ margin:0 .6em 0 .7em; min-width:1em; }
  .prv-r{ grid-template-columns:1fr; gap:7px 0; margin-bottom:1.3em; }
  .prv-r dt{ padding-top:0; }
  .prv-dhd{ margin-bottom:22px; }
  .prv-dno{ margin-bottom:12px; }
}

@media (prefers-reduced-motion:reduce){
  .prv-rule, .prv-no, .prv-body, .prv-end-p, .prv-band, .prv-close, .prv-sheet, .prv-a-more, .prv-obj-img,
  .prv-doc, .prv-doc .prv-dsub, .prv-dno, .prv-ln, .prv-rise, .prv-q-f::after{ transition:none !important; }
  .prv-rule{ transform:none; }
  .prv-no, .prv-body, .prv-band, .prv-close, .prv-sheet, .prv-a-more, .prv-obj-img,
  .prv-doc, .prv-doc .prv-dsub, .prv-dno, .prv-ln, .prv-rise{ opacity:1; transform:none; }
  .prv-end-p{ opacity:1; filter:none; }
}

/* ---------- Documents as a place of Members (rooms/vault.js; documents(host, { head:false })) ----------
   Set straight on the Members paper under the place's own title: no card of its own, no head of
   its own; a reading measure in the left two thirds. Each section keeps its own type and rules. */
.mbr .prv-docs{ margin:44px 0 clamp(56px, 12vh, 140px); }
.mbr .prv-doc{ width:auto; max-width:36em; padding:0; background:none; box-shadow:none; }
.mbr .prv-dh{ line-height:1.12; }
@media (max-width:759px){
  .mbr .prv-doc{ padding:0; }
}

/* ---------- Documents, 13 October: white, and the whole width ----------
   The sheet is white and takes the room's width. On a desk each section is set
   in two columns: its name on the left, what it holds on the right. Nothing sits
   in an empty half of the page. */
.prv-doc{ background-color:#FFFFFF; background-image:none; }
.prv-docs .prv-q input:-webkit-autofill{ -webkit-box-shadow:0 0 0 60px #FFFFFF inset; box-shadow:0 0 0 60px #FFFFFF inset; }
@media (min-width:900px){
  .prv-doc, .mbr .prv-doc{ width:100%; max-width:76rem; }
  .prv-dsec{ display:grid; grid-template-columns:minmax(11rem, 1fr) minmax(0, 2.2fr); column-gap:clamp(32px, 5vw, 88px); align-items:start; }
  .prv-dsec > .prv-dhd{ grid-column:1; margin:0; padding-top:.1em; }
  .prv-dsec > .prv-dbody{ grid-column:2; min-width:0; }
  .prv-dsec .prv-spec{ margin-top:0; }
  .prv-dsec .prv-rows{ margin-top:1.6em; }
  .prv-dsec .prv-q{ max-width:34em; margin-top:0; }
}

/* ---------- Documents, round two: no lines ----------
   No rule between sections, no ruled header on the certificate, no dotted leaders, no
   underline under a field. The certificate is set as a card of eight facts, two rows of
   four: each a small label over its value. A field to write in is a soft white-grey
   ground, not a line. Every word arrives letter by letter (provenance.js, .prv-type). */
.prv-docs .prv-rule{ display:none; }
.prv-spec-hd{ border:0; padding:0 0 clamp(18px, 3vh, 28px); }
.prv-fields{ display:grid; grid-template-columns:repeat(4, minmax(0, 1fr)); gap:clamp(22px, 3.4vh, 36px) clamp(18px, 2.4vw, 36px); margin:0; }
.prv-f{ display:flex; flex-direction:column; align-items:flex-start; gap:8px; padding:0; }
.prv-f dt{ flex:none; display:block; white-space:normal; }
.prv-f dt::after{ content:none; }
.prv-f dd{ text-align:left; font-family:var(--display); font-size:clamp(20px, 1.7vw, 26px); line-height:1.2; }
.prv-doc .prv-spec-note{ border:0; margin-top:clamp(26px, 4vh, 40px); padding-top:0; }
.prv-spec-note .mono{ display:block; margin:0 0 8px; }
.prv-spec-p{ margin-top:clamp(20px, 3vh, 32px) !important; }
.prv-q-f::before, .prv-q-f::after{ content:none; }
/* no box and no grey ground anywhere. A field to write in keeps the one line the house
   allows, its baseline; the hand in it darkens that line to full ink. A link is its words in full ink,
   never underlined; the keyboard's place is shown by the word itself darkening, never by a box. */
.prv-q input, .prv-q textarea{ padding:6px 0 9px; margin-top:4px; background:transparent; border-radius:0;
  border-bottom:1px solid rgba(26,24,20,.3); transition:border-color var(--touch) var(--settle); }
.prv-q input:focus, .prv-q textarea:focus{ background:transparent; border-bottom-color:#1A1814; }
.prv-q input:focus-visible, .prv-q textarea:focus-visible{ outline:none; box-shadow:none; }
.prv-q-f:has([aria-invalid="true"]) input{ box-shadow:none; border-bottom-color:rgba(var(--safe-rgb), .9); }
.prv-q-send{ border:0; font-family:var(--display); font-style:normal; text-transform:uppercase; letter-spacing:.16em; font-size:12px; }
.prv-q-send:focus-visible{ outline:none; border:0; color:#1A1814; }
.prv-docs a, .prv-body a, .prv-way a, .prv-issued a, .prv-cert a{ border-bottom:0; padding-bottom:0; color:#1A1814; }
.prv-docs a:focus-visible, .prv-body a:focus-visible, .prv-way a:focus-visible{ outline:none; opacity:1; color:#000; }
.prv-docs .prv-dmast{ border-bottom:0; padding-bottom:0; }
.prv-docs .prv-spec-foot{ border-top:0; padding-top:0; }
.prv-numbers .prv-rule{ display:none; }
/* the paper a number answers on is a sheet lying on the page: its shadow sets it there, no hairline frames it, no rule inside it */
.prv-sheet{ box-shadow:0 2px 6px -2px rgba(40,30,18,.10), 0 18px 34px -20px rgba(40,30,18,.26); }
.prv-sheet .prv-a-h{ border-bottom:0; } .prv-sheet .prv-a-rows > div{ border-top:0; } .prv-sheet .prv-obj{ border-top:0; border-bottom:0; }
.prv-type .cp-l{ will-change:auto; }
@media (max-width:759px){
  .prv-fields{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .prv-dsec{ margin-top:64px; }
}

/* ---------- the member's certificate ----------
   A sheet of cotton board lying on the white page, the one paper thing here, so it keeps the warm white
   of board and a shadow under it. It is set as a certificate is set: the house's name and the word,
   centred; the fields on ruled lines to be written on (the line IS the thing: where the hand will
   write); the signature's line across its foot, and the blind P waiting beside it. The demo says so in
   its mark. */
.prv-spec.is-member{
  position:relative; max-width:40rem; margin:0 0 .6em;
  padding:clamp(34px, 4.4vw, 60px) clamp(28px, 4.4vw, 64px) clamp(28px, 3.6vw, 48px);
  background:#FBF9F3;
  box-shadow:0 1px 1px rgba(26,24,20,.05), 0 6px 14px -10px rgba(26,24,20,.16), 0 46px 70px -48px rgba(26,24,20,.42);
}
.prv-cert-top{ text-align:center; margin:0 0 clamp(30px, 4.4vh, 46px); }
.prv-cert-top p{ margin:0; }
.prv-cert-house{ font-size:12px; letter-spacing:.24em; text-transform:uppercase; color:#1A1814; }
.prv-cert-word{ margin:.18em 0 .3em !important; font-family:var(--display); font-style:italic; font-weight:400;
  font-size:clamp(40px, 3.6vw, 54px); line-height:1.05; letter-spacing:-.02em; color:#1A1814; }
.prv-spec.is-member .prv-spec-mark{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:rgba(26,24,20,.56); }
.prv-spec.is-member .prv-fields{ grid-template-columns:repeat(2, minmax(0, 1fr)); gap:clamp(20px, 3vh, 30px) clamp(24px, 3.4vw, 48px); }
.prv-spec.is-member .prv-f{ gap:6px; }
.prv-spec.is-member .prv-f dt{ font-size:10.5px; letter-spacing:.14em; color:rgba(26,24,20,.56); }
.prv-spec.is-member .prv-f dd{ align-self:stretch; padding:0 0 7px; border-bottom:1px solid rgba(26,24,20,.22);
  font-family:var(--display); font-size:clamp(19px, 1.5vw, 22px); line-height:1.25; color:#1A1814; }
.prv-spec.is-member .prv-f dd.num{ font-family:var(--num); }
.prv-spec.is-member .prv-f.is-empty dd{ font-size:15px; line-height:calc(clamp(19px, 1.5vw, 22px) * 1.25); color:rgba(26,24,20,.42); }
.prv-cert-foot{ display:flex; align-items:flex-end; gap:clamp(20px, 3vw, 40px); margin-top:clamp(34px, 5vh, 56px); }
.prv-cert-sign{ flex:1 1 auto; margin:0 !important; display:flex; flex-direction:column; gap:7px; }
.prv-cert-sign-w{ display:block; padding:0 0 7px; border-bottom:1px solid rgba(26,24,20,.42);
  font-family:var(--display); font-style:italic; font-size:15px; line-height:1.9; color:rgba(26,24,20,.42); }
.prv-cert-sign-l{ font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:rgba(26,24,20,.56); }
.prv-spec.is-member .prv-spec-p{ flex:0 0 auto; margin:0 !important; }
.prv-spec.is-member .prv-cert-p{ height:64px; margin:0; }
@media (max-width:759px){
  .prv-spec.is-member{ padding:30px 22px 26px; }
  .prv-spec.is-member .prv-fields{ grid-template-columns:1fr 1fr; }
}

/* ---------- 20 October: the long sections, folded ----------
   Guarantee, Shipping and Care show their first line; the rest lies folded under it and opens like a letter: the
   paper's height opens on settle while the leaf turns down from its crease (a few degrees, never a flip) and the
   ink comes up with it. Unfold / Fold is one quiet word under the first line. */
.prv-fold{ display:grid; grid-template-rows:0fr; perspective:900px;
  transition:grid-template-rows var(--slower) var(--settle); }
.prv-fold.is-open{ grid-template-rows:1fr; }
.prv-fold-in{ min-height:0; overflow:hidden; transform-origin:50% 0;
  transform:rotateX(-18deg) translate3d(0, -10px, 0); opacity:0;
  transition:transform var(--slower) var(--settle), opacity var(--slow) var(--settle); }
.prv-fold.is-open .prv-fold-in{ transform:none; opacity:1; transition-delay:var(--beat, 60ms); }
/* the paper's own edge while it opens: a breath of shade at the crease, gone once flat */
.prv-fold-in::before{ content:""; display:block; height:1.1em; margin-bottom:-1.1em;
  background:linear-gradient(to bottom, rgba(26,24,20,.06), rgba(26,24,20,0)); opacity:1; transition:opacity var(--slower) var(--settle); }
.prv-fold.is-open .prv-fold-in::before{ opacity:0; }
.prv-doc .prv-fold-in > :first-child{ margin-top:0; }
.prv-unfold{ display:inline-block; margin:.9em 0 0; padding:.4em 0; background:none; border:0; cursor:pointer;
  color:rgba(26,24,20,.6); }
.prv-unfold:hover, .prv-unfold:focus-visible{ color:#1A1814; outline:none; }
.prv-dbody > .prv-rows:first-child{ margin-top:0; }
@media (prefers-reduced-motion:reduce){
  .prv-fold, .prv-fold-in, .prv-fold-in::before{ transition:none !important; }
  .prv-fold-in{ transform:none; }
}

/* 28 October (P: "the paper needs better rendering"): the certificate as a sheet of cotton board in a raking light.
   Its fibre (a fine noise, laid in multiply), the light coming across it from the upper left, a blind-debossed border
   pressed a little in from its edge, the cut edge of the board catching the light at its foot, and the two shadows a
   sheet lying on a table throws: one tight at its contact, one wide and soft */
.prv-spec.is-member{
  background:
    radial-gradient(130% 90% at 12% -10%, rgba(255,255,255,.95) 0%, rgba(255,255,255,0) 58%),
    linear-gradient(172deg, #FDFBF6 0%, #F8F4EA 62%, #F3EEE2 100%);
  box-shadow:
    0 0 0 .5px rgba(26,24,20,.07),
    0 1px 0 #E6DFCF,
    0 2px 3px rgba(26,24,20,.07),
    0 14px 24px -14px rgba(26,24,20,.22),
    0 70px 90px -56px rgba(26,24,20,.42);
  isolation:isolate;
}
.prv-spec.is-member::before{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.55; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .55  0 0 0 0 .5  0 0 0 0 .42  0 0 0 .22 0'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23f)'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .05' numOctaves='2' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 .6  0 0 0 0 .55  0 0 0 0 .45  0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='600' height='600' filter='url(%23g)'/%3E%3C/svg%3E");
  background-size:240px 240px, 600px 600px;
}
.prv-spec.is-member::after{
  content:""; position:absolute; inset:clamp(12px, 1.4vw, 18px); pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(26,24,20,.07), inset 1px 1px 0 1px rgba(26,24,20,.05), 1px 1px 0 0 rgba(255,255,255,.95);
}
