/* ifGifts — criador "Monte o seu" (js/criador.js). Escopo: .wz (assistente em tela cheia) e .wz-launch (chamada na landing).
 * Mesma linguagem da landing: noite com aurora, vidro, Bricolage nos títulos, dourado de destaque, vermelho na ação.
 * Celular primeiro: uma pergunta por tela, botão de continuar no polegar. Desktop (≥1000px): passos à esquerda, prévia ao vivo à direita.
 * Movimento só com transform/opacity; prefers-reduced-motion desliga no fim do arquivo. */

.wz {
  --wz-ink: #f3f1ff;
  --wz-mute: rgba(238,236,255,.68);
  --wz-faint: rgba(238,236,255,.44);
  --wz-glass: rgba(255,255,255,.055);
  --wz-glass2: rgba(255,255,255,.09);
  --wz-line: rgba(255,255,255,.12);
  --wz-gold: #ffcf5a;
  --wz-red: #ff3d55;
  --wz-r: 22px;
  --wz-ease: cubic-bezier(.2, .9, .3, 1);
  --wz-spring: cubic-bezier(.3, 1.5, .5, 1);
  position: fixed; inset: 0; z-index: 50; color: var(--wz-ink); font-family: var(--body);
  background: var(--lp-night, #070a24); overflow: hidden;
}
html.wz-open, html.wz-open body { overflow: hidden; }
.wz.is-entering .wz-shell { animation: wz-in .45s var(--wz-ease) both; }
@keyframes wz-in { from { opacity: 0; transform: translateY(18px) scale(.985); } }
.wz-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: 0; }

/* fundo: aurora + estrelas (mesmo céu da landing) */
.wz-bg { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.wz-bg::before, .wz-bg::after {
  content: ''; position: absolute; width: 80vmax; height: 80vmax; border-radius: 50%; filter: blur(70px); opacity: .5;
  animation: lp-drift 26s ease-in-out infinite alternate;
}
.wz-bg::before { left: -30vmax; top: -34vmax; background: radial-gradient(closest-side, rgba(150,70,200,.7), transparent); }
.wz-bg::after { right: -34vmax; bottom: -40vmax; background: radial-gradient(closest-side, rgba(255,90,80,.35), rgba(255,180,80,.1) 60%, transparent); animation-delay: -11s; }
.wz.is-quake .wz-shell { animation: wz-quake .42s; }
@keyframes wz-quake { 20% { transform: translate(-3px, 1px); } 40% { transform: translate(3px, -1px); } 60% { transform: translate(-2px, 0); } 80% { transform: translate(1px, 1px); } }

/* ------------------------------ moldura ------------------------------ */
.wz-shell {
  position: relative; height: 100%; display: grid;
  grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto minmax(0, 1fr);
  grid-template-areas: "top" "prog" "side" "form";
  padding-top: env(safe-area-inset-top, 0px);
}
.wz-top {
  grid-area: top; display: flex; align-items: center; gap: 12px; padding: 12px clamp(16px, 4vw, 28px) 6px;
}
.wz-x, .wz-back {
  flex: none; display: grid; place-items: center; width: 42px; height: 42px; border: 0; border-radius: 50%; cursor: pointer;
  color: #fff; background: var(--wz-glass2); box-shadow: inset 0 0 0 1px var(--wz-line); transition: background-color .2s, transform .15s;
  -webkit-tap-highlight-color: transparent;
}
.wz-x svg { width: 18px; height: 18px; }
.wz-x:active, .wz-back:active { transform: scale(.92); }
@media (hover: hover) { .wz-x:hover, .wz-back:hover { background: rgba(255,255,255,.16); } }
.wz-brand { display: inline-flex; align-items: center; gap: 8px; font: 800 19px/1 var(--lp-display); letter-spacing: -.03em; }
.wz-brand img { width: 26px; height: 26px; border-radius: 8px; }
.wz-brand i { font-style: normal; color: var(--wz-gold); }
.wz-count {
  margin-left: auto; padding: 7px 12px; border-radius: 999px; font: 800 13px/1 var(--body); letter-spacing: .02em;
  color: #ffe9b8; background: rgba(255,207,90,.1); box-shadow: inset 0 0 0 1px rgba(255,207,90,.26); font-variant-numeric: tabular-nums;
}
.wz-lang .lang-sel { font-size: 11px; }
.wz-lang .lang-sel button { padding: 6px 8px; min-width: 30px; }
@media (max-width: 420px) { .wz-brand span { display: none; } }

/* progresso: segmentos clicáveis (até onde já chegou) */
.wz-prog { grid-area: prog; padding: 4px clamp(16px, 4vw, 28px) 8px; }
.wz-segs { list-style: none; display: flex; gap: 5px; margin: 0; padding: 0; }
.wz-segs li { flex: 1; display: flex; }
.wz-dot {
  flex: 1; height: 18px; border: 0; padding: 0; background: none; cursor: pointer; position: relative; border-radius: 4px;
  -webkit-tap-highlight-color: transparent;
}
.wz-dot::before {
  content: ''; position: absolute; left: 0; right: 0; top: 7px; height: 5px; border-radius: 99px; background: rgba(255,255,255,.13);
  transition: background-color .3s, transform .3s var(--wz-ease);
}
.wz-dot.is-done::before { background: linear-gradient(90deg, var(--wz-gold), #ffa53d); }
.wz-dot.is-cur::before { background: linear-gradient(90deg, #ffa53d, var(--wz-red)); transform: scaleY(1.35); box-shadow: 0 0 14px rgba(255,90,80,.55); }
.wz-dot:disabled { cursor: default; }
@media (hover: hover) { .wz-dot:not(:disabled):not(.is-cur):hover::before { background: rgba(255,207,90,.6); } }
.wz-dot:focus-visible { outline: none; box-shadow: var(--ring-dark); }
.wz-bar { display: none; }

/* ------------------------------ prévia ------------------------------ */
.wz-side { grid-area: side; display: none; min-width: 0; }
.wz-stagebox { position: relative; }
.wz-screen {
  position: relative; aspect-ratio: 16 / 9; border-radius: 18px; overflow: hidden; background: #1a1440;
  box-shadow: 0 0 0 1px rgba(255,255,255,.16), 0 30px 80px -24px rgba(0,0,0,.8), 0 0 90px rgba(255,170,90,.14);
}
.wz-screen canvas { display: block; width: 100%; height: 100%; }
.wz-badge {
  position: absolute; left: 10px; top: 10px; padding: 5px 10px; border-radius: 999px; font-size: 11px; font-weight: 900;
  letter-spacing: .08em; text-transform: uppercase; color: #fff; background: rgba(15,10,40,.62);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.wz-badge::before { content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; background: #ff4d5e; box-shadow: 0 0 8px #ff4d5e; animation: blink 1.2s infinite; }
.wz-cardbox { display: none; }
.wz-cardbox canvas { display: block; width: 100%; height: auto; aspect-ratio: 1080 / 1350; border-radius: 12px; background: #2a2150; }
.wz-side-cap { margin: 12px 0 0; text-align: center; font-size: 14px; font-weight: 700; color: var(--wz-mute); min-height: 1.4em; }

/* celular: faixa do jogo no topo dos passos que mexem no jogo (some quando o teclado abre) */
@media (max-width: 999px) {
  .wz.m-preview .wz-side[data-mode="game"] { display: block; padding: 2px clamp(16px, 4vw, 28px) 4px; }
  .wz.m-preview .wz-side .wz-screen { max-height: 26vh; max-height: 26dvh; aspect-ratio: auto; width: min(100%, calc(26dvh * 16 / 9)); height: auto; margin: 0 auto; }
  .wz.m-preview .wz-side .wz-screen canvas { aspect-ratio: 16 / 9; height: auto; }
  .wz.m-preview .wz-side-cap { display: none; }
  .wz.m-preview:has(.wz-scroll input:focus, .wz-scroll textarea:focus) .wz-side { display: none; }
}

/* ------------------------------ formulário / passos ------------------------------ */
.wz-form { grid-area: form; min-height: 0; display: flex; flex-direction: column; margin: 0; }
.wz-scroll {
  flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
  padding: 8px clamp(16px, 4vw, 28px) 24px; scroll-padding-bottom: 24px;
}
.wz-steps, .wz-result { max-width: 620px; margin: 0 auto; }
.wz-step { outline: none; }
.wz-step.in-fwd { animation: wz-fwd .42s var(--wz-ease) both; }
.wz-step.in-back { animation: wz-back .42s var(--wz-ease) both; }
@keyframes wz-fwd { from { opacity: 0; transform: translateX(28px); } }
@keyframes wz-back { from { opacity: 0; transform: translateX(-28px); } }
.wz-step.is-shake .wz-body { animation: wz-shake .4s; }
@keyframes wz-shake { 20% { transform: translateX(-8px); } 40% { transform: translateX(7px); } 60% { transform: translateX(-4px); } 80% { transform: translateX(2px); } }

.wz-kicker { margin: 10px 0 10px; font: 800 12px/1 var(--body); letter-spacing: .16em; text-transform: uppercase; color: var(--wz-gold); white-space: pre; }
.wz-title {
  margin: 0; font: 800 clamp(30px, 7.6vw, 46px)/1.02 var(--lp-display); letter-spacing: -.04em; text-wrap: balance;
  outline: none; overflow-wrap: anywhere;
}
.wz-sub { margin: 12px 0 0; font-size: clamp(16px, 2vw, 18px); line-height: 1.5; color: var(--wz-mute); text-wrap: pretty; max-width: 46ch; }
.wz-body { margin-top: 24px; }
.wz-err {
  display: flex; align-items: center; gap: 8px; margin: 16px 0 -8px; padding: 11px 14px; border-radius: 14px;
  font-weight: 800; font-size: 15px; color: #ffd0d6; background: rgba(255,61,85,.14); box-shadow: inset 0 0 0 1px rgba(255,61,85,.38);
}
.wz-err::before { content: '!'; flex: none; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--wz-red); color: #fff; font-size: 13px; font-weight: 900; }
.wz-hint { margin: 8px 2px 0; font-size: 14px; color: var(--wz-faint); line-height: 1.45; }

/* campos */
.wz-field { display: block; margin: 0 0 16px; text-transform: none; letter-spacing: 0; }
.wz-label { display: block; margin: 0 0 8px 2px; font: 800 12px/1.2 var(--body); letter-spacing: .12em; text-transform: uppercase; color: var(--wz-mute); }
.wz input:not([type="checkbox"]), .wz textarea {
  width: 100%; margin: 0; min-height: 60px; padding: 15px 18px; border-radius: 18px; font: 700 20px/1.3 var(--body); color: #fff;
  background: var(--wz-glass); border: 1.5px solid var(--wz-line); box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  transition: border-color .2s, background-color .2s, box-shadow .2s; caret-color: var(--wz-gold);
}
.wz input::placeholder, .wz textarea::placeholder { color: rgba(238,236,255,.32); font-weight: 600; }
@media (hover: hover) { .wz input:not([type="checkbox"]):hover, .wz textarea:hover { border-color: rgba(255,255,255,.22); } }
.wz input:not([type="checkbox"]):focus, .wz textarea:focus {
  outline: none; border-color: rgba(255,207,90,.85); background: rgba(255,255,255,.08); box-shadow: 0 0 0 5px rgba(255,207,90,.14);
}
.wz input[aria-invalid="true"], .wz textarea[aria-invalid="true"] { border-color: rgba(255,61,85,.9); box-shadow: 0 0 0 5px rgba(255,61,85,.16); }
.wz-from-hint { margin-top: -8px; }

/* fichas (atalhos de nome, vilão) */
.wz-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: -4px 0 20px; }
.wz-chip {
  min-height: 40px; padding: 8px 15px; border: 0; border-radius: 999px; cursor: pointer; font: 800 15px/1.1 var(--body); color: #fff;
  background: var(--wz-glass2); box-shadow: inset 0 0 0 1px var(--wz-line); transition: background-color .15s, box-shadow .15s, transform .12s;
  -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) { .wz-chip:hover { background: rgba(255,255,255,.15); } }
.wz-chip:active { transform: scale(.95); }
.wz-chip[aria-pressed="true"] { color: #2a1700; background: var(--wz-gold); box-shadow: 0 8px 20px -10px rgba(255,207,90,.8); }
.wz-label-quick { margin-top: 4px; }

/* pop de escolha */
.is-pop { animation: wz-pop .38s var(--wz-spring); }
@keyframes wz-pop { 0% { transform: scale(1); } 35% { transform: scale(.95); } 70% { transform: scale(1.035); } 100% { transform: scale(1); } }

/* tique de escolhido (cartões de escolha) */
.wz-tick {
  position: absolute; top: 10px; right: 10px; z-index: 2; width: 26px; height: 26px; border-radius: 50%;
  background: var(--wz-gold) no-repeat center / 14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2.5 7.4l3 3 6-6.3' fill='none' stroke='%232a1700' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  box-shadow: 0 6px 14px -4px rgba(0,0,0,.5); transform: scale(0); transition: transform .3s var(--wz-spring);
}
[aria-checked="true"] > .wz-tick { transform: scale(1); }

/* ------------------------------ jogos ------------------------------ */
.wz-games { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.wz-gcard {
  position: relative; display: flex; flex-direction: column; text-align: left; padding: 7px 7px 14px; border: 0; border-radius: var(--wz-r);
  cursor: pointer; color: inherit; background: var(--wz-glass); box-shadow: inset 0 0 0 1px var(--wz-line);
  transition: background-color .2s, box-shadow .2s, transform .25s var(--wz-ease); -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) { .wz-gcard:hover { background: var(--wz-glass2); transform: translateY(-3px); } }
.wz-gcard[aria-checked="true"] { background: rgba(255,207,90,.09); box-shadow: inset 0 0 0 2px var(--wz-gold), 0 20px 40px -24px rgba(255,207,90,.6); }
.wz-gscreen { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; background: #1a1440; }
.wz-gscreen canvas { display: block; width: 100%; height: 100%; }
.wz-gcard:not(.is-live) .wz-gscreen canvas { filter: saturate(.75) brightness(.86); transition: filter .3s; }
.wz-live {
  position: absolute; left: 7px; bottom: 7px; padding: 4px 7px; border-radius: 999px; font-size: 10px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase;
  color: #fff; background: rgba(15,10,40,.62); opacity: 0; transition: opacity .3s;
}
.wz-live::before { content: ''; display: inline-block; width: 5px; height: 5px; border-radius: 50%; margin-right: 5px; vertical-align: 1px; background: #ff4d5e; box-shadow: 0 0 6px #ff4d5e; }
.wz-gcard.is-live .wz-live { opacity: 1; }
.wz-gtxt { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 8px; padding: 12px 6px 0; align-items: center; }
.wz-gemo { grid-row: span 2; font-size: 22px; line-height: 1; align-self: start; }
.wz-gname { font: 800 17px/1.15 var(--lp-display); letter-spacing: -.02em; }
.wz-gdesc { font-size: 13px; line-height: 1.38; color: var(--wz-mute); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 440px) {
  .wz-games { gap: 10px; }
  .wz-gtxt { grid-template-columns: minmax(0, 1fr); padding: 10px 4px 0; }
  .wz-gemo { display: none; }
  .wz-gname { font-size: 15.5px; }
  .wz-gdesc { font-size: 12.5px; }
}

/* ------------------------------ personagens ------------------------------ */
.wz-skins { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 10px; }
@media (max-width: 560px) { .wz-skins { grid-template-columns: repeat(3, minmax(0, 1fr)); } .wz-skins[data-n="4"] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.wz-skin {
  position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 4px 12px; border: 0; cursor: pointer;
  border-radius: var(--wz-r); color: inherit; background: radial-gradient(90% 70% at 50% 40%, rgba(120,90,220,.2), transparent 70%), var(--wz-glass);
  box-shadow: inset 0 0 0 1px var(--wz-line); transition: background-color .2s, box-shadow .2s, transform .25s var(--wz-ease);
  -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) { .wz-skin:hover { transform: translateY(-3px); } }
.wz-skin canvas { width: 84px; height: 96px; display: block; max-width: 100%; }
.wz-skin-n { font-weight: 800; font-size: 13.5px; line-height: 1.2; text-align: center; }
.wz-skin[aria-checked="true"] { background: radial-gradient(90% 70% at 50% 40%, rgba(255,207,90,.22), transparent 70%), rgba(255,207,90,.08); box-shadow: inset 0 0 0 2px var(--wz-gold); }
.wz-skin .wz-tick { top: 7px; right: 7px; width: 22px; height: 22px; background-size: 12px; }
.wz-styles { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 14px; margin-top: 22px; }
.wz-styles .wz-label { margin: 0; }

/* segmentado (estilo, idioma do presente) */
.wz-seg { display: inline-flex; gap: 4px; padding: 4px; border-radius: 16px; background: var(--wz-glass); box-shadow: inset 0 0 0 1px var(--wz-line); flex-wrap: wrap; }
.wz-seg button {
  min-height: 42px; padding: 8px 16px; border: 0; border-radius: 12px; cursor: pointer; font: 800 15px/1 var(--body); color: var(--wz-mute); background: none;
  transition: background-color .2s, color .2s;
}
.wz-seg button[data-id="retro"] { font-family: 'Press Start 2P', monospace; font-size: 10.5px; }
.wz-seg button[aria-checked="true"] { color: #2a1700; background: var(--wz-gold); box-shadow: 0 6px 16px -8px rgba(255,207,90,.8); }
@media (hover: hover) { .wz-seg button:not([aria-checked="true"]):hover { color: #fff; background: rgba(255,255,255,.08); } }
.wz-seg-s button { min-height: 38px; padding: 7px 13px; font-size: 14px; }

/* ------------------------------ vilão / recadinhos ------------------------------ */
.wz-field-villain input { padding-left: 54px !important; font-size: 22px !important; background-image: none; }
.wz-field-villain { position: relative; }
.wz-field-villain::after { content: '😈'; position: absolute; left: 18px; bottom: 16px; font-size: 24px; line-height: 1; pointer-events: none; }
.wz-signs { display: grid; gap: 4px; }
.wz-sign { margin-bottom: 12px; position: relative; }
.wz-sign input {
  padding-left: 58px !important; font-size: 18px !important;
  background: var(--wz-glass) no-repeat 16px center / 28px 28px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28'%3E%3Crect x='3' y='5' width='22' height='13' rx='3' fill='%23c98a52'/%3E%3Crect x='3' y='5' width='22' height='4' rx='2' fill='%23e3a86d'/%3E%3Crect x='7' y='18' width='3' height='8' fill='%236b4428'/%3E%3Crect x='18' y='18' width='3' height='8' fill='%236b4428'/%3E%3C/svg%3E") !important;
}
.wz-sign input:focus { background-color: rgba(255,255,255,.08) !important; }

/* ------------------------------ humor ------------------------------ */
.wz-moods { display: grid; gap: 12px; }
.wz-mood {
  position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 4px 16px; text-align: left;
  padding: 18px 48px 18px 18px; border: 0; border-radius: 24px; cursor: pointer; color: inherit; overflow: hidden; isolation: isolate;
  background: var(--wz-glass); box-shadow: inset 0 0 0 1px var(--wz-line); transition: box-shadow .25s, transform .25s var(--wz-ease), background-color .25s;
  -webkit-tap-highlight-color: transparent;
}
@media (hover: hover) { .wz-mood:hover { transform: translateY(-2px); } }
.wz-mood-e { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 18px; font-size: 32px; line-height: 1; background: rgba(255,255,255,.08); }
.wz-mood-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.wz-mood-t { font: 800 22px/1.1 var(--lp-display); letter-spacing: -.025em; }
.wz-mood-d { display: block; margin-top: 4px; font-size: 14.5px; line-height: 1.4; color: var(--wz-mute); }
.wz-mood-perk { display: block; margin-top: 8px; font-size: 13px; font-weight: 800; color: #ffcf5a; }
.wz-flames { display: inline-flex; gap: 3px; align-items: flex-end; }
.wz-flames i { width: 6px; border-radius: 3px; background: rgba(255,255,255,.14); }
.wz-flames i:nth-child(1) { height: 7px; } .wz-flames i:nth-child(2) { height: 11px; } .wz-flames i:nth-child(3) { height: 15px; }
.wz-flames[data-level="1"] i:nth-child(-n+1), .wz-flames[data-level="2"] i:nth-child(-n+2), .wz-flames[data-level="3"] i { background: linear-gradient(180deg, #ffcf5a, #ff6a3d); }
.wz-mood-facil[aria-checked="true"] { background: linear-gradient(135deg, rgba(120,220,255,.16), rgba(160,255,200,.08)); box-shadow: inset 0 0 0 2px #8fe3ff, 0 18px 40px -24px rgba(120,220,255,.7); }
.wz-mood-facil .wz-mood-e { background: radial-gradient(circle, rgba(255,255,255,.22), rgba(140,220,255,.12)); }
.wz-mood-medio[aria-checked="true"] { background: linear-gradient(135deg, rgba(255,190,90,.18), rgba(255,120,80,.08)); box-shadow: inset 0 0 0 2px var(--wz-gold), 0 18px 40px -24px rgba(255,190,90,.7); }
.wz-mood-medio .wz-mood-e { background: radial-gradient(circle, rgba(255,210,120,.26), rgba(255,140,60,.1)); }
/* Vingança: escura, lendária, com brasa girando na borda */
.wz-mood-dificil { background: radial-gradient(120% 140% at 100% 0%, #4a0c1a, #12060c 70%); box-shadow: inset 0 0 0 1px rgba(255,61,85,.35); }
.wz-mood-dificil::before {
  content: ''; position: absolute; inset: -60%; z-index: -2; opacity: 0; transition: opacity .4s;
  background: conic-gradient(from 0deg, transparent 0 70%, rgba(255,90,60,.9) 80%, #ffcf5a 85%, rgba(255,61,85,.9) 90%, transparent 100%);
  animation: wz-spin 3.2s linear infinite;
}
.wz-mood-dificil::after { content: ''; position: absolute; inset: 2px; z-index: -1; border-radius: 22px; background: radial-gradient(120% 140% at 100% 0%, #52101f, #12060c 70%); }
.wz-mood-dificil .wz-mood-e { background: radial-gradient(circle, rgba(255,61,85,.38), rgba(80,0,20,.4)); box-shadow: 0 0 30px rgba(255,61,85,.35); }
.wz-mood-dificil .wz-mood-t { background: linear-gradient(180deg, #fff1c2, #ffcf5a 55%, #ff8a3d); -webkit-background-clip: text; background-clip: text; color: transparent; }
.wz-mood-dificil .wz-mood-d { color: rgba(255,214,220,.78); }
.wz-mood-dificil[aria-checked="true"]::before { opacity: 1; }
.wz-mood-dificil[aria-checked="true"] { box-shadow: 0 24px 60px -24px rgba(255,61,85,.8); }
.wz-mood-dificil[aria-checked="true"] .wz-mood-e { animation: wz-throb 1.6s ease-in-out infinite; }
.wz-badge-leg {
  padding: 4px 8px; border-radius: 999px; font: 900 10px/1 var(--body); letter-spacing: .14em; text-transform: uppercase; color: #2a0a00;
  background: linear-gradient(90deg, #ffcf5a, #ff8a3d);
}
.wz-mood .wz-tick { top: 12px; right: 12px; }
@keyframes wz-spin { to { transform: rotate(360deg); } }
@keyframes wz-throb { 50% { transform: scale(1.08) rotate(-4deg); } }
@media (max-width: 440px) {
  .wz-mood { gap: 4px 12px; padding: 16px 44px 16px 14px; }
  .wz-mood-e { width: 50px; height: 50px; font-size: 27px; border-radius: 15px; }
  .wz-mood-t { font-size: 20px; }
}

/* ------------------------------ mensagem ------------------------------ */
.wz-letter {
  position: relative; border-radius: 22px; padding: 4px; color: var(--lp-ink, #1d1534);
  background: linear-gradient(180deg, #fffaf2, #f6ecdc); box-shadow: 0 30px 60px -30px rgba(0,0,0,.8), inset 0 0 0 1px rgba(0,0,0,.04);
}
.wz .wz-letter textarea {
  display: block; min-height: 168px; resize: none; border: 0; border-radius: 18px; padding: 18px 18px 8px; box-shadow: none;
  font: 700 clamp(25px, 6vw, 30px)/1.18 var(--hand); color: #2a1f40; caret-color: var(--red);
  background: transparent repeating-linear-gradient(transparent 0 34px, rgba(160,120,80,.16) 34px 35px); background-position: 0 14px;
}
.wz .wz-letter textarea::placeholder { color: rgba(60,40,90,.36); font-weight: 600; }
.wz .wz-letter textarea:focus { background-color: transparent; box-shadow: none; border: 0; }
.wz-letter:focus-within { box-shadow: 0 0 0 5px rgba(255,207,90,.25), 0 30px 60px -30px rgba(0,0,0,.8); }
.wz-letter-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 10px 10px 12px; }
.wz-sugg {
  min-height: 42px; padding: 8px 16px; border: 0; border-radius: 999px; cursor: pointer; font: 800 15px/1 var(--body);
  color: #4a2a00; background: linear-gradient(180deg, #ffe39a, #ffc861); box-shadow: 0 6px 14px -8px rgba(200,130,20,.8);
}
.wz-sugg:active { transform: scale(.96); }
.wz-count-ring { position: relative; width: 38px; height: 38px; display: grid; place-items: center; font: 800 11px/1 var(--body); color: #8a7f9e; --p: 0; }
.wz-count-ring svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.wz-count-ring circle { fill: none; stroke-width: 3.5; }
.wz-count-ring .bg { stroke: rgba(60,40,90,.12); }
.wz-count-ring .fg { stroke: #2fa65a; stroke-linecap: round; stroke-dasharray: 94.25; stroke-dashoffset: calc(94.25 * (1 - var(--p))); transition: stroke-dashoffset .2s; }
.wz-count-ring.is-warn .fg { stroke: #e0303f; }
.wz-count-ring.is-warn { color: #e0303f; }
.wz-ideas-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 22px 0 10px; }
.wz-ideas-head .wz-label { margin: 0; }
.wz-ideas { display: grid; gap: 8px; }
.wz-idea {
  text-align: left; border: 0; border-radius: 16px; padding: 13px 15px; cursor: pointer; font: 600 15px/1.42 var(--body); color: rgba(243,241,255,.88);
  background: var(--wz-glass); box-shadow: inset 0 0 0 1px var(--wz-line); transition: background-color .15s, box-shadow .15s, transform .12s;
}
.wz-idea span { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@media (hover: hover) { .wz-idea:hover { background: var(--wz-glass2); box-shadow: inset 0 0 0 1px rgba(255,207,90,.5); } }
.wz-idea:active { transform: scale(.985); }
.wz-langrow { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--wz-line); }
.wz-linkbtn {
  border: 0; background: none; padding: 6px 4px; cursor: pointer; font: 800 14px/1.2 var(--body); color: var(--wz-gold);
  text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(255,207,90,.4); border-radius: 8px;
}
.wz-linkbtn:hover { text-decoration-color: currentColor; }

/* ------------------------------ cartões (Cards.picker no escuro) ------------------------------ */
.wz .cz-rail { margin: 0 calc(-1 * clamp(16px, 4vw, 28px)); padding: 10px clamp(16px, 4vw, 28px) 16px; scroll-padding: 0 clamp(16px, 4vw, 28px); scrollbar-width: none; }
.wz .cz-rail::-webkit-scrollbar { display: none; }
.wz .cz-thumb { color: var(--wz-ink); }
.wz .cz-thumb-card { width: 104px; border-radius: 10px; box-shadow: 0 0 0 1px rgba(255,255,255,.12), 0 14px 26px -12px rgba(0,0,0,.8); }
.wz .cz-thumb[aria-selected="true"] .cz-thumb-card { box-shadow: 0 0 0 3px var(--lp-night, #070a24), 0 0 0 6px var(--wz-gold), 0 16px 30px -10px rgba(255,207,90,.5); transform: translateY(-4px); }
.wz .cz-thumb-name { color: var(--wz-mute); }
.wz .cz-thumb[aria-selected="true"] .cz-thumb-name { color: var(--wz-gold); }
.wz .cz-thumb:focus-visible { outline: none; box-shadow: none; }
.wz .cz-thumb:focus-visible .cz-thumb-card { box-shadow: var(--ring-dark); }
.wz .cz-big-card { width: min(300px, 78%); border-radius: 12px; box-shadow: 0 0 0 1px rgba(255,255,255,.1), 0 40px 80px -30px rgba(0,0,0,.9), 0 0 80px rgba(255,170,90,.12); }
.wz .cz-big-name { font-family: var(--lp-display); font-weight: 800; letter-spacing: -.02em; font-size: 20px; }
.wz .cz-big-tag { color: var(--wz-mute); }
@media (min-width: 1000px) { .wz .cz-big { display: none; } .wz .cz-rail { flex-wrap: wrap; overflow: visible; margin: 0; padding: 4px 0 0; gap: 18px 14px; } .wz .cz-thumb-card { width: 118px; } }

/* ------------------------------ quiz (editor do jogo) no escuro ------------------------------ */
.wz .wz-editor .hint { color: var(--wz-mute); font-size: 15px; margin: 0 0 6px; }
.wz .qz-mini { color: var(--wz-faint); }
.wz .qz-ideas .chip { color: #fff; background: var(--wz-glass2); border: 0; box-shadow: inset 0 0 0 1px var(--wz-line); min-height: 36px; }
.wz .qz-ideas .chip:hover { background: rgba(255,255,255,.15); color: #fff; }
.wz .qz-ideas .qz-more { color: var(--wz-gold); box-shadow: inset 0 0 0 1px rgba(255,207,90,.5); }
.wz .qz-card, .wz .qz-round { background: var(--wz-glass); border: 1.5px solid var(--wz-line); }
.wz .qz-card.ok { border-color: rgba(92,240,140,.4); }
.wz .qz-title { color: var(--wz-ink); }
.wz .qz-num { background: rgba(255,255,255,.1); color: var(--wz-ink); }
.wz .qz-card.ok .qz-num { background: #2fa65a; }
.wz .qz-state { color: #ffcf5a; }
.wz .qz-card.ok .qz-state { color: #5cf08c; }
.wz .qz-chev { border-color: var(--wz-faint); }
.wz .qz-card input { min-height: 50px; font-size: 16px; padding: 11px 14px; border-radius: 14px; }
.wz .qz-a.right input { border-color: rgba(92,240,140,.55); background: rgba(92,240,140,.08); }
.wz .qz-ok { background: transparent; border: 1.5px solid var(--wz-line); color: var(--wz-faint); }
.wz .qz-ok[aria-pressed="true"] { background: #2fa65a; border-color: #2fa65a; color: #fff; box-shadow: 0 3px 0 #1d7a40; }
.wz .qz-del { color: var(--wz-faint); }
.wz .qz-del:hover { background: rgba(255,61,85,.16); color: #ff8a98; }
.wz .qz-add { border-color: rgba(255,255,255,.2); color: var(--wz-mute); }
.wz .qz-add:hover { border-color: var(--wz-gold); color: var(--wz-gold); }
.wz .qz-note { color: var(--wz-mute); }
.wz .qz-fill { background: rgba(92,240,140,.08); }
.wz .qz-fill span { color: var(--wz-ink); }
.wz .qz-fill small { color: rgba(180,240,200,.8); }
.wz .qz-sum { background: rgba(255,207,90,.08); color: var(--wz-mute); }
.wz .qz-sum b { color: #5cf08c; }
.wz .qz-sum.warn b { color: var(--wz-gold); }
.wz .qz-round .seg { background: var(--wz-glass); }
.wz .qz-round .seg button { color: var(--wz-mute); }
.wz .qz-round .seg button[aria-pressed="true"] { background: var(--wz-gold); color: #2a1700; }

/* ------------------------------ revisão ------------------------------ */
.wz-ticket { border-radius: 26px; overflow: hidden; background: var(--wz-glass); box-shadow: inset 0 0 0 1px var(--wz-line), 0 30px 60px -36px rgba(0,0,0,.9); }
.wz-ticket-top {
  position: relative; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 22px 20px 20px;
  background: radial-gradient(120% 140% at 0% 0%, rgba(255,90,80,.38), transparent 60%), radial-gradient(120% 140% at 100% 100%, rgba(150,70,200,.42), transparent 60%), rgba(255,255,255,.03);
}
.wz-ticket-top::after { /* picote do ingresso */
  content: ''; position: absolute; left: 14px; right: 14px; bottom: 0; border-bottom: 2px dashed rgba(255,255,255,.16);
}
.wz-ticket-names { min-width: 0; display: grid; gap: 6px; }
.wz-ticket-for { font: 800 clamp(28px, 7vw, 38px)/1 var(--lp-display); letter-spacing: -.04em; overflow-wrap: anywhere; }
.wz-ticket-from { font: 700 26px/1 var(--hand); color: #ffe3a3; }
.wz-ticket-card { flex: none; width: 76px; height: 95px; border-radius: 8px; transform: rotate(4deg); box-shadow: 0 16px 30px -12px rgba(0,0,0,.8); background: #2a2150; }
.wz-oneliner { margin: 0; padding: 14px 20px 4px; font-size: 14px; font-weight: 800; color: var(--wz-gold); line-height: 1.45; }
.wz-rows { list-style: none; margin: 0; padding: 6px 8px 10px; }
.wz-row {
  width: 100%; display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; grid-template-areas: "i l e" "i v e"; gap: 1px 12px; align-items: center;
  padding: 11px 12px; border: 0; border-radius: 16px; background: none; cursor: pointer; color: inherit; text-align: left; transition: background-color .15s;
}
@media (hover: hover) { .wz-row:hover { background: rgba(255,255,255,.06); } .wz-row:hover .wz-row-e { color: var(--wz-gold); } }
.wz-row-i { grid-area: i; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 12px; background: rgba(255,255,255,.07); font-size: 18px; }
.wz-row-l { grid-area: l; font-size: 11.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--wz-faint); }
.wz-row-v { grid-area: v; font-weight: 800; font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wz-row.is-long .wz-row-v { white-space: normal; font: 700 21px/1.15 var(--hand); color: #ffe9c4; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.wz-row-e { grid-area: e; font-size: 13px; font-weight: 800; color: var(--wz-faint); transition: color .15s; }
.wz-rows li + li .wz-row { border-top-left-radius: 16px; }
.wz-quota { margin: 16px 4px 0; font-size: 14px; font-weight: 700; color: var(--wz-mute); text-align: center; }
.wz .turnstile { margin-top: 14px; }

/* ------------------------------ rodapé (polegar) ------------------------------ */
.wz-foot {
  position: relative; display: flex; align-items: center; gap: 10px; padding: 12px clamp(16px, 4vw, 28px) calc(14px + env(safe-area-inset-bottom, 0px));
  background: linear-gradient(180deg, rgba(7,10,36,0), rgba(7,10,36,.92) 30%);
}
.wz-foot::before { content: ''; position: absolute; left: 0; right: 0; top: -24px; height: 24px; background: linear-gradient(rgba(7,10,36,0), rgba(7,10,36,.6)); pointer-events: none; }
.wz-back { width: 58px; height: 58px; }
.wz-back svg { width: 22px; height: 22px; }
.wz-next, .wz-pv {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 58px; border: 0; border-radius: 999px; cursor: pointer;
  font: 700 18px/1 var(--lp-display); letter-spacing: -.01em; -webkit-tap-highlight-color: transparent;
  transition: transform .18s var(--wz-ease), box-shadow .2s, filter .2s;
}
.wz-next { flex: 1; padding: 0 26px; color: #fff; background: linear-gradient(180deg, #ff5a6c, #d91e3a);
  box-shadow: 0 1px 0 rgba(255,255,255,.35) inset, 0 -2px 0 rgba(0,0,0,.18) inset, 0 14px 34px -10px rgba(255,61,85,.75); }
.wz-next svg { width: 20px; height: 20px; transition: transform .2s var(--wz-ease); }
@media (hover: hover) { .wz-next:hover { transform: translateY(-2px); } .wz-next:hover svg { transform: translateX(3px); } }
.wz-next:active, .wz-pv:active { transform: translateY(1px) scale(.985); }
.wz-next.is-wrap { background: linear-gradient(180deg, #ffe08a, #ffb534); color: #2a1300; box-shadow: 0 1px 0 rgba(255,255,255,.6) inset, 0 -2px 0 rgba(120,60,0,.2) inset, 0 16px 36px -10px rgba(255,180,52,.75); }
.wz-next.is-wrap svg { display: none; }
.wz-next.is-busy span::before { content: ''; display: inline-block; width: 16px; height: 16px; margin-right: 10px; vertical-align: -2px; border-radius: 50%; border: 2.5px solid currentColor; border-right-color: transparent; animation: wz-spin .7s linear infinite; }
.wz-next:disabled { cursor: progress; filter: saturate(.8); }
.wz-pv { flex: none; padding: 0 20px; color: #fff; background: var(--wz-glass2); box-shadow: inset 0 0 0 1px var(--wz-line); }
.wz-pv svg { width: 16px; height: 16px; }
.wz-x:focus-visible, .wz-back:focus-visible, .wz-next:focus-visible, .wz-pv:focus-visible, .wz-chip:focus-visible, .wz-gcard:focus-visible, .wz-skin:focus-visible,
.wz-mood:focus-visible, .wz-seg button:focus-visible, .wz-sugg:focus-visible, .wz-idea:focus-visible, .wz-row:focus-visible, .wz-linkbtn:focus-visible,
.wz-whats:focus-visible, .wz-copy:focus-visible, .wz-share:focus-visible, .wz-again:focus-visible { outline: none; box-shadow: var(--ring-dark); }
@media (max-width: 460px) { .wz-pv span { display: none; } .wz-pv { width: 58px; padding: 0; } }
.wz-next span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* revanche dentro do criador */
.wz-revenge { max-width: 620px; margin: 6px auto 10px !important; }

/* ------------------------------ presente embrulhado ------------------------------ */
.wz.is-done .wz-prog, .wz.is-done .wz-foot, .wz.is-done .wz-count { visibility: hidden; }
.wz.is-done .wz-foot { display: none; }
.wz-result { text-align: center; padding-bottom: 20px; }
.wz-done-art { position: relative; width: 190px; height: 170px; margin: 4px auto 0; }
.wz-done-art img {
  position: relative; width: 100%; height: 100%; object-fit: cover; border-radius: 50%;
  -webkit-mask-image: radial-gradient(closest-side, #000 62%, transparent); mask-image: radial-gradient(closest-side, #000 62%, transparent);
  animation: wz-gift 2.6s var(--wz-ease) both, wz-float 3.6s ease-in-out 1.2s infinite;
}
.wz-done-rays {
  position: absolute; inset: -40%; border-radius: 50%; opacity: .7;
  background: repeating-conic-gradient(from 0deg, rgba(255,220,150,.22) 0 7deg, transparent 7deg 20deg);
  -webkit-mask-image: radial-gradient(closest-side, #000, transparent 75%); mask-image: radial-gradient(closest-side, #000, transparent 75%);
  animation: wz-spin 24s linear infinite;
}
@keyframes wz-gift { 0% { transform: scale(.3) rotate(-12deg); opacity: 0; } 45% { transform: scale(1.12) rotate(4deg); opacity: 1; } 70% { transform: scale(.97) rotate(-2deg); } 100% { transform: none; } }
@keyframes wz-float { 50% { transform: translateY(-7px); } }
.wz-done-t { margin: 6px 0 0; font: 800 clamp(36px, 9vw, 54px)/1 var(--lp-display); letter-spacing: -.045em; outline: none; text-wrap: balance;
  background: linear-gradient(180deg, #fff 30%, #ffe3a3); -webkit-background-clip: text; background-clip: text; color: transparent; }
.wz-done-lead { margin: 14px auto 0; max-width: 40ch; font-size: 17px; line-height: 1.5; color: var(--wz-mute); text-wrap: pretty; }
.wz-whats {
  display: flex; align-items: center; justify-content: center; gap: 12px; width: 100%; height: 64px; margin: 26px 0 0; border-radius: 999px; text-decoration: none;
  font: 800 20px/1 var(--lp-display); letter-spacing: -.01em; color: #053a1a; background: linear-gradient(180deg, #5cf08c, #22c362);
  box-shadow: 0 1px 0 rgba(255,255,255,.5) inset, 0 -2px 0 rgba(0,0,0,.14) inset, 0 18px 40px -14px rgba(34,195,98,.8);
  transition: transform .18s var(--wz-ease); animation: wz-rise .6s .35s var(--wz-ease) both;
}
.wz-whats svg { width: 26px; height: 26px; }
@media (hover: hover) { .wz-whats:hover { transform: translateY(-2px); } }
.wz-whats:active { transform: scale(.985); }
@keyframes wz-rise { from { opacity: 0; transform: translateY(14px); } }
.wz-linkrow { display: flex; gap: 8px; margin-top: 12px; padding: 6px; border-radius: 20px; background: var(--wz-glass); box-shadow: inset 0 0 0 1px var(--wz-line); }
.wz .wz-linkrow input { flex: 1; min-width: 0; min-height: 48px; padding: 0 12px; border: 0; background: none; box-shadow: none; font: 700 14.5px/1 var(--body); color: var(--wz-mute); text-overflow: ellipsis; }
.wz .wz-linkrow input:focus { box-shadow: none; background: none; color: #fff; }
.wz-copy {
  flex: none; min-height: 48px; padding: 0 18px; border: 0; border-radius: 14px; cursor: pointer; font: 800 15px/1 var(--body); color: #2a1700;
  background: var(--wz-gold); transition: background-color .2s, transform .12s;
}
.wz-copy.is-ok { background: #5cf08c; color: #053a1a; }
.wz-copy:active { transform: scale(.96); }
.wz-share {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 52px; margin-top: 10px; border: 0; border-radius: 999px; cursor: pointer;
  font: 800 16px/1 var(--body); color: #fff; background: var(--wz-glass2); box-shadow: inset 0 0 0 1px var(--wz-line);
}
.wz-share svg { width: 18px; height: 18px; }
.wz-qr {
  display: flex; align-items: center; gap: 16px; margin-top: 18px; padding: 14px; border-radius: 22px; text-align: left;
  background: var(--wz-glass); box-shadow: inset 0 0 0 1px var(--wz-line);
}
.wz-qr canvas { flex: none; width: 116px; height: 116px; border-radius: 14px; background: #fff; box-shadow: 0 10px 24px -12px rgba(0,0,0,.8); image-rendering: pixelated; }
.wz-qr b { display: block; font: 800 18px/1.15 var(--lp-display); letter-spacing: -.02em; }
.wz-qr p { margin: 6px 0 0; font-size: 14px; line-height: 1.45; color: var(--wz-mute); }
.wz-film { margin: 14px 0 0; padding: 14px 16px; border-radius: 18px; text-align: left; font-size: 14.5px; line-height: 1.5; color: #ffe3a3; background: rgba(255,207,90,.08); box-shadow: inset 0 0 0 1px rgba(255,207,90,.24); }
.wz-film b { color: #fff3cf; }
.wz-result .wz-quota { color: #ffb3bb; font-weight: 800; }
.wz-done-acts { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-top: 22px; }
.wz-again {
  display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 56px; border: 0; border-radius: 999px; cursor: pointer;
  font: 700 18px/1 var(--lp-display); color: #fff; background: var(--wz-glass2); box-shadow: inset 0 0 0 1px var(--wz-line);
}
@media (hover: hover) { .wz-again:hover { background: rgba(255,255,255,.15); } }
.wz .confetti { z-index: 5; }

/* ------------------------------ desktop: dois painéis ------------------------------ */
@media (min-width: 1000px) {
  .wz-shell {
    grid-template-columns: minmax(460px, 600px) minmax(0, 1fr); grid-template-rows: auto auto minmax(0, 1fr);
    grid-template-areas: "top side" "prog side" "form side";
  }
  .wz-top, .wz-prog { padding-left: 40px; padding-right: 32px; }
  .wz-top { padding-top: 22px; }
  .wz-scroll { padding: 18px 32px 36px 40px; }
  .wz-foot { padding: 16px 32px 26px 40px; }
  .wz-steps, .wz-result { margin: 0; }
  .wz-side {
    display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 16px 16px 16px 0; padding: 40px;
    border-radius: 34px; position: relative; overflow: hidden; isolation: isolate;
    background: radial-gradient(80% 60% at 50% 30%, rgba(120,80,220,.32), transparent 70%), radial-gradient(60% 50% at 50% 100%, rgba(255,140,70,.18), transparent 70%), rgba(255,255,255,.035);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
  }
  .wz-side::before { /* chão de estrelas */
    content: ''; position: absolute; inset: 0; z-index: -1; opacity: .45;
    background-image: radial-gradient(1.3px 1.3px at 14% 18%, #fff, transparent), radial-gradient(1px 1px at 38% 9%, #fff, transparent), radial-gradient(1.5px 1.5px at 72% 22%, #fff, transparent),
      radial-gradient(1px 1px at 88% 12%, #fff, transparent), radial-gradient(1.2px 1.2px at 92% 48%, #fff, transparent), radial-gradient(1px 1px at 8% 62%, #fff, transparent);
  }
  .wz-stagebox { width: min(100%, 760px); display: grid; place-items: center; }
  .wz-screen { width: 100%; border-radius: 26px; transition: transform .5s var(--wz-ease), opacity .4s; }
  .wz-cardbox { width: min(360px, 62%); transition: transform .5s var(--wz-ease), opacity .4s; }
  .wz-cardbox canvas { box-shadow: 0 0 0 1px rgba(255,255,255,.1), 0 50px 90px -30px rgba(0,0,0,.9), 0 0 120px rgba(255,170,90,.16); }
  .wz-side[data-mode="card"] .wz-screen { display: none; }
  .wz-side[data-mode="card"] .wz-cardbox { display: block; animation: wz-card .5s var(--wz-ease) both; transform: rotate(-2deg); }
  @keyframes wz-card { from { opacity: 0; transform: translateY(20px) rotate(2deg) scale(.96); } }
  /* revisão / embrulhado: o jogo atrás, o cartão na frente */
  .wz-side[data-mode="gift"] .wz-stagebox { grid-template-areas: "s"; }
  .wz-side[data-mode="gift"] .wz-screen, .wz-side[data-mode="gift"] .wz-cardbox { grid-area: s; }
  .wz-side[data-mode="gift"] .wz-screen { width: 88%; transform: translate(-8%, -16%) rotate(-2deg); }
  .wz-side[data-mode="gift"] .wz-cardbox { display: block; width: min(250px, 36%); justify-self: end; align-self: end; transform: translate(-4%, 26%) rotate(5deg); z-index: 2; animation: wz-card .6s .1s var(--wz-ease) both; }
  .wz-side[data-mode="gift"] .wz-side-cap { margin-top: 90px; }
  .wz-side-cap { font-size: 15px; margin-top: 22px; }
  .wz-title { font-size: clamp(38px, 3.4vw, 50px); }
  .wz-result { text-align: left; }
  .wz-done-art { margin-left: 0; }
  .wz-done-lead { margin-left: 0; }
  .wz-done-acts { align-items: flex-start; }
  .wz-next { flex: 0 1 auto; min-width: 220px; margin-left: auto; }
  .wz-back { order: -1; }
}
@media (min-width: 1000px) and (max-height: 760px) { .wz-side { padding: 28px; } .wz-side[data-mode="gift"] .wz-cardbox { width: min(210px, 30%); } }

/* ------------------------------ chamada na landing ------------------------------ */
.lp-make { position: relative; text-align: center; padding: clamp(40px, 6vw, 80px) 0 clamp(24px, 4vw, 40px); scroll-margin-top: 20px; }
.lp-make .lp-h2 { margin: 0 auto; font-size: clamp(36px, 5vw, 64px); }
.lp-make .lp-lead { margin-left: auto; margin-right: auto; }
.wz-launch { display: flex; flex-direction: column; align-items: center; margin-top: 30px; }
.wz-launch-go { min-width: min(320px, 100%); }
.wz-launch-pts { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 22px 0 0; padding: 0; }
.wz-launch-pts li { padding: 9px 14px; border-radius: 999px; font-size: 14px; font-weight: 800; color: rgba(238,236,255,.78); background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.1); }
.wz-resume {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px 18px; align-items: center; width: min(560px, 100%); padding: 18px; text-align: left;
  border-radius: 28px; background: rgba(255,255,255,.055); box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 30px 60px -36px rgba(0,0,0,.9);
}
.wz-resume-card { width: 72px; height: 90px; border-radius: 8px; transform: rotate(-4deg); background: #2a2150; box-shadow: 0 14px 26px -12px rgba(0,0,0,.8); }
.wz-resume-txt { display: grid; gap: 6px; }
.wz-resume-txt b { font: 800 clamp(20px, 2.2vw, 24px)/1.15 var(--lp-display); letter-spacing: -.025em; color: #fff; }
.wz-resume-txt span { font-size: 14.5px; line-height: 1.45; color: rgba(238,236,255,.66); }
.wz-resume-acts { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.wz-resume-acts .lp-btn { flex: 1 1 240px; }

/* ------------------------------ menos movimento ------------------------------ */
@media (prefers-reduced-motion: reduce) {
  .wz-bg::before, .wz-bg::after, .wz-mood-dificil::before, .wz-done-rays, .wz-done-art img, .wz-whats, .wz-badge::before,
  .wz-mood-dificil[aria-checked="true"] .wz-mood-e, .wz.is-entering .wz-shell, .wz-step.in-fwd, .wz-step.in-back, .is-pop,
  .wz-side[data-mode] .wz-cardbox, .wz.is-quake .wz-shell, .wz-step.is-shake .wz-body { animation: none !important; }
  .wz-tick, .wz-gcard, .wz-skin, .wz-mood, .wz-next, .wz-screen, .wz-cardbox { transition: none !important; }
}

#wz #link { flex: 1; min-width: 0; min-height: 48px; margin: 0; padding: 0 12px; border: 0; border-radius: 12px; background: none; box-shadow: none;
  font: 700 14.5px/1 var(--body); color: var(--wz-mute); text-overflow: ellipsis; letter-spacing: 0; text-align: left; }
.wz-revenge + .wz-steps .wz-kicker { margin-top: 18px; }
#wz #link:focus { color: #fff; background: rgba(255,255,255,.05); }
.wz-title:focus, .wz-title:focus-visible, .wz-done-t:focus-visible { outline: none; box-shadow: none; }

/* ------------------------------ ocasião (DZOcasioesUI.picker no escuro) ------------------------------ */
.wz .wz-occs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.wz .oc-card {
  position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 12px; align-items: center;
  min-height: 78px; padding: 12px 34px 12px 12px; border: 0; border-radius: 20px; text-align: left; color: var(--wz-ink); cursor: pointer;
  background: var(--wz-glass); box-shadow: inset 0 0 0 1px var(--wz-line); transition: background-color .2s, box-shadow .2s, transform .25s var(--wz-ease);
  -webkit-tap-highlight-color: transparent;
}
.wz .oc-card::after { display: none; }
@media (hover: hover) { .wz .oc-card:not(:disabled):hover { transform: translateY(-2px); background: var(--wz-glass2); } }
.wz .oc-card .oc-e {
  grid-row: span 2; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; font-size: 28px; line-height: 1;
  background: radial-gradient(circle at 35% 30%, rgba(255,255,255,.28), rgba(255,255,255,.06)); box-shadow: inset 0 0 0 1px rgba(255,255,255,.1);
}
.wz .oc-card .oc-t { align-self: end; font: 800 16.5px/1.15 var(--lp-display); letter-spacing: -.02em; color: #fff; }
.wz .oc-card .oc-d { align-self: start; margin-top: 2px; font-size: 12.5px; line-height: 1.3; color: var(--wz-mute); }
.wz .oc-card[aria-checked="true"] { background: rgba(255,207,90,.1); box-shadow: inset 0 0 0 2px var(--wz-gold), 0 18px 36px -22px rgba(255,207,90,.6); }
.wz .oc-card .wz-tick { top: 8px; right: 8px; width: 22px; height: 22px; background-size: 12px; }
.wz .oc-card.soon { opacity: .45; cursor: not-allowed; background: none; box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); }
.wz .oc-card.soon .oc-d { text-transform: uppercase; letter-spacing: .12em; font-weight: 900; font-size: 10px; color: var(--wz-gold); }
.wz .oc-card.soon .oc-e { filter: grayscale(.6); }
.wz .oc-card:focus-visible { outline: none; box-shadow: var(--ring-dark); }
.wz .oc-card[data-id="natal"] .oc-e { background: radial-gradient(circle at 35% 30%, rgba(120,220,150,.45), rgba(200,40,60,.25)); }
.wz .oc-card[data-id="criancas"] .oc-e { background: radial-gradient(circle at 35% 30%, rgba(120,210,255,.5), rgba(255,200,80,.25)); }
.wz .oc-card[data-id="aniversario"] .oc-e { background: radial-gradient(circle at 35% 30%, rgba(255,140,190,.5), rgba(255,210,100,.25)); }
.wz .oc-card[data-id="convite"] .oc-e { background: radial-gradient(circle at 35% 30%, rgba(160,170,255,.5), rgba(255,200,120,.2)); }
.wz .oc-card[data-id="casamento"] .oc-e { background: radial-gradient(circle at 35% 30%, rgba(255,255,255,.55), rgba(220,190,120,.3)); }
.wz .oc-card[data-id="formatura"] .oc-e { background: radial-gradient(circle at 35% 30%, rgba(120,160,255,.5), rgba(255,207,90,.25)); }
.wz .oc-card[data-id="amor"] .oc-e { background: radial-gradient(circle at 35% 30%, rgba(255,110,140,.55), rgba(160,40,90,.3)); }
.wz .oc-card[data-id="carinho"] .oc-e { background: radial-gradient(circle at 35% 30%, rgba(255,230,120,.55), rgba(120,220,160,.25)); }
@media (min-width: 1000px) { .wz .wz-occs { gap: 12px; } }
@media (max-width: 380px) { .wz .oc-card { grid-template-columns: 44px minmax(0, 1fr); } .wz .oc-card .oc-e { width: 44px; height: 44px; font-size: 24px; } }

/* ------------------------------ convite (DZConvite.editor no escuro) ------------------------------ */
.wz .wz-invite .inv-hint { color: var(--wz-mute); font-size: 15px; margin: 0 0 12px; }
.wz .wz-invite .inv-kinds { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.wz .wz-invite .inv-kinds .chip { border: 0; }
.wz .wz-invite .inv-kinds .chip[aria-pressed="true"] { color: #2a1700; background: var(--wz-gold); }
.wz .wz-invite .row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0 0 14px; }
.wz .wz-invite .row > .wide { grid-column: 1 / -1; }
@media (max-width: 480px) { .wz .wz-invite .row:not(.inv-when) { grid-template-columns: 1fr; } }
.wz .wz-invite .inv-f { display: flex; flex-direction: column; gap: 8px; font: 800 12px/1.2 var(--body); letter-spacing: .12em; text-transform: uppercase; color: var(--wz-mute); }
.wz .wz-invite .inv-f input, .wz .wz-invite .inv-f textarea { font-size: 18px; text-transform: none; letter-spacing: 0; }
.wz .wz-invite input[type="date"], .wz .wz-invite input[type="time"] { color-scheme: dark; min-width: 0; }
.wz .wz-invite textarea { min-height: 60px; resize: vertical; }

/* login, cota e avisos ficam por cima do criador */
#login, #quota { z-index: 80; }
.toast { z-index: 90 !important; }

/* teclado aberto (celular): a moldura cabe na área visível; rodapé mais baixo para o "Continuar" caber */
.wz.is-kb .wz-foot { padding-top: 8px; padding-bottom: 8px; }
.wz.is-kb .wz-foot::before { display: none; }
@media (max-width: 999px) { .wz.is-kb .wz-side { display: none; } }