.paper::before,.paper-swatch::before {
  background-image:linear-gradient(var(--paper-color,#fff),var(--paper-color,#fff)),var(--paper-detail,linear-gradient(transparent,transparent)),linear-gradient(rgb(255 255 255 / var(--paper-wash,0)),rgb(255 255 255 / var(--paper-wash,0))),url('handmade-paper.png');
  background-size:100% 100%,33.333% auto,100% 100%,100% 100%;
  background-repeat:no-repeat,repeat,no-repeat,no-repeat;
  background-blend-mode:multiply,multiply,normal,normal;
  filter:var(--paper-filter,brightness(1.035) saturate(.55) contrast(1.04));
}
#promise-form { position:relative; }
.paper-picker { display:flex; justify-content:center; flex-wrap:wrap; gap:6px; margin:0 0 16px; }
.paper-swatch { width:44px; height:44px; padding:7px; border:0; background:transparent; border-radius:50%; }
.paper-swatch::before { content:''; display:block; width:100%; height:100%; border-radius:50%; background:linear-gradient(var(--paper-color),var(--paper-color)),url('handmade-paper.png') center / cover; background-blend-mode:multiply; filter:var(--paper-filter); box-shadow:inset 0 0 0 1px #51462c30,0 1px 3px #51462c24; }
.paper-swatch[aria-pressed=true] { box-shadow:inset 0 0 0 2px #646b53; }
.paper-swatch:hover { transform:scale(1.08); }
#promise-form:has(> .paper[hidden]) > .paper-picker { display:none; }
@media(max-width:600px) {
  .paper-picker { gap:4px; margin-bottom:12px; }
  #promise-form .paper-bottom { flex-wrap:wrap; gap:6px; }
}

/* Each paper has its own coordinated, readable ink palette. */
#promise-form .paper textarea,
#received .paper #received-promise { color:var(--paper-ink,#3d4838); }
#promise-form .paper textarea::placeholder { color:var(--paper-muted,#7b8067); opacity:1; }
#promise-form .paper #connector,
#received .paper h2,
.paper .paper-top > span:last-child { color:var(--paper-accent,#a3466b); }
.paper .paper-top,.paper .paper-bottom,.paper .promise-count { color:var(--paper-muted,#797c66); }
.paper .paper-brand,.paper .paper-brand > span:first-child { color:var(--paper-ink,#3d4838); }
#promise-form .paper textarea { border-bottom-color:var(--paper-muted,#abae8e); caret-color:var(--paper-ink,#3d4838); }
#promise-form .paper textarea:focus { border-bottom-color:var(--paper-accent,#a3466b); }
.paper .promise-count.is-over-limit { color:#a3466b; }
