/* Shabbos Away: Buy the builder a coffee */
.sac{--c-espresso:#2f1b10;--c-roast:#4b2e1e;--c-latte:#c9a27c;--c-foam:#fff6ea;--c-cream:#f7ebdc;--c-caramel:#b8742f;--c-gold:#e9a93b;--c-ink:#2a1d14;--c-muted:#7a6557;--c-navy:#1f3a5f;
  font-family:'Assistant',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;color:var(--c-ink);max-width:520px;margin:0 auto;background:linear-gradient(170deg,var(--c-foam),var(--c-cream) 60%,#f1dfc9);border:1px solid #e3cfb6;border-radius:22px;padding:22px 22px 18px;box-shadow:0 10px 30px rgba(75,46,30,.12);position:relative;overflow:hidden;line-height:1.45}
.sac *{box-sizing:border-box}
.sac:before{content:'';position:absolute;inset:auto -40px -60px auto;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle at 30% 30%,rgba(201,162,124,.45),transparent 60%);pointer-events:none}
.sac-top{display:flex;align-items:center;gap:16px}
.sac-cup{width:92px;height:92px;flex:none;position:relative}
.sac-cup svg{width:100%;height:100%;overflow:visible}
.sac-steam path{fill:none;stroke:#b08a6a;stroke-width:3;stroke-linecap:round;opacity:0;animation:sac-steam 2.8s ease-in-out infinite}
.sac-steam path:nth-child(2){animation-delay:.6s}
.sac-steam path:nth-child(3){animation-delay:1.2s}
@keyframes sac-steam{0%{opacity:0;transform:translateY(4px) scaleX(1)}30%{opacity:.75}70%{opacity:.35}100%{opacity:0;transform:translateY(-14px) scaleX(1.15)}}
.sac h3{margin:0;font-size:22px;line-height:1.15;font-weight:800;color:var(--c-espresso);letter-spacing:-.2px}
.sac h3 span{color:var(--c-caramel)}
.sac .sub{margin:6px 0 0;font-size:14.5px;color:var(--c-muted)}
.sac .amts{display:flex;gap:8px;margin:18px 0 12px;flex-wrap:wrap}
.sac .amt{flex:1;min-width:84px;border:2px solid #e3cfb6;background:#fff;border-radius:14px;padding:10px 8px;text-align:center;cursor:pointer;font-family:inherit;color:var(--c-ink);transition:transform .12s,border-color .12s,box-shadow .12s}
.sac .amt .cups{font-size:20px;letter-spacing:-3px}
.sac .amt .n{display:block;font-weight:800;font-size:15px;margin-top:2px}
.sac .amt .pr{display:block;font-size:12.5px;color:var(--c-muted)}
.sac .amt:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(75,46,30,.14)}
.sac .amt.on{border-color:var(--c-caramel);background:#fff3e2;box-shadow:0 6px 16px rgba(184,116,47,.22)}
.sac .custom{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-size:14px;color:var(--c-muted)}
.sac .custom input{width:90px;border:2px solid #e3cfb6;border-radius:10px;padding:8px 10px;font-family:inherit;font-size:15px;font-weight:700;color:var(--c-ink);background:#fff}
.sac .msg{width:100%;border:2px solid #e3cfb6;border-radius:12px;padding:10px 12px;font-family:inherit;font-size:14px;resize:vertical;min-height:54px;background:#fff;color:var(--c-ink);margin:0 0 12px}
.sac .pay{display:flex;flex-direction:column;gap:8px}
.sac .pay a,.sac .pay button{display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;border-radius:14px;padding:13px 16px;font-weight:800;font-size:16px;border:0;cursor:pointer;font-family:inherit;transition:transform .12s,filter .12s}
.sac .pay a:hover,.sac .pay button:hover{transform:translateY(-1px);filter:brightness(1.05)}
.sac .pay .primary{background:var(--c-caramel);color:#fff;box-shadow:0 8px 20px rgba(184,116,47,.35)}
.sac .pay .alt{background:#fff;color:var(--c-roast);border:2px solid #e3cfb6;font-size:14px;padding:10px 14px;font-weight:700}
.sac .pay .alts{display:flex;flex-wrap:wrap;gap:8px}
.sac .pay .alts a,.sac .pay .alts button{flex:1;min-width:120px}

.sac .wa{display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;border-radius:14px;padding:12px 16px;font-weight:800;font-size:15px;margin-top:8px;background:#25D366;color:#063d1e;transition:transform .12s,filter .12s}
.sac .wa:hover{transform:translateY(-1px);filter:brightness(1.05)}
.sac .wa svg{flex:none}
.sac .zelle{font-size:13.5px;color:var(--c-muted);background:#fff;border:2px dashed #e3cfb6;border-radius:12px;padding:10px 12px;margin-top:4px;text-align:center}
.sac .zelle b{color:var(--c-ink);user-select:all}
.sac .tiny{font-size:12px;color:var(--c-muted);margin:12px 0 0;text-align:center}
.sac .thanks{margin-top:12px;background:#fff;border-radius:12px;padding:10px 12px;font-size:13.5px;color:var(--c-roast);border:1px solid #e3cfb6}
.sac .beans{position:absolute;right:16px;top:14px;font-size:22px;opacity:.5;transform:rotate(-12deg)}
/* floating button */
.sac-fab{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:9000;display:flex;align-items:center;gap:0;background:var(--c-espresso,#2f1b10);color:#fff;border:0;border-radius:999px;padding:10px 16px 10px 12px;font-family:'Assistant',system-ui,sans-serif;font-weight:800;font-size:14px;box-shadow:0 10px 26px rgba(47,27,16,.38);cursor:pointer;transition:transform .15s;text-decoration:none}
.sac-fab.left{right:auto;left:16px}
.sac-fab:hover{transform:translateY(-2px)}
.sac-fab .ic{font-size:20px;margin-right:8px;display:inline-block;animation:sac-bob 3s ease-in-out infinite}
@keyframes sac-bob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-2px) rotate(-6deg)}}
@media (max-width:480px){.sac-fab .txt{display:none}.sac-fab{padding:12px 14px}.sac-fab .ic{margin:0}}
.sac-modal{position:fixed;inset:0;z-index:9500;background:rgba(40,25,15,.55);display:flex;align-items:flex-end;justify-content:center;padding:0}
.sac-modal .sac{width:100%;max-width:520px;max-height:92vh;overflow:auto;border-radius:22px 22px 0 0;animation:sac-up .22s ease-out}
@media (min-width:600px){.sac-modal{align-items:center;padding:20px}.sac-modal .sac{border-radius:22px}}
@keyframes sac-up{from{transform:translateY(30px);opacity:0}to{transform:none;opacity:1}}
.sac .close{position:absolute;right:12px;top:10px;background:rgba(47,27,16,.08);border:0;border-radius:50%;width:32px;height:32px;font-size:18px;color:var(--c-roast);cursor:pointer;z-index:2}
@media print{.sac-fab,.sac-modal{display:none!important}}
