:root{--ink:#16131a;--mute:#5c564f;--paper:#f8fafc;--cobalt:#0f766e;--line:#dbe3ea}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--paper);color:var(--ink)}
.banner{margin:0;padding:.55rem 1rem;text-align:center;font-size:11px;letter-spacing:.06em;text-transform:uppercase;background:var(--ink);color:#f5efe6}
main{max-width:420px;margin:0 auto;padding:2rem 1.25rem 3rem}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cobalt);margin:0 0 .5rem}
h1{font-family:Georgia,serif;margin:0 0 .6rem;font-size:2.1rem}
.lede{color:var(--mute);line-height:1.6;margin:0 0 1.25rem}
#pad{width:100%;max-width:280px;height:auto;display:block;border:1px solid var(--line);border-radius:1rem;background:#fff;touch-action:none}
.row{display:flex;gap:.5rem;margin-top:1rem}
button{border:0;background:var(--cobalt);color:#fff;font:inherit;font-weight:700;padding:.7rem 1rem;border-radius:.75rem;cursor:pointer}
button.ghost{background:#e2e8f0;color:var(--ink)}
.out{margin-top:1rem;font-weight:700}
footer{text-align:center;padding:0 1rem 2rem;font-size:.8rem;color:var(--mute)}footer a{color:var(--cobalt)}