:root{--bg:#d0021b;--fg:#111;--mut:#666;--line:#ddd;--acc:#d0021b}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:max(24px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));-webkit-tap-highlight-color:transparent}
main{width:100%;max-width:420px;text-align:center;background:#fff;border-radius:16px;padding:32px 24px;box-shadow:0 10px 30px rgba(0,0,0,.25)}
h1{font-size:36px;line-height:1.1;margin:0 0 12px;font-weight:800}
.sub{font-size:18px;color:var(--mut);margin:0 0 32px}
.amounts{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:10px}
.amounts button{padding:16px 0;font-size:18px;font-weight:600;background:#fff;border:1.5px solid var(--line);border-radius:10px;cursor:pointer;color:var(--fg)}
.amounts button.on{border-color:var(--acc);background:var(--acc);color:#fff}
.custom{background:#fff;display:flex;align-items:center;border:1.5px solid var(--line);border-radius:10px;padding:0 16px;margin-bottom:16px}
.custom.on{border-color:var(--acc)}
.custom span{color:var(--mut);font-size:18px;margin-right:8px}
.custom input{flex:1;border:0;outline:0;font-size:18px;padding:16px 0;background:transparent;font-family:inherit}
.pay{width:100%;padding:18px;font-size:18px;font-weight:700;color:#fff;background:var(--acc);border:0;border-radius:10px;cursor:pointer}
.pay:disabled{opacity:.6;cursor:wait}
.error{color:var(--acc);margin:0 0 12px;font-size:14px}
.ong{margin:24px 0 0;font-size:14px;color:var(--mut)}
.ong strong{color:var(--fg)}
.heart{font-size:48px;line-height:1;margin-bottom:12px}
.field{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:16px;margin-bottom:10px;font-size:18px;font-family:inherit;outline:0}
.field:focus{border-color:var(--acc)}
.anon{display:flex;align-items:center;gap:10px;margin:4px 0 16px;font-size:16px;text-align:left;cursor:pointer}
.anon input{width:20px;height:20px;accent-color:var(--acc)}
[hidden]{display:none!important}
.custom{padding:8px 16px;margin-bottom:16px}
.custom .cur{display:flex;flex-direction:column;align-items:flex-start;margin:0;color:var(--fg)}
.custom .cur b{font-size:28px;line-height:1}
.custom .cur small{font-size:13px;font-weight:700;margin-top:6px}
.custom input{min-width:0;width:100%;text-align:right;font-size:44px;font-weight:800;padding:10px 0}
.custom input::placeholder{color:#bbb}
.custom .cents{font-size:44px;font-weight:800;color:#bbb;padding:10px 0;line-height:1.15}
button,label,input{touch-action:manipulation}
button,.anon{user-select:none;-webkit-user-select:none}
.amounts button:active{transform:scale(.97)}
.amounts button.on:active{opacity:.9}
.pay:active{opacity:.85;transform:scale(.99)}
.custom input,.custom .cents{font-size:clamp(32px,11vw,44px)}
