/* Missão Secreta da Iara — visual compartilhado pela missão e pela galeria.
   Paleta e traço tirados do convite e do banner da festa: aquarela pastel
   (rosa, lilás, verde, amarelo), contorno preto de desenho à mão, sombras
   "de adesivo" chapadas e brilhinhos ✦. */
:root{
  --pink:#ec3f8f; --pink-hi:#ff6fb1; --pink-soft:#ffd6ea;
  --lilac:#8f55d6; --lilac-soft:#eadcff;
  --green:#5cb83c; --green-soft:#d8f3c6;
  --yellow:#ffd23f; --yellow-soft:#fff2b8;
  --ink:#2a1b38; --ink-mid:#57476a; --ink-soft:#7d6e8f;
  --paper:#fffdf9; --bg:#fff8f2;
  --line:2.5px solid var(--ink);
  --shadow:4px 4px 0 var(--ink);
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none !important}

body{
  color:var(--ink);font-family:'Nunito',system-ui,sans-serif;min-height:100dvh;
  background:var(--bg);
  /* manchas de aquarela fixas atrás de tudo, como no banner */
  background-image:
    radial-gradient(38vmax 30vmax at 0% 0%,   rgba(255,166,210,.55), transparent 70%),
    radial-gradient(34vmax 28vmax at 100% 12%, rgba(196,170,255,.50), transparent 70%),
    radial-gradient(36vmax 30vmax at 8% 62%,  rgba(183,236,160,.45), transparent 70%),
    radial-gradient(34vmax 28vmax at 100% 78%, rgba(255,228,120,.45), transparent 70%),
    radial-gradient(40vmax 30vmax at 50% 105%, rgba(255,166,210,.45), transparent 70%);
  background-attachment:fixed;
}

/* ── título "bolha" do banner ─────────────────────────── */
.bubble{
  font-family:'Lilita One',system-ui,sans-serif;font-weight:400;letter-spacing:.01em;
  color:var(--pink-hi);-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;
  text-shadow:0 4px 0 var(--ink);line-height:1.05;
}
.hand{font-family:'Caveat',cursive;font-weight:700}

/* ── adesivos (cartões, botões, chips) ───────────────── */
.sticker{background:var(--paper);border:var(--line);border-radius:18px;box-shadow:var(--shadow)}

button,.btn{
  font-family:'Lilita One',system-ui,sans-serif;font-size:19px;letter-spacing:.02em;
  border:var(--line);border-radius:999px;padding:13px 26px;cursor:pointer;
  background:var(--pink);color:#fff;box-shadow:var(--shadow);
  transition:transform .08s ease, box-shadow .08s ease, opacity .2s;
  text-decoration:none;display:inline-block;text-align:center;
  -webkit-tap-highlight-color:transparent;
}
button:active,.btn:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}
button:disabled{opacity:.5;cursor:default}
button.ghost,.btn.ghost{background:var(--paper);color:var(--ink)}
button.lilac{background:var(--lilac)} button.green{background:var(--green)}

.chip{display:inline-flex;align-items:center;gap:6px;font-family:'Lilita One',sans-serif;
  font-size:14px;letter-spacing:.04em;padding:5px 13px;border:2px solid var(--ink);
  border-radius:999px;background:var(--pink-soft);text-transform:uppercase}
.chip.video{background:var(--lilac-soft)}
.chip.boomerang{background:var(--green-soft)}

a.link{color:var(--ink-mid);font-weight:700;text-decoration:none;
  border-bottom:2px dashed var(--pink);padding-bottom:1px}

.fade-in{animation:fadeUp .5s ease both}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes wobble{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
@keyframes twinkle{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.1)}}

.spark{position:absolute;color:var(--ink);pointer-events:none;animation:twinkle 2.4s ease-in-out infinite}
