.velki-btn{
  position:fixed;
  right:28px;
  bottom:28px;
  z-index:1002;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-width:50px;
  height:50px;
  padding:0 15px;
  border:1px solid rgba(255,189,83,.42);
  border-radius:9999px;
  background:#1D1002;
  color:#fff;
  box-shadow:0 14px 34px rgba(29,16,2,.22);
  font-family:Inter,Arial,sans-serif;
  font-size:12.25px;
  font-weight:850;
  letter-spacing:.02em;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}

.velki-btn:hover,
.velki-btn:focus-visible{
  transform:translateY(-2px);
  background:#2A1805;
  box-shadow:0 18px 42px rgba(29,16,2,.30);
}

.velki-has-wa .velki-btn{
  right:96px;
}

.velki-btn:focus-visible,
.velki-close:focus-visible,
.velki-reset:focus-visible,
.velki-option:focus-visible,
.velki-send:focus-visible,
.velki-whatsapp:focus-visible{
  outline:3px solid rgba(255,189,83,.48);
  outline-offset:3px;
}

.velki-btn-mark{
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#FFBD53;
  color:#1D1002;
  font-size:11px;
  font-weight:950;
}

.velki-panel{
  position:fixed;
  right:28px;
  bottom:90px;
  z-index:1004;
  width:min(360px,calc(100vw - 32px));
  max-height:min(620px,calc(100vh - 124px));
  display:none;
  overflow:hidden;
  border:1px solid #DDD8D2;
  border-radius:18px;
  background:#FFFDF9;
  box-shadow:0 22px 70px rgba(29,16,2,.22);
  color:#1D1002;
  font-family:Inter,Arial,sans-serif;
}

.velki-panel.open{
  display:flex;
  flex-direction:column;
}

.velki-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border-bottom:1px solid #DDD8D2;
  background:#F7F5F2;
}

.velki-head-main{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
}

.velki-avatar{
  width:34px;
  height:34px;
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#1D1002;
  color:#FFBD53;
  font-size:12px;
  font-weight:950;
}

.velki-title{
  margin:0;
  font-size:13.5px;
  line-height:1.15;
  font-weight:850;
}

.velki-subtitle{
  margin:2px 0 0;
  color:#767371;
  font-size:10.5px;
  line-height:1.25;
}

.velki-head-actions{
  display:flex;
  align-items:center;
  gap:6px;
}

.velki-reset,
.velki-close{
  width:30px;
  height:30px;
  border:1px solid #DDD8D2;
  border-radius:999px;
  background:#fff;
  color:#1D1002;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:15px;
  line-height:1;
}

.velki-reset{
  font-size:14px;
}

.velki-body{
  padding:11px;
  overflow:auto;
  overscroll-behavior:contain;
}

.velki-msg{
  max-width:95%;
  padding:9px 11px;
  border-radius:13px;
  margin-bottom:7px;
  font-size:12.25px;
  line-height:1.36;
  white-space:pre-line;
}

.velki-msg.bot{
  background:#fff;
  border:1px solid #EEE7DD;
  color:#1D1002;
}

.velki-msg.user{
  margin-left:auto;
  background:#1D1002;
  color:#fff;
}

.velki-msg.strong{
  border-color:rgba(154,106,30,.28);
  background:#F7F1E7;
}

.velki-options{
  display:grid;
  gap:6px;
  margin-top:8px;
}

.velki-option{
  width:100%;
  min-height:34px;
  text-align:left;
  border:1px solid #DDD8D2;
  background:#fff;
  color:#1D1002;
  border-radius:11px;
  padding:8px 10px;
  font-size:11.75px;
  font-weight:760;
  line-height:1.25;
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}

.velki-option:hover{
  border-color:#9A6A1E;
  background:#F7F5F2;
  transform:translateY(-1px);
}

.velki-step,
.velki-form{
  display:none;
  margin-top:8px;
  padding:10px;
  border:1px solid #DDD8D2;
  border-radius:13px;
  background:#fff;
}

.velki-step.show,
.velki-form.show{
  display:block;
}

.velki-input,
.velki-textarea{
  width:100%;
  border:1px solid #DDD8D2;
  border-radius:10px;
  padding:8px 10px;
  margin-bottom:7px;
  background:#FFFDF9;
  color:#1D1002;
  font:500 11.75px/1.32 Inter,Arial,sans-serif;
}

.velki-textarea{
  min-height:74px;
  resize:vertical;
}

.velki-input:focus,
.velki-textarea:focus{
  outline:none;
  border-color:#9A6A1E;
  box-shadow:0 0 0 3px rgba(154,106,30,.14);
}

.velki-note{
  margin:4px 0 8px;
  color:#767371;
  font-size:10.25px;
  line-height:1.4;
}

.velki-check{
  display:flex;
  align-items:flex-start;
  gap:7px;
  margin:2px 0 9px;
  color:#53514F;
  font-size:10.25px;
  line-height:1.45;
}

.velki-check input{
  margin-top:2px;
  accent-color:#9A6A1E;
}

.velki-check a{
  color:#9A6A1E;
  text-decoration:underline;
}

.velki-send,
.velki-whatsapp{
  width:100%;
  min-height:38px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:0;
  border-radius:10px;
  padding:9px 11px;
  font-size:11.75px;
  font-weight:900;
  text-decoration:none;
}

.velki-send{
  background:#FFBD53;
  color:#1D1002;
}

.velki-send:disabled{
  cursor:not-allowed;
  opacity:.64;
}

.velki-whatsapp{
  margin-top:10px;
  background:#25D366;
  color:#fff;
}

.velki-error{
  margin-top:10px;
  color:#6D4A12;
  font-size:11px;
  line-height:1.45;
}

.velki-honeypot{
  position:absolute!important;
  left:-10000px!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
}

@media(max-width:1023px){
  .wa-btn{
    display:flex!important;
    right:76px!important;
    bottom:calc(18px + env(safe-area-inset-bottom,0px))!important;
    width:48px!important;
    height:48px!important;
    z-index:1002!important;
  }

  .wa-btn svg{
    width:20px;
    height:20px;
  }

  .velki-btn{
    right:18px;
    bottom:calc(18px + env(safe-area-inset-bottom,0px));
    width:48px;
    min-width:48px;
    height:48px;
    padding:0;
  }

  .velki-has-wa .velki-btn{
    right:18px;
  }

  .velki-btn span:not(.velki-btn-mark){
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    white-space:nowrap;
  }
}

@media(max-width:767px){
  .velki-panel{
    right:12px;
    bottom:calc(78px + env(safe-area-inset-bottom,0px));
    width:calc(100vw - 24px);
    max-height:min(560px,62dvh);
    border-radius:18px;
  }

  .velki-head{
    padding:10px 12px;
    gap:10px;
  }

  .velki-head-main{
    gap:9px;
  }

  .velki-avatar{
    width:32px;
    height:32px;
    font-size:12px;
  }

  .velki-title{
    font-size:13px;
  }

  .velki-subtitle{
    font-size:10px;
  }

  .velki-reset,
  .velki-close{
    width:30px;
    height:30px;
    font-size:15px;
  }

  .velki-body{
    padding:9px;
  }

  .velki-msg{
    max-width:100%;
    padding:7px 9px;
    border-radius:12px;
    margin-bottom:6px;
    font-size:11.5px;
    line-height:1.32;
  }

  .velki-options{
    gap:5px;
    margin-top:7px;
  }

  .velki-option{
    min-height:31px;
    border-radius:11px;
    padding:7px 9px;
    font-size:11.25px;
  }

  .velki-step,
  .velki-form{
    margin-top:7px;
    padding:9px;
    border-radius:13px;
  }

  .velki-input,
  .velki-textarea{
    padding:8px 9px;
    margin-bottom:6px;
    border-radius:10px;
    font-size:11.25px;
  }

  .velki-textarea{
    min-height:68px;
  }

  .velki-note,
  .velki-check{
    font-size:10px;
  }

  .velki-send,
  .velki-whatsapp{
    min-height:36px;
    padding:9px 11px;
    border-radius:11px;
    font-size:11.25px;
  }
}

@media(prefers-reduced-motion:reduce){
  .velki-btn,
  .velki-option{
    transition:none;
  }
}
