/* prompts.html and the private library page: the prompts sit on printouts. On /prompts each card shows only the first
   line (the full prompts arrive in the welcome email); the private page has the full prompts and copy buttons. */
.pl-hero h1{max-width:13ch}
.pl-hero .lede{margin-top:28px}
.pl-gate-row{display:flex; align-items:center; flex-wrap:wrap; gap:26px clamp(52px,8vw,120px); margin-top:clamp(39px,5vw,64px)}
.pl-gate-row .capture{flex:1 1 520px}
.pl-gate-row .note{max-width:13ch}
.capture .hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}

.pl-wrap{position:relative}
.pl-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(26px,3vw,39px)}
@media (max-width:820px){ .pl-grid{grid-template-columns:minmax(0,1fr)} }

.pl-card{display:flex; flex-direction:column; padding-top:26px}
.pl-top{display:flex; align-items:baseline; gap:16px; margin-top:4px}
.pl-top .thin-num{font-size:clamp(44px,4vw,60px); color:var(--paper-ink)}
.pl-top h3{font-size:clamp(20px,1.8vw,24px)}
.pl-body{margin-top:16px; font-size:16px; line-height:1.6; color:var(--paper-ink); padding:16px 18px; border:1.5px dashed var(--paper-rule); border-radius:4px; flex:1}
.pl-foot{display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px 16px; margin-top:16px}
.pl-copy{font:inherit; font-weight:500; font-size:15px; padding:10px 16px; border-radius:10px; border:2px solid #0A0F14; background:#fff; color:#0A0F14; box-shadow:4px 4px 0 #0A0F14; cursor:pointer; transition:transform .16s steps(2,end), box-shadow .16s steps(2,end)}
.pl-copy:hover{transform:translate(-1px,-2px); box-shadow:6px 6px 0 #0A0F14}
.pl-copy:active{transform:translate(3px,3px); box-shadow:1px 1px 0 #0A0F14}
.pl-more{font-size:15px; font-weight:500; color:var(--paper-ink); text-decoration:underline; text-underline-offset:3px}

/* Beehiiv subscribe form (styled in Beehiiv); the sticker only gives it room */
.bh-sticker{max-width:560px}
.bh-form{min-height:96px; margin-top:6px}