/* Pergunte à Sibila por voz (/app/sibila-voz/): prefixo .sv- */
.sv-topo { position: relative; text-align: center; padding: 8px 0 6px; }
.sv-titulo { font-family: var(--display); margin: 4px 0 6px; }
.sv-topo .lede { margin-inline: auto; }
.sv-ia { display: inline-block; padding: 6px 12px; border-radius: 999px; border: 1px solid rgba(155,132,242,.4); background: rgba(155,132,242,.1); color: var(--violet-soft); margin: 4px 0 0; }

/* Vela */
.sv-vela { position: relative; width: 60px; height: 92px; margin: 0 auto 6px; }
.sv-cera { position: absolute; left: 50%; bottom: 0; width: 22px; height: 46px; transform: translateX(-50%); border-radius: 4px 4px 3px 3px; background: linear-gradient(90deg, #cdb98a, #f4e8c8 45%, #b9a272); }
.sv-pavio { position: absolute; left: 50%; bottom: 46px; width: 2px; height: 7px; transform: translateX(-50%); background: #3a2d1a; }
.sv-chama { position: absolute; left: 50%; bottom: 50px; width: 14px; height: 26px; transform: translateX(-50%); border-radius: 50% 50% 45% 45% / 70% 70% 30% 30%; background: radial-gradient(ellipse at 50% 75%, #fff 0 18%, #ffe39a 30%, #f0a33c 62%, rgba(240,120,40,0) 75%); transform-origin: 50% 100%; animation: sv-chama 1.6s ease-in-out infinite; }
.sv-halo { position: absolute; left: 50%; bottom: 36px; width: 120px; height: 120px; transform: translate(-50%, 30%); border-radius: 50%; background: radial-gradient(circle, rgba(255,214,130,.32), rgba(216,181,106,.08) 45%, transparent 70%); animation: sv-halo 2.4s ease-in-out infinite; pointer-events: none; }
@keyframes sv-chama { 0%, 100% { transform: translateX(-50%) scale(1, 1) rotate(-1deg); } 30% { transform: translateX(-52%) scale(.94, 1.08) rotate(2deg); } 60% { transform: translateX(-48%) scale(1.04, .95) rotate(-2deg); } }
@keyframes sv-halo { 0%, 100% { opacity: .75; transform: translate(-50%, 30%) scale(1); } 50% { opacity: 1; transform: translate(-50%, 30%) scale(1.08); } }

/* Pergunta */
.sv-pergunta { display: grid; justify-items: center; gap: 8px; margin-top: 14px; }
.sv-mic { width: 86px; height: 86px; border-radius: 50%; border: 1px solid rgba(216,181,106,.7); background: radial-gradient(circle at 35% 30%, #3d2f7c, #160f33); color: var(--gold); display: grid; place-items: center; cursor: pointer; box-shadow: 0 0 30px -6px rgba(216,181,106,.5); transition: transform .2s; }
.sv-mic:active { transform: scale(.95); }
.sv-mic svg { width: 38px; height: 38px; fill: currentColor; }
.sv-mic.on { background: radial-gradient(circle, #e8c77e, #a07a32); color: #1a1438; animation: sv-pulso 1.4s ease-out infinite; }
@keyframes sv-pulso { 0% { box-shadow: 0 0 0 0 rgba(216,181,106,.6); } 100% { box-shadow: 0 0 0 26px rgba(216,181,106,0); } }
.sv-onda { display: flex; gap: 5px; align-items: center; justify-content: center; height: 40px; }
.sv-onda i { width: 4px; height: 4px; border-radius: 3px; background: linear-gradient(var(--gold), var(--violet)); opacity: .45; transition: opacity .3s; }
.sv-onda.ouvindo i { opacity: 1; animation: sv-onda 1.1s ease-in-out infinite; }
.sv-onda.falando i { animation-duration: .5s; }
.sv-onda i:nth-child(2n) { animation-delay: -.35s; } .sv-onda i:nth-child(3n) { animation-delay: -.7s; } .sv-onda i:nth-child(5n) { animation-delay: -.2s; }
@keyframes sv-onda { 0%, 100% { height: 4px; } 50% { height: 34px; } }
.sv-mic-msg { margin: 0; text-align: center; min-height: 1.2em; }
.sv-rot { justify-self: stretch; font-weight: 600; margin-top: 4px; }
.sv-pergunta textarea { width: 100%; box-sizing: border-box; padding: 12px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface-2); color: var(--fg); font: 16px/1.5 var(--body); resize: vertical; }
.sv-pergunta textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(216,181,106,.15); }
.sv-dica { justify-self: stretch; margin: 0; }
.sv-erro { color: var(--hot); margin: 0; min-height: 1em; }
.sv-tirar { width: 100%; }
#sv-cota { justify-self: stretch; text-align: center; }

/* Mesa e cartas 3D */
.sv-mesa { margin-top: 22px; }
.sv-cartas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; perspective: 1000px; }
.sv-carta { aspect-ratio: 2 / 3.3; }
.sv-carta-in { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transition: transform .8s cubic-bezier(.3,.7,.2,1); }
.sv-carta.virada .sv-carta-in { transform: rotateY(180deg); }
.sv-lado { position: absolute; inset: 0; border-radius: 12px; border: 1px solid var(--gold); backface-visibility: hidden; -webkit-backface-visibility: hidden; display: grid; place-items: center; overflow: hidden; }
.sv-verso { background: linear-gradient(160deg, #2a1f5e, #120d29); color: var(--gold); }
.sv-verso svg { width: 70%; }
.sv-frente { transform: rotateY(180deg); background: radial-gradient(circle at 50% 30%, #2f2468, #140e30 75%); align-content: center; gap: 4px; padding: 8px; text-align: center; box-shadow: 0 0 22px -6px rgba(216,181,106,.6); }
.sv-pos { font-size: 10.5px; letter-spacing: .04em; text-transform: uppercase; color: var(--violet-soft); line-height: 1.2; }
.sv-num { font-family: var(--display); font-size: 1.5rem; color: var(--gold); font-variant-numeric: lining-nums; }
.sv-nome { font-family: var(--display); font-size: 1.05rem; color: var(--gold-soft); line-height: 1.15; }
.sv-link { color: var(--muted); }
.sv-status { text-align: center; margin: 14px 0 0; }
.sv-mesa.lendo .sv-carta { animation: sv-respira 1.8s ease-in-out infinite; animation-delay: calc(var(--i) * .25s); }
@keyframes sv-respira { 0%, 100% { transform: translateY(0); filter: drop-shadow(0 0 0 rgba(216,181,106,0)); } 50% { transform: translateY(-6px); filter: drop-shadow(0 0 12px rgba(216,181,106,.55)); } }

/* Leitura */
.sv-texto { margin-top: 18px; }
.sv-texto h3 { font-family: var(--display); font-size: 22px; color: var(--gold-soft); margin: 16px 0 4px; }
.sv-ouvir { margin: 6px 0 4px; }
.sv-ouvir.on { border-color: var(--gold); color: var(--gold); box-shadow: 0 0 18px -4px rgba(216,181,106,.6); }
.sv-aviso-ia { margin-top: 14px; }
.sv-mail { margin-top: 18px; }
.sv-mail h2 { font-family: var(--display); margin: 4px 0 6px; }
#sv-trava .app-trava, .sv-mesa .app-trava { margin-top: 18px; }

@media (prefers-reduced-motion: no-preference) {
  .sv-surge { animation: sv-surge .9s ease both; animation-delay: calc(var(--i, 0) * 260ms); }
  @keyframes sv-surge { from { opacity: 0; transform: translateY(8px); filter: blur(3px); } to { opacity: 1; transform: none; filter: none; } }
  .sv-in { animation: sv-surge .6s ease both; }
  .sv-carta { animation: sv-chega .6s ease both; animation-delay: calc(var(--i) * 120ms); }
  @keyframes sv-chega { from { opacity: 0; transform: translateY(24px) rotate(-4deg); } to { opacity: 1; transform: none; } }
}
@media (prefers-reduced-motion: reduce) { .sv-chama, .sv-halo, .sv-onda i, .sv-mic.on, .sv-mesa.lendo .sv-carta { animation: none !important; } .sv-carta-in { transition: none; } }
@media (max-width: 360px) { .sv-nome { font-size: .92rem; } .sv-pos { font-size: 9.5px; } }