:root{color-scheme:light;--paper:#edece7;--ink:#20211f;--red:#d83b2e;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper)}
*{box-sizing:border-box}
body{margin:0;min-height:100svh;padding:72px 28px 40px;display:grid;place-items:center}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.15;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' opacity='.24' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
main{width:min(100%,540px);position:relative}
.signal{width:72px;height:72px;margin-bottom:34px;position:relative}
.signal svg{display:block;width:100%;height:100%}
h1{font-size:clamp(36px,6vw,50px);letter-spacing:-2.1px;line-height:1.04;font-weight:500;margin:0 0 32px}
form{width:100%;position:relative}
textarea{display:block;width:100%;min-height:184px;max-height:50svh;resize:vertical;border:1px solid #777871;border-radius:0;background:#ffffff26;padding:18px;color:var(--ink);font:400 20px/1.45 Arial,Helvetica,sans-serif;outline:none;transition:border-color .15s,box-shadow .15s;-webkit-appearance:none}
textarea:focus{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.trap{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;min-height:54px}
#status{font:14px/1.3 'Courier New',monospace;margin:0;color:var(--ink)}
#status[data-error]{color:#ab2a20}
button{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:28px;min-width:174px;min-height:54px;border:0;border-radius:0;padding:14px 18px;background:var(--red);color:#fff;font:400 18px/1 Arial,Helvetica,sans-serif;cursor:pointer;touch-action:manipulation;transition:background .15s}
button:hover{background:#bd3025}button:active{transform:translateY(1px)}button:focus-visible{outline:2px solid var(--ink);outline-offset:4px}button:disabled{cursor:wait;opacity:.65}
button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.4}
form[data-success]>textarea,form[data-success]>.actions{visibility:hidden}
#success{position:absolute;inset:0;border:1px solid var(--ink);background:var(--paper);align-items:center;justify-content:center;flex-direction:column;gap:22px}
#success:not([hidden]){display:flex}
#success span{font:28px/1.2 'Courier New',monospace;animation:success-in .35s ease-out both}
#success svg{width:80px;height:80px;fill:none;animation:success-in .35s ease-out both}
#success circle{stroke:var(--ink);stroke-width:1}
#success path{stroke:var(--red);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
@keyframes success-in{from{transform:translateY(8px) scale(.9)}to{transform:translateY(0) scale(1)}}
#prompts{margin-top:48px;border-top:1px solid #777871;padding-top:28px;scroll-margin-top:28px;outline:none}
#prompts blockquote{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font:16px/1.6 'Courier New',monospace}
#prompts blockquote+blockquote{margin-top:28px;padding-top:28px;border-top:1px solid #aaa}
#prompts a{color:inherit;text-underline-offset:3px}
@media(max-width:600px){body{padding:max(52px,env(safe-area-inset-top)) 24px max(32px,env(safe-area-inset-bottom));place-items:start center}main{margin-top:clamp(0px,7svh,64px)}.signal{margin-bottom:32px}h1{font-size:40px;letter-spacing:-1.8px;margin-bottom:28px}textarea{min-height:188px}button{min-width:168px}}
@media(max-width:350px){body{padding-left:20px;padding-right:20px}h1{font-size:35px}button{min-width:150px;gap:18px}}
@media(max-width:600px) and (max-height:700px){body{padding-top:max(28px,env(safe-area-inset-top))}main{margin-top:12px}.signal{margin-bottom:24px}h1{margin-bottom:24px}textarea{min-height:168px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
