*{box-sizing:border-box}body{margin:0;background:#f6f1e7;color:#1c2733;font-family:Arial,sans-serif}header{max-width:1160px;margin:auto;padding:24px;display:flex;align-items:center;justify-content:space-between}a{color:#754a19;text-underline-offset:5px}.wordmark{font:34px Georgia,serif;text-decoration:none;color:#1c2733;display:flex;align-items:center;gap:10px}.wordmark img{width:26px;height:34px}main{max-width:1100px;margin:auto;padding:45px 24px 64px}.eyebrow{font-size:11px;letter-spacing:.16em;font-weight:bold;color:#754a19}h1{font:clamp(42px,7vw,82px)/1.02 Georgia,serif;letter-spacing:-.04em;margin:15px 0 22px}h1 em,h2 em{font-weight:400;color:#754a19}h2{font:32px/1.2 Georgia,serif}.lede{font-size:19px;line-height:1.5;max-width:600px}.demo-choices{display:flex;gap:12px;margin:30px 0 15px;flex-wrap:wrap}button{font:inherit;border:1px solid #baac93;background:#fffdf8;color:#1c2733;padding:13px 20px;border-radius:5px;cursor:pointer}button[aria-pressed=true],.primary{background:#1c2733;color:#fffdf8;border-color:#1c2733}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #a06c2c;outline-offset:4px}.demo-note{font-size:13px;color:#635d54;margin-bottom:36px}.demo-layout{display:grid;grid-template-columns:1fr 1fr;gap:60px}form{padding:28px;background:#fffdf8;border:1px solid #d7c9af;box-shadow:0 16px 40px -35px #1c2733}label{display:block;font-size:14px;font-weight:600;line-height:1.5;margin-bottom:18px}input,textarea{display:block;font:inherit;color:inherit;width:100%;margin-top:7px;padding:12px;border:1px solid #b9ae9a;background:white;border-radius:3px}textarea{min-height:155px;resize:vertical}.signature-heading{display:flex;align-items:start;justify-content:space-between;gap:12px}.signature-heading small{display:block;font-weight:400;color:#635d54}.signature-heading button{padding:4px 9px;font-size:12px}canvas#sig-pad{display:block;width:100%;height:150px;border:1px dashed #b9ae9a;background:#fffdf8;touch-action:none;margin:0 0 22px}#cover-preview keepze-card{display:block;width:100%;max-width:460px}#recipient-card{max-width:850px;margin:auto}#recipient-card keepze-card{display:block;width:100%}#demo-message-page{max-width:620px;background:#fffdf8;padding:30px;margin:20px auto;box-shadow:0 9px 22px -17px #1c2733;border:1px solid #d7c9af}#demo-message-page p{line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere}#demo-message-page canvas{max-width:255px;width:100%;height:auto}#message-pages{display:flex;gap:16px;justify-content:center;align-items:center;flex-wrap:wrap}#message-pages[hidden],[hidden]{display:none!important}.start-card{border-top:1px solid #d7c9af;margin-top:55px;padding-top:20px;display:flex;align-items:center;justify-content:space-between;gap:16px}.start-card a{font-weight:600}@media(max-width:700px){input,textarea{font-size:16px}header{padding:20px}main{padding:25px 20px 45px}.demo-layout{grid-template-columns:1fr;gap:24px}form{padding:20px}.start-card{align-items:start;flex-direction:column}#cover-preview{max-width:390px;margin:auto}h2{font-size:27px}}@media(prefers-reduced-motion:no-preference){#demo-message-page{animation:page-in .25s ease-out}@keyframes page-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}}
.demo-helper,.demo-media{border-top:1px solid #d7c9af;padding-top:18px;margin-bottom:24px}.demo-helper p,.demo-media p{font-size:14px;line-height:1.5}.demo-tools{display:flex;flex-wrap:wrap;gap:8px}.demo-helper button,.demo-media button{font-size:14px;padding:10px 12px}#demo-media-preview img,#demo-media-preview video{display:block;max-width:100%;max-height:260px;object-fit:contain}#demo-media-preview{margin:12px 0}#demo-message-page img,#demo-message-page video{max-width:100%;max-height:420px;object-fit:contain}#demo-complete{padding:16px;background:#e4ebdb;color:#24331c}#demo-make-another{display:inline-block;margin-bottom:20px}
/* The shared v2 face needs a bounded host before following message controls. */
#cover-preview{height:420px}#recipient-card{height:clamp(340px,65vh,640px)}
#cover-preview keepze-card-v2,#recipient-card keepze-card-v2{display:block;width:100%;height:100%}
@media(max-width:700px){#cover-preview{height:360px}}