/* V6.49: useful motion and feedback throughout ad creation. */
.nap-voice-meter:empty { display: none; }
.nap-voice-meter {
  box-sizing: border-box;
  margin: .65rem 0 .5rem;
  padding: .8rem 1rem;
  min-width: 0;
  border-radius: 1rem;
  background: #111;
  color: #fff;
  box-shadow: 0 .7rem 1.5rem rgba(0,0,0,.13);
}
.nap-voice-meter__top { display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.25rem .75rem;font-size:.9rem }
.nap-voice-meter__label { color:#ffe45c }
.nap-voice-meter__time { font-variant-numeric:tabular-nums;white-space:nowrap }
.nap-voice-meter__wave { display:flex;align-items:center;justify-content:center;gap:clamp(2px,.7vw,5px);height:56px;margin:.35rem 0;overflow:hidden }
.nap-voice-meter__wave[hidden] { display:none }
.nap-voice-meter__bar { display:block;flex:1 1 0;max-width:8px;min-width:1px;height:4px;border-radius:5px;background:#ffe45c;transition:height 60ms linear }
.nap-voice-meter__hint { display:block;color:#ddd;font-size:.78rem;line-height:1.45 }
.voice-field.nap-voice-recording button {
  background:#ffe45c;color:#111;
  box-shadow:0 0 0 3px #111,0 0 calc(10px + var(--nap-voice-level,0)*24px) rgba(255,228,92,calc(.25 + var(--nap-voice-level,0)*.6));
  transform:scale(calc(1 + var(--nap-voice-level,0)*.09));
  transition:transform 70ms linear,box-shadow 70ms linear;
}
.voice-field.nap-voice-recording button svg { display:none }
.voice-field.nap-voice-recording button::after { content:'';display:block;width:.85rem;height:.85rem;border-radius:2px;background:currentColor }
.voice-field.nap-voice-complete textarea { animation:napVoiceComplete .75s ease-out }
@keyframes napVoiceComplete { 40% { border-color:#d7b900;box-shadow:0 0 0 4px rgba(255,228,92,.35) } }
.nap-voice-result { display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.65rem .75rem;border:1px solid #ead24b;border-radius:.85rem;background:#fff9d9;animation:napResultIn .32s ease-out }
.nap-voice-result__message { min-width:0;color:#555;font-size:.8rem;line-height:1.4 }
.nap-voice-result__message b { display:block;color:#111;font-size:.88rem }
.nap-voice-result__again { flex:0 0 auto;border:0;border-radius:.7rem;background:#111;color:#ffe45c;padding:.65rem .75rem;font:inherit;font-size:.78rem;font-weight:800;cursor:pointer }
@keyframes napResultIn { from { opacity:0;transform:translateY(-5px) } }

.nap-final-preview { display:grid;grid-template-columns:5rem minmax(0,1fr);gap:.8rem;align-items:center;padding:.75rem;margin-bottom:1rem;border:1px solid #e4ca35;border-radius:1rem;background:linear-gradient(135deg,#fffdf2,#fff7c8);animation:napCardIn .42s cubic-bezier(.2,.8,.25,1) }
.nap-final-preview img { width:5rem;height:4.2rem;object-fit:cover;border-radius:.75rem;background:#f1f0eb }
.nap-final-preview div { min-width:0 }
.nap-final-preview span { display:block;color:#71640e;font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase }
.nap-final-preview strong { display:block;overflow:hidden;margin:.2rem 0;text-overflow:ellipsis;white-space:nowrap;font-size:.95rem }
.nap-final-preview b { display:block;color:#555;font-size:.82rem }
@keyframes napCardIn { from { opacity:0;transform:translateY(10px) scale(.98) } }

.success-state>span { animation:napSuccessPop .55s cubic-bezier(.2,1.5,.45,1) }
@keyframes napSuccessPop { from { opacity:0;transform:scale(.45) rotate(-12deg) } }
.nap-success-actions { display:grid;grid-template-columns:1fr 1fr;gap:.65rem;width:min(100%,30rem) }
.nap-success-actions button { width:100%;margin:0 }
.nap-success-notice { min-height:1.35em;color:#555;font-size:.82rem }

@media (max-width:540px) {
  .nap-voice-result { align-items:stretch;flex-direction:column }
  .nap-voice-result__again { width:100% }
  .nap-success-actions { grid-template-columns:1fr }
}
@media (prefers-reduced-motion:reduce) {
  .nap-voice-meter__bar,.voice-field.nap-voice-recording button { transition:none }
  .voice-field.nap-voice-complete textarea,.nap-voice-result,.nap-final-preview,.success-state>span { animation:none }
  .voice-field.nap-voice-recording button { transform:none }
}
