:root{
  --ink:#4A5D7E; --ink-d:#3A4A66; --soft:#8E7CA6; --soft-d:#6F5E8C;
  --bg:#F7F8FB; --panel:#FFFFFF; --line:#DDE2EC; --line-2:#EEF1F6;
  --text:#2A2A2A; --muted:#7A8295; --soft-bg:#F3F0F7; --ok:#5B8C7B;
  --radius:18px; --shadow:0 10px 40px rgba(74,93,126,.08); --shadow-sm:0 4px 18px rgba(74,93,126,.07);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Segoe UI',Calibri,system-ui,-apple-system,sans-serif;
  background:
    radial-gradient(1200px 600px at 80% -10%, #EDE8F4 0%, transparent 55%),
    radial-gradient(900px 500px at -10% 10%, #E6ECF6 0%, transparent 50%),
    var(--bg);
  color:var(--text); min-height:100vh; line-height:1.55; -webkit-font-smoothing:antialiased;
}
.device{
  max-width:460px; margin:24px auto; background:var(--panel); border-radius:30px;
  box-shadow:var(--shadow); overflow:hidden; border:1px solid var(--line);
  min-height:90vh; display:flex; flex-direction:column;
}
@media(max-width:520px){ .device{margin:0;border-radius:0;border:none;min-height:100vh;} }
.topbar{
  display:flex; align-items:center; gap:10px; padding:16px 20px;
  border-bottom:1px solid var(--line-2); position:sticky; top:0;
  background:rgba(255,255,255,.9); backdrop-filter:blur(8px); z-index:5; min-height:60px;
}
.topbar .back{text-decoration:none;color:var(--ink);font-size:22px;line-height:1;padding:4px 8px;border-radius:10px;}
.topbar .back:hover{background:var(--line-2);}
.topbar .brand{font-weight:700;color:var(--ink);font-size:15px;display:flex;align-items:center;gap:7px;}
.topbar .star{color:var(--soft);}
.topbar .lang{margin-left:auto;display:flex;gap:4px;}
.topbar .lang a{font-size:11.5px;color:var(--muted);border:1px solid var(--line);border-radius:20px;padding:4px 9px;text-decoration:none;background:#fff;}
.topbar .lang a.on{border-color:var(--soft);color:var(--soft-d);font-weight:700;}
.screen{padding:26px 22px 34px;flex:1;animation:fade .4s ease;}
@keyframes fade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
h1{font-size:25px;color:var(--ink);font-weight:700;margin-bottom:6px;}
h2{font-size:18px;color:var(--ink-d);font-weight:700;margin:18px 0 8px;}
p{color:#4a4f5c;font-size:14.5px;margin-bottom:12px;}
.lead{color:var(--muted);font-size:14px;margin-bottom:18px;}
.center{text-align:center;} .muted{color:var(--muted);} .small{font-size:12.5px;} .italic{font-style:italic;}
.btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;border:none;cursor:pointer;
  font-size:15px;font-weight:600;padding:14px 18px;border-radius:14px;transition:.18s;font-family:inherit;text-decoration:none;
  margin-bottom:10px;}
.btn:last-child{margin-bottom:0;}
.btn-primary{background:var(--ink);color:#fff;box-shadow:0 6px 18px rgba(74,93,126,.25);}
.btn-primary:hover{background:var(--ink-d);transform:translateY(-1px);}
.btn-soft{background:var(--soft);color:#fff;box-shadow:0 6px 18px rgba(142,124,166,.28);}
.btn-soft:hover{background:var(--soft-d);transform:translateY(-1px);}
.btn-ghost{background:#fff;color:var(--ink);border:1.5px solid var(--line);}
.btn-ghost:hover{border-color:var(--ink);}
/* Um <form> que envolve um botão herda o mesmo respiro, e o botão interno
   não soma margem extra. Assim os botões nunca ficam colados. */
form{margin-bottom:10px;}
form:last-child{margin-bottom:0;}
form .btn{margin-bottom:0;}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none;}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow-sm);margin-bottom:14px;}
.pill{display:inline-block;background:var(--soft-bg);color:var(--soft-d);font-size:12px;font-weight:600;padding:5px 12px;border-radius:20px;}
.divider{height:1px;background:var(--line-2);margin:18px 0;}
.hero{text-align:center;padding:18px 4px 6px;} .hero .sym{font-size:40px;color:var(--soft);}
.vows{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:14px 0 22px;}
.vow{font-size:12px;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:20px;padding:6px 12px;}
label{display:block;font-size:13px;font-weight:600;color:var(--ink-d);margin:14px 0 6px;}
.req{color:var(--soft-d);}
input[type=text],input[type=email],input[type=tel]{width:100%;padding:13px 14px;border:1.5px solid var(--line);
  border-radius:12px;font-size:15px;font-family:inherit;color:var(--text);background:#fff;transition:.15s;}
input:focus{outline:none;border-color:var(--soft);box-shadow:0 0 0 3px rgba(142,124,166,.15);}
.hint{font-size:12px;color:var(--muted);margin-top:5px;}
.check{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:13px;color:#4a4f5c;}
.check input{margin-top:3px;width:16px;height:16px;accent-color:var(--soft);}
.opt{display:flex;gap:10px;align-items:center;border:1.5px solid var(--line);border-radius:12px;padding:11px 14px;margin-top:8px;cursor:pointer;font-size:14px;transition:.15s;}
.opt:hover{border-color:var(--soft);}
.opt.sel{border-color:var(--soft);background:var(--soft-bg);}
.opt .rb{width:18px;height:18px;border-radius:50%;border:2px solid var(--line);flex-shrink:0;position:relative;}
.opt.sel .rb{border-color:var(--soft);}
.opt.sel .rb::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--soft);}
.icon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:8px;}
.icon-tile{background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:12px 6px 9px;text-align:center;cursor:pointer;transition:.16s;}
.icon-tile:hover{border-color:var(--soft);transform:translateY(-2px);box-shadow:var(--shadow-sm);}
.icon-tile.sel{border-color:var(--soft);background:var(--soft-bg);box-shadow:0 0 0 3px rgba(142,124,166,.12);}
.icon-tile svg{display:block;margin:0 auto 5px;}
.icon-tile .nm{font-size:11px;color:var(--ink-d);font-weight:600;line-height:1.25;}
.seal{width:74px;height:74px;border-radius:50%;background:var(--soft-bg);display:flex;align-items:center;justify-content:center;margin:6px auto 16px;color:var(--soft);font-size:34px;}
.seal.green{background:#E6F0EC;color:var(--ok);}
.timer-wrap{text-align:center;padding:8px 0 4px;}
.ring{position:relative;width:210px;height:210px;margin:10px auto 4px;}
.ring svg{transform:rotate(-90deg);}
.ring .num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.ring .num .t{font-size:46px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;}
.ring .num .l{font-size:12px;color:var(--muted);letter-spacing:1px;text-transform:uppercase;}
.guide{min-height:46px;color:var(--soft-d);font-style:italic;font-size:15px;margin:10px 14px 4px;transition:.5s;}
.serving-for{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:center;
  background:var(--soft-bg);color:var(--soft-d);font-size:13px;font-weight:600;
  padding:6px 14px;border-radius:20px;margin:4px auto 0;max-width:90%;}
.serving-for svg{flex-shrink:0;}
.sound-toggle{display:inline-flex;align-items:center;gap:6px;margin:10px auto 0;cursor:pointer;
  background:#fff;border:1.5px solid var(--line);color:var(--soft-d);font-family:inherit;
  font-size:12.5px;font-weight:600;padding:6px 14px;border-radius:20px;transition:.15s;}
.sound-toggle:hover{border-color:var(--soft);}
.sound-toggle.muted{color:var(--muted);}
.name-card{text-align:center;background:linear-gradient(160deg,#fff,#FBFAFD);border:1px solid var(--line);border-radius:var(--radius);padding:26px 20px;box-shadow:var(--shadow-sm);margin:6px 0 4px;}
.name-card .who{font-size:13px;color:var(--muted);letter-spacing:.5px;}
.name-card .nm{font-size:30px;color:var(--ink);font-weight:700;margin:4px 0 14px;}
.name-card .need{font-size:13px;color:var(--soft-d);margin-top:8px;font-weight:600;}
.agg{background:var(--soft-bg);border-radius:14px;padding:16px;text-align:center;margin-bottom:14px;}
.agg .n{font-size:34px;font-weight:700;color:var(--soft-d);}
.agg .c{font-size:13px;color:var(--soft-d);}
.menu-card{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:16px;text-decoration:none;transition:.16s;margin-bottom:12px;}
.menu-card:hover{border-color:var(--soft);transform:translateY(-2px);box-shadow:var(--shadow-sm);}
.menu-card .mi{width:44px;height:44px;border-radius:12px;background:var(--soft-bg);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.menu-card .mt{font-size:15px;font-weight:700;color:var(--ink);}
.menu-card .md{font-size:12.5px;color:var(--muted);}
.menu-card .arr{margin-left:auto;color:var(--line);font-size:20px;}
.breath{width:150px;height:150px;border-radius:50%;margin:24px auto;background:radial-gradient(circle,#EDE8F4,#DCE6F2);
  display:flex;align-items:center;justify-content:center;color:var(--soft-d);font-size:13px;animation:breathe 8s ease-in-out infinite;}
@keyframes breathe{0%,100%{transform:scale(.82);opacity:.7;}50%{transform:scale(1.05);opacity:1;}}
@media(prefers-reduced-motion:reduce){.breath{animation:none;}}
.footnote{margin-top:22px;text-align:center;font-size:11.5px;color:#a8aebb;}
.crisis-link{text-align:center;margin-top:20px;}
.crisis-link a{color:#9AA3B2;font-size:12px;text-decoration:none;border-bottom:1px dotted #C7CDD8;}
.crisis-link a:hover{color:var(--soft-d);border-color:var(--soft);}
.crisis-note{background:#FBFBFD;border:1px solid var(--line);border-radius:12px;padding:13px 16px;
  color:var(--muted);font-size:14px;line-height:1.5;margin-top:4px;margin-bottom:18px;text-align:left;}
.crisis-note a{color:var(--soft-d);font-weight:600;text-decoration:none;border-bottom:1px solid var(--line);}
.crisis-note a:hover{border-color:var(--soft);}
.donate-note{background:#fff;border:1px dashed var(--line);border-radius:14px;padding:14px;font-size:13px;color:#4a4f5c;margin-bottom:14px;}
.flash{background:#FDECEC;color:#A4423A;border:1px solid #F3C9C5;border-radius:12px;padding:11px 14px;font-size:13.5px;margin-bottom:16px;}
.flash.ok{background:#E6F0EC;color:#3F6B5B;border-color:#CBE3D8;}
a.txtlink{color:var(--soft-d);font-size:13px;text-decoration:none;border-bottom:1px solid var(--line);}
/* Campo-armadilha anti-bot: invisível para humanos, presente no HTML para bots. */
.hp-field{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;overflow:hidden;opacity:0;}
